Generated code from pixels2flutter.dev

main.dart

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        useMaterial3: true,
      ),
      home: const HomePage(),
    );
  }
}

class HomePage extends StatelessWidget {
  const HomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: Column(
        children: [
          Container(
            color: const Color(0xFF4CAF50),
            padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 16),
            child: Column(
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    CircleAvatar(
                      radius: 24,
                      backgroundImage: NetworkImage(
                        'https://placehold.co/48x48?description=Profile%20picture%20of%20a%20person%20in%20a%20spacesuit%20with%20a%20purple%20background',
                      ),
                    ),
                    ElevatedButton.icon(
                      onPressed: () {},
                      icon: const Icon(Icons.person_add),
                      label: const Text('Invite friends'),
                      style: ElevatedButton.styleFrom(
                        backgroundColor: Colors.white,
                        foregroundColor: Colors.black,
                      ),
                    ),
                  ],
                ),
                const SizedBox(height: 20),
                const Text(
                  '\$8,282.24',
                  style: TextStyle(
                    fontSize: 48,
                    color: Colors.white,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                const Text(
                  '₹23,252.22',
                  style: TextStyle(
                    fontSize: 24,
                    color: Colors.white,
                  ),
                ),
              ],
            ),
          ),
          const Padding(
            padding: EdgeInsets.symmetric(horizontal: 16, vertical: 20),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text(
                  'Latest transactions',
                  style: TextStyle(
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                Text(
                  'SHOW ALL',
                  style: TextStyle(
                    fontSize: 16,
                    color: Colors.blue,
                    decoration: TextDecoration.underline,
                  ),
                ),
              ],
            ),
          ),
          Expanded(
            child: ListView(
              children: [
                transactionItem(
                  'https://placehold.co/40x40?description=Icon%20with%20letter%20S',
                  'Sent To Stephan',
                  'Today at 1:24 PM',
                  '- \$226.62',
                  Colors.red,
                ),
                transactionItem(
                  'https://placehold.co/40x40?description=Profile%20picture%20of%20a%20robot%20with%20a%20blue%20background',
                  'From George',
                  'Yesterday at 2:55 PM',
                  '\$723.51',
                  Colors.green,
                ),
                transactionItem(
                  'https://placehold.co/40x40?description=Icon%20with%20letter%20S',
                  'Sent To Stephan',
                  'Monday at 11:24 AM',
                  '- \$90.50',
                  Colors.red,
                ),
                transactionItem(
                  'https://placehold.co/40x40?description=Profile%20picture%20of%20a%20robot%20with%20an%20orange%20background',
                  'From Matthew',
                  'Friday at 3:12 PM',
                  '\$3,150.00',
                  Colors.green,
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget transactionItem(String imageUrl, String title, String subtitle,
      String amount, Color amountColor) {
    return ListTile(
      leading: CircleAvatar(
        backgroundImage: NetworkImage(imageUrl),
        radius: 20,
      ),
      title: Text(title),
      subtitle: Text(subtitle),
      trailing: Text(
        amount,
        style: TextStyle(
          color: amountColor,
          fontSize: 16,
        ),
      ),
    );
  }
}