Lección 3 del Curso App Restaurant con Carrito

Diseño de la pantalla de Inicio | CURSO DE FLUTTER APP RESTAURANT CON CARRITO DE COMPRA [Parte 3]

Pantalla Inicio
Pantalla Inicio

Diseño de la pantalla de Inicio de la App

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

Diseño de la pantalla de Inicio | CURSO DE FLUTTER APP RESTAURANT CON CARRITO DE COMPRA [Parte 3]

Diseño de la pantalla de Inicio | CURSO DE FLUTTER APP RESTAURANT CON CARRITO DE COMPRA [Parte 3]

Integraremos  los siguientes widgets principales para asegurar  el diseño e interacción de nuestra aplicación:

  • Image
  • Text
  • RaisedButton

Veamos parte del código en el Dart:

import 'package:flutter/material.dart';
import 'package:restaurant/pantallaCarta.dart';

class PantallaInicio extends StatefulWidget {
  @override
  _PantallaInicioState createState() => _PantallaInicioState();
}

class _PantallaInicioState extends State<PantallaInicio> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.amberAccent,
      body: Container(
        child: Stack(
          children: <Widget>[
            Positioned(
              child: Align(
                alignment: FractionalOffset.bottomRight,
                child: Container(
                  padding: EdgeInsets.only(right: 15,left: 5, top: 50, bottom: 50),
                  decoration: BoxDecoration(
                    ....
                  ),
                  child: RotatedBox(
                   ...
                    child: Padding(
                      padding: EdgeInsets.only(top: 10),
                      child: Text("La mejor comida típika",style: TextStyle(
                        color: Colors.amberAccent,
                        fontStyle: FontStyle.italic,
                        fontSize: 20,
                        letterSpacing: 5

                      ),),
                    ),
                  ),
                ),
              ),
            ),
            Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Center(
...
                  ),
                ),
                Padding(
                  padding: EdgeInsets.only(top: 100),
                ),
                RaisedButton(
                  shape: CircleBorder(),
                  padding: EdgeInsets.all(13.0),
                  color: Colors.red,
                  child: Icon(
                    Icons.chevron_right,
                    color: Colors.white,
                  ),
                  onPressed: (){
                   ...
                  },
                )
              ],
            )
          ],
        ),
      ),
    );
  }
}

 


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

276 visitas

Logo Codea App

Develop your code

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