Generated code from pixels2flutter.dev

main.dart

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        brightness: Brightness.dark,
        primarySwatch: Colors.grey,
      ),
      home: OrderPage(),
    );
  }
}

class OrderPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: IconButton(
          icon: Icon(Icons.arrow_back),
          onPressed: () {},
        ),
        title: Text('Atras...'),
        backgroundColor: Colors.black,
      ),
      body: Column(
        children: [
          Padding(
            padding: const EdgeInsets.all(16.0),
            child: TextField(
              decoration: InputDecoration(
                hintText: 'Buscar en Pedidos',
                prefixIcon: Icon(Icons.search),
                filled: true,
                fillColor: Colors.white,
                border: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(30.0),
                  borderSide: BorderSide.none,
                ),
              ),
            ),
          ),
          Expanded(
            child: ListView(
              children: [
                Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 16.0),
                  child: Column(
                    children: [
                      SizedBox(height: 40),
                      Text(
                        'Agrega artículos para llenar tu bolsita',
                        style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
                      ),
                      SizedBox(height: 16),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Icon(Icons.shopping_bag, size: 40),
                          SizedBox(width: 8),
                          Icon(Icons.arrow_forward, size: 40),
                          SizedBox(width: 8),
                          Icon(Icons.shopping_bag, size: 40),
                        ],
                      ),
                      SizedBox(height: 16),
                      Text(
                        'Una vez que agregues artículos de un restaurante o negocio, se agregará a tu bolsita y aparecerá aquí.',
                        textAlign: TextAlign.center,
                        style: TextStyle(fontSize: 16),
                      ),
                      SizedBox(height: 24),
                      ElevatedButton(
                        onPressed: () {},
                        child: Text('Empieza a comprar'),
                        style: ElevatedButton.styleFrom(
                          primary: Colors.white,
                          onPrimary: Colors.black,
                          textStyle: TextStyle(fontSize: 16),
                        ),
                      ),
                    ],
                  ),
                ),
                Divider(color: Colors.white),
                ListTile(
                  title: Text('Ver historial de pedidos'),
                  leading: Icon(Icons.history),
                  onTap: () {},
                ),
                Divider(color: Colors.white),
                OrderItem(
                  title: 'Mr. Sandwiches',
                  items: '2 Artículos',
                  price: '\$349',
                  date: '19-Sept',
                  status: 'Completado',
                  imageUrl: 'https://placehold.co/100x100?description=Sandwich',
                ),
                OrderItem(
                  title: 'Pizzas Julio',
                  items: '2 Artículos',
                  price: '\$500',
                  date: '19-Sept',
                  status: 'Completado',
                  imageUrl: 'https://placehold.co/100x100?description=Pizza',
                ),
              ],
            ),
          ),
        ],
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(Icons.explore),
            label: 'Explorar',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            label: 'Inicio',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.store),
            label: 'Food Market',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.shopping_bag),
            label: 'Bolsa',
          ),
        ],
        selectedItemColor: Colors.white,
        unselectedItemColor: Colors.grey,
        backgroundColor: Colors.black,
      ),
    );
  }
}

class OrderItem extends StatelessWidget {
  final String title;
  final String items;
  final String price;
  final String date;
  final String status;
  final String imageUrl;

  const OrderItem({
    Key? key,
    required this.title,
    required this.items,
    required this.price,
    required this.date,
    required this.status,
    required this.imageUrl,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Card(
      color: Colors.black,
      child: ListTile(
        leading: Image.network(imageUrl),
        title: Text(title),
        subtitle: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(items),
            Text(price),
            Text(date),
            Text(status),
          ],
        ),
        trailing: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            ElevatedButton(
              onPressed: () {},
              child: Text('Ver Pedido'),
              style: ElevatedButton.styleFrom(
                primary: Colors.white,
                onPrimary: Colors.black,
                textStyle: TextStyle(fontSize: 12),
              ),
            ),
            SizedBox(height: 4),
            ElevatedButton(
              onPressed: () {},
              child: Text('Volver a pe..'),
              style: ElevatedButton.styleFrom(
                primary: Colors.white,
                onPrimary: Colors.black,
                textStyle: TextStyle(fontSize: 12),
              ),
            ),
          ],
        ),
      ),
    );
  }
}