ソースを参照

SLiver Child View

c90Beretta 2 ヶ月 前
コミット
d581493595
共有2 個のファイルを変更した205 個の追加75 個の削除を含む
  1. 75 15
      lib/mvvm/views/home/categorias_navbar.dart
  2. 130 60
      lib/mvvm/views/home/home_screen.dart

+ 75 - 15
lib/mvvm/views/home/categorias_navbar.dart

@@ -13,7 +13,7 @@ class _CategoriasNavBarState extends State<CategoriasNavBar> {
     return Column(
       children: [
         Container(
-          color: const Color.fromARGB(255, 174, 174, 174),
+          color: Colors.black,
           padding: const EdgeInsets.symmetric(vertical: 15),
           child: Row(
             children: [
@@ -33,7 +33,7 @@ class _CategoriasNavBarState extends State<CategoriasNavBar> {
                   ),
                 ),
                 child: const Text(
-                  "WISTY BURGER'S",
+                  "Café",
                   style: TextStyle(
                     color: Color.fromARGB(255, 47, 208, 229),
                     fontSize: 18,
@@ -43,7 +43,79 @@ class _CategoriasNavBarState extends State<CategoriasNavBar> {
               ),
               const SizedBox(width: 40),
               const Text(
-                'ALITAS',
+                'Bolsa',
+                style: TextStyle(
+                  color: Colors.white,
+                  fontSize: 18,
+                  fontWeight: FontWeight.bold,
+                ),
+              ),
+              const SizedBox(width: 40),
+              const Text(
+                'Brunch',
+                style: TextStyle(
+                  color: Colors.white,
+                  fontSize: 18,
+                  fontWeight: FontWeight.bold,
+                ),
+              ),
+              const SizedBox(width: 40),
+              const Text(
+                'Desserts',
+                style: TextStyle(
+                  color: Colors.white,
+                  fontSize: 18,
+                  fontWeight: FontWeight.bold,
+                ),
+              ),
+              const SizedBox(width: 40),
+              const Text(
+                'Drinks',
+                style: TextStyle(
+                  color: Colors.white,
+                  fontSize: 18,
+                  fontWeight: FontWeight.bold,
+                ),
+              ),
+              const SizedBox(width: 40),
+              const Text(
+                'Smoothies',
+                style: TextStyle(
+                  color: Colors.white,
+                  fontSize: 18,
+                  fontWeight: FontWeight.bold,
+                ),
+              ),
+              const SizedBox(width: 40),
+              const Text(
+                'Tés',
+                style: TextStyle(
+                  color: Colors.white,
+                  fontSize: 18,
+                  fontWeight: FontWeight.bold,
+                ),
+              ),
+              const SizedBox(width: 40),
+              const Text(
+                'Tisanas',
+                style: TextStyle(
+                  color: Colors.white,
+                  fontSize: 18,
+                  fontWeight: FontWeight.bold,
+                ),
+              ),
+              const SizedBox(width: 40),
+              const Text(
+                'Vip',
+                style: TextStyle(
+                  color: Colors.white,
+                  fontSize: 18,
+                  fontWeight: FontWeight.bold,
+                ),
+              ),
+              const SizedBox(width: 40),
+              const Text(
+                'Libros',
                 style: TextStyle(
                   color: Colors.white,
                   fontSize: 18,
@@ -53,18 +125,6 @@ class _CategoriasNavBarState extends State<CategoriasNavBar> {
             ],
           ),
         ),
-        Container(
-          width: double.infinity,
-          padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
-          child: const Text(
-            "WISTY BURGER'S",
-            style: TextStyle(
-              color: Colors.white,
-              fontSize: 28,
-              fontWeight: FontWeight.bold,
-            ),
-          ),
-        ),
       ],
     );
   }

+ 130 - 60
lib/mvvm/views/home/home_screen.dart

@@ -3,7 +3,7 @@ import 'package:turquessa_mesas_hoster/utils/widgets/custom_appbar.dart';
 import 'package:turquessa_mesas_hoster/mvvm/views/home/categorias_navbar.dart';
 
 class HomeScreen extends StatefulWidget {
-  const HomeScreen({super.key});
+  const HomeScreen({Key? key}) : super(key: key);
 
   @override
   State<HomeScreen> createState() => _HomeScreenState();
@@ -23,88 +23,158 @@ class _HomeScreenState extends State<HomeScreen> {
   Widget build(BuildContext context) {
     return Scaffold(
         backgroundColor: Colors.white,
-        body: Column(
-          children: [
-            Container(
-              height: 120,
-              width: double.infinity,
-              decoration: BoxDecoration(
-                image: DecorationImage(
-                  image: Image.asset('assets/Turquessa.png').image,
+        body: CustomScrollView(
+          slivers: [
+            SliverAppBar(
+              floating: true,
+              expandedHeight: 200, // Ajusta la altura para acomodar la imagen
+              flexibleSpace: FlexibleSpaceBar(
+                background: Image.asset(
+                  'assets/Turquessa.png',
                   fit: BoxFit.cover,
                 ),
               ),
+              bottom: PreferredSize(
+                preferredSize:
+                    Size.fromHeight(120), // Altura del contenido adicional
+                child: Container(
+                  color: Color.fromARGB(255, 47, 208, 229),
+                  padding:
+                      const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
+                  child: Row(
+                    children: [
+                      Container(
+                        width: 80,
+                        height: 80,
+                        decoration: BoxDecoration(
+                          color: Colors.white,
+                          borderRadius: BorderRadius.circular(12),
+                        ),
+                        child: Center(
+                          child: Image.asset('assets/Turquessa.png'),
+                        ),
+                      ),
+                      const SizedBox(width: 20),
+                      const Text(
+                        'Turquessa',
+                        style: TextStyle(
+                          color: Colors.black,
+                          fontSize: 26,
+                          fontWeight: FontWeight.bold,
+                        ),
+                      ),
+                      const SizedBox(width: 15),
+                      Container(
+                        padding: const EdgeInsets.all(8),
+                        decoration: BoxDecoration(
+                          shape: BoxShape.circle,
+                          border: Border.all(color: Colors.white, width: 2),
+                        ),
+                        child: const Icon(Icons.info,
+                            color: Colors.white, size: 20),
+                      ),
+                    ],
+                  ),
+                ),
+              ),
             ),
-            Container(
-              color: Color.fromARGB(255, 47, 208, 229),
-              padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
-              child: Row(
+            SliverList(delegate: SliverChildBuilderDelegate((context, index) {
+              return Column(
                 children: [
+                  CategoriasNavBar(),
                   Container(
-                    width: 80,
-                    height: 80,
-                    decoration: BoxDecoration(
-                      color: Colors.white,
-                      borderRadius: BorderRadius.circular(12),
-                    ),
-                    child: Center(
-                      child: Image.asset('assets/Turquessa.png'),
+                    width: double.infinity,
+                    padding: const EdgeInsets.symmetric(
+                        horizontal: 20, vertical: 10),
+                    child: const Text(
+                      "Turquessa-Coffee",
+                      style: TextStyle(
+                        color: Colors.black,
+                        fontSize: 28,
+                        fontWeight: FontWeight.bold,
+                      ),
                     ),
                   ),
-                  const SizedBox(width: 20),
-                  const Text(
-                    'Turquessa',
-                    style: TextStyle(
-                      color: Colors.black,
-                      fontSize: 26,
-                      fontWeight: FontWeight.bold,
-                    ),
-                  ),
-                  const SizedBox(width: 15),
-                  Container(
-                    padding: const EdgeInsets.all(8),
-                    decoration: BoxDecoration(
-                      shape: BoxShape.circle,
-                      border: Border.all(color: Colors.white, width: 2),
-                    ),
-                    child:
-                        const Icon(Icons.info, color: Colors.white, size: 20),
-                  ),
-                ],
-              ),
-            ),
-            const CategoriasNavBar(),
-            // Burger menu items
-            Expanded(
-              child: ListView(
-                children: [
                   _buildBurgerItem(
-                      "1. HAMBURGUESA SENCILLA",
-                      "QUESO, LECHUGA, TOMATE, CEBOLLA, PEPINILLO, MAYONESA, KETCHUP Y ...",
+                      "1. Machiatto Vainilla",
+                      "Café Colombiano selecionado, hojas selectivas frescas y Espuma de vainilla...",
+                      "MXN 115.00",
+                      "https://pos.api.turquessacoffee.com/assets/recurso/2024/10/iwf7MocBl2Kb5Wzzl7xHjPyQ99OljQH.jpg"),
+                  const Divider(color: Colors.grey, height: 1),
+                  _buildBurgerItem(
+                      "2. Cappuccino Simple",
+                      "Solo café, leche y espuma de leche",
+                      "MXN 90.00",
+                      "https://pos.api.turquessacoffee.com/assets/recurso/2024/10/qgoqrqz8pO9UBN7P412Cxtz_2n2LQy_O.jpg"),
+                  const Divider(color: Colors.grey, height: 1),
+                  _buildBurgerItem(
+                      "3. Frappé de Cajeta",
+                      "Café, leche, cajeta y hielo",
+                      "MXN 130.00",
+                      "https://pos.api.turquessacoffee.com/assets/recurso/2024/10/Z6GgNgittxZpqN7qj6ub9_sKHZxUn8i0.png"),
+                  const Divider(color: Colors.grey, height: 1),
+                  _buildBurgerItem(
+                      "1. Machiatto Vainilla",
+                      "Café Colombiano selecionado, hojas selectivas frescas y Espuma de vainilla...",
                       "MXN 115.00",
                       "https://pos.api.turquessacoffee.com/assets/recurso/2024/10/iwf7MocBl2Kb5Wzzl7xHjPyQ99OljQH.jpg"),
                   const Divider(color: Colors.grey, height: 1),
                   _buildBurgerItem(
-                      "2. SINGLE BURGER",
-                      "HAMBURGUESA SOLA",
+                      "2. Cappuccino Simple",
+                      "Solo café, leche y espuma de leche",
                       "MXN 90.00",
                       "https://pos.api.turquessacoffee.com/assets/recurso/2024/10/qgoqrqz8pO9UBN7P412Cxtz_2n2LQy_O.jpg"),
                   const Divider(color: Colors.grey, height: 1),
                   _buildBurgerItem(
-                      "3. BACON BURGER",
-                      "HAMBURGUESA SENCILLA MÁS TOCINO. PAPAS Y SODA",
+                      "3. Frappé de Cajeta",
+                      "Café, leche, cajeta y hielo",
+                      "MXN 130.00",
+                      "https://pos.api.turquessacoffee.com/assets/recurso/2024/10/Z6GgNgittxZpqN7qj6ub9_sKHZxUn8i0.png"),
+                  const Divider(color: Colors.grey, height: 1),
+                  _buildBurgerItem(
+                      "1. Machiatto Vainilla",
+                      "Café Colombiano selecionado, hojas selectivas frescas y Espuma de vainilla...",
+                      "MXN 115.00",
+                      "https://pos.api.turquessacoffee.com/assets/recurso/2024/10/iwf7MocBl2Kb5Wzzl7xHjPyQ99OljQH.jpg"),
+                  const Divider(color: Colors.grey, height: 1),
+                  _buildBurgerItem(
+                      "2. Cappuccino Simple",
+                      "Solo café, leche y espuma de leche",
+                      "MXN 90.00",
+                      "https://pos.api.turquessacoffee.com/assets/recurso/2024/10/qgoqrqz8pO9UBN7P412Cxtz_2n2LQy_O.jpg"),
+                  const Divider(color: Colors.grey, height: 1),
+                  _buildBurgerItem(
+                      "3. Frappé de Cajeta",
+                      "Café, leche, cajeta y hielo",
+                      "MXN 130.00",
+                      "https://pos.api.turquessacoffee.com/assets/recurso/2024/10/Z6GgNgittxZpqN7qj6ub9_sKHZxUn8i0.png"),
+                  _buildBurgerItem(
+                      "1. Machiatto Vainilla",
+                      "Café Colombiano selecionado, hojas selectivas frescas y Espuma de vainilla...",
+                      "MXN 115.00",
+                      "https://pos.api.turquessacoffee.com/assets/recurso/2024/10/iwf7MocBl2Kb5Wzzl7xHjPyQ99OljQH.jpg"),
+                  const Divider(color: Colors.grey, height: 1),
+                  _buildBurgerItem(
+                      "2. Cappuccino Simple",
+                      "Solo café, leche y espuma de leche",
+                      "MXN 90.00",
+                      "https://pos.api.turquessacoffee.com/assets/recurso/2024/10/qgoqrqz8pO9UBN7P412Cxtz_2n2LQy_O.jpg"),
+                  const Divider(color: Colors.grey, height: 1),
+                  _buildBurgerItem(
+                      "3. Frappé de Cajeta",
+                      "Café, leche, cajeta y hielo",
                       "MXN 130.00",
                       "https://pos.api.turquessacoffee.com/assets/recurso/2024/10/Z6GgNgittxZpqN7qj6ub9_sKHZxUn8i0.png"),
                 ],
-              ),
-            ),
+              );
+            }))
           ],
         ));
   }
 }
 
 Widget _buildBurgerItem(
-    String title, String description, String price, String imageUrl) {
+    String titulo, String descripcion, String precio, String imageUrl) {
   return Padding(
     padding: const EdgeInsets.symmetric(vertical: 20),
     child: Row(
@@ -126,7 +196,7 @@ Widget _buildBurgerItem(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
               Text(
-                title,
+                titulo,
                 style: const TextStyle(
                   color: Colors.black,
                   fontSize: 22,
@@ -135,7 +205,7 @@ Widget _buildBurgerItem(
               ),
               const SizedBox(height: 10),
               Text(
-                description,
+                descripcion,
                 style: const TextStyle(
                   color: Colors.grey,
                   fontSize: 16,
@@ -143,7 +213,7 @@ Widget _buildBurgerItem(
               ),
               const SizedBox(height: 20),
               Text(
-                price,
+                precio,
                 style: const TextStyle(
                   color: Colors.black,
                   fontSize: 24,