Implementación Pantalla Producto

Lección 45 del Curso Flutter y Laravel Tienda Delivery

Implementación de la PantallaProducto para mostrar información del producto a pedir, para ello pasamos la información en una variable de PantallaProductos

Implementación Pantalla Producto

COMPRA ESTE CURSO

Y accede a todos los recursos y videos, explicación, scripts y descarga del código fuente disponible con la compra del curso

COMPRAR

Implementación de la PantallaProducto para mostrar información del producto a pedir, para ello pasamos la información en una variable de PantallaProductos

DISEÑO

  1. Recibimos la variable con la información del Producto
  2. Mostramos en un Widget Column para distribuir la información forma vertical: Imagen, nombre, descripción, precio, etc

CÓDIGO DART

import 'dart:convert';

import 'package:arequipalocal/api/Api.dart';
import 'package:arequipalocal/carrito/CarritoCompra.dart';
import 'package:provider/provider.dart';
import 'package:arequipalocal/modelo/Producto.dart';
import 'package:arequipalocal/pantalla/PantallaCarrito.dart';
import 'package:arequipalocal/pantalla/PantallaInicio.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:shared_preferences/shared_preferences.dart';

import 'package:cached_network_image/cached_network_image.dart';
class PantallaProducto extends StatefulWidget {
  PantallaProducto(this.p);
  Producto p;
  @override
  _PantallaProductoState createState() => _PantallaProductoState(this.p);
}

class _PantallaProductoState extends State<PantallaProducto> {

  _PantallaProductoState(this.p);
  Producto p;
  @override
  Widget build(BuildContext context) {
      return Scaffold(
        appBar: AppBar(
            title: Text(p.nombre),
            
             
              
        ),
        backgroundColor: Colors.orangeAccent,
        body: Container(
          margin: EdgeInsets.all(20),
          padding: EdgeInsets.all(20),
          decoration: BoxDecoration(
              color: Colors.white
          ),
          width: MediaQuery.of(context).size.width,
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              CachedNetworkImage(
                imageUrl: "http://arequipalocal.com/img/productos/"+p.urlfoto,
              ),
              Text("DESCRIPCIÓN", style: TextStyle(fontSize: 20),),
              Html(data: p.descripcion),
              SizedBox( height: 30,),
              Text("PRECIO USD "+p.precio.toString()),
              SizedBox( height: 30,),
              Text("UNIDAD " +p.unidad),
              
            ],
          ),
        ),
      );
    

  }

}

Posteriormente agregaremos el botón para agregar al carrito.

 


COMPRA ESTE CURSO

Y accede a todos los recursos y videos, explicación, scripts y descarga del código fuente disponible con la compra del curso

COMPRAR

35 visitas

Lecciones del curso

27. Autenticación con JWT
28. Enviar Productos en JSON
29. Recibir pedidos en Laravel
VER MÁS CURSOS
Logo Codea App

© Todos los derechos reservados CODEA APP | Cursos de programación avanzados con proyectos reales | 2020