import 'package:flutter/material.dart';

// Dummy data for lists
final List<String> entries = [
  'Үй',
  'Жұмыс',
  'Дүкен',
  'Жағажай',
  'Қала сырты',
  'Досымның үйі',
  'ТРК Ақтау',
  'Маңғышлақ',
  'Жұмыс #2',
];
final List<String> entriesAddresses = [
  'Көше, ш/а, үй #01',
  'Көше, ш/а, үй #01',
  'Көше, ш/а, үй #01',
  'Көше, ш/а, үй #01',
  'Көше, ш/а, үй #01',
  'Көше, ш/а, үй #01',
  'Көше, ш/а, үй #01',
  'Көше, ш/а, үй #01',
  'Көше, ш/а, үй #01',
  'Көше, ш/а, үй #01',
];

final List<IconData> icons = [
  Icons.home,
  Icons.work,
  Icons.place,
  Icons.place,
  Icons.place,
  Icons.place,
  Icons.place,
  Icons.place,
  Icons.place,
  Icons.place,
];

final appHeight = 680.0;
final appWidth = 400.0;

void main() {
  runApp(
    MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MyApp(),
    ),
  );
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Material(
      child: Stack(
        children: <Widget>[
          Opacity(
            opacity: 1,
            child: Container(
              decoration: BoxDecoration(
                color: const Color(0xff7c94b6),
                image: const DecorationImage(
                  image: NetworkImage(
                     'https://hi-service.kz/code/flutter-taxi/karta.png'),
                  fit: BoxFit.cover,
                ),
              ),
            ),
          ),
          // Menu icon
          Padding(
            padding: EdgeInsets.only(top: 48.0),
            child: Align(
              alignment: Alignment.topLeft,
              child: Container(
                padding: EdgeInsets.only(left: 20.0),
                child: Icon(
                  Icons.menu,
                  size: 36.0,
                ),
              ),
            ),
          ),
          // Top center profile menu
          Padding(
            padding: EdgeInsets.only(top: 50.0),
            child: Align(
              alignment: Alignment.topCenter,
              child: Container(
                width: 180.0,
                height: 35.0,
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(4),
                  boxShadow: [
                    BoxShadow(
                      color: Colors.grey.withOpacity(0.5),
                      spreadRadius: 5,
                      blurRadius: 7,
                      offset: Offset(0, 3),
                    ),
                  ],
                ),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  mainAxisSize: MainAxisSize.min,
                  children: <Widget>[
                    Icon(Icons.account_circle, size: 20.0),
                    Text(
                      "Cіз осы жердесіз",
                      textAlign: TextAlign.center,
                      style: TextStyle(fontSize: 14.0, fontWeight: FontWeight.w600)
                    ),
                    Icon(Icons.keyboard_arrow_down, size: 28.0),
                  ],
                ),
              ),
            ),
          ),
          // Place icon in center of map
          Padding(
            padding: EdgeInsets.only(bottom: 100.0),
            child: Align(
              alignment: Alignment.center,
              child: Icon(
                Icons.place,
                size: 48.0,
              ),
            ),
          ),
          // Bottom menu
          Align(
            alignment: Alignment.bottomCenter,
            child: Container(
              height: 330.0,
              child: Column(children: <Widget>[
                Container(
                  height: 75.0,
                  child: ListView.separated(
                    padding: EdgeInsets.all(20.0),
                    itemCount: 5,
                    scrollDirection: Axis.horizontal,
                    itemBuilder: (BuildContext context, int index) {
                      return Padding(
                        padding: EdgeInsets.only(right: 20.0),
                        child: Container(
                          height: 80.0,
                          width: 180.0,
                          decoration: BoxDecoration(
                            color: Colors.white,
                            borderRadius: BorderRadius.circular(4),
                            boxShadow: [
                              BoxShadow(
                                color: Colors.grey.withOpacity(0.5),
                                spreadRadius: 2,
                                blurRadius: 5,
                                offset: Offset(0, 3),
                              ),
                            ],
                          ),
                          child: Container(
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                              children: <Widget>[
                            Icon(Icons.departure_board),
                            //Text("Nearby Location", style: TextStyle(fontSize: 14, fontWeight: FontWeight.bold)
                                //),
                              ],
                            ),
                          ),
                        ),
                      );
                    },
                    separatorBuilder:
                        (BuildContext context, int index) =>
                            Divider()
                  )
                ),
                Expanded(
                child: Container(
                  padding: EdgeInsets.all(20.0),
                  decoration: BoxDecoration(
                    color: Colors.white,
                    boxShadow: [
                      BoxShadow(
                        color: Colors.grey.withOpacity(0.5),
                        spreadRadius: 5,
                        blurRadius: 7,
                        offset: Offset(0, 3),
                      ),
                    ],
                  ),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      Container(
                        child: Text("Қайырлы күн, Қуандық!",
                          style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
                        ),
                      ),
                      Padding(
                        padding: EdgeInsets.only(top: 10.0),
                        child: Container(
                          padding: EdgeInsets.all(10.0),
                          width: MediaQuery.of(context).size.width * 0.95,
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.center,
                            mainAxisSize: MainAxisSize.min,
                            children: <Widget>[
                              Icon(Icons.place,
                                size: 20.0,
                                color: Colors.white),
                              Text("Қайда бару керек?",
                                textAlign: TextAlign.center,
                                style: TextStyle(fontSize: 18.0, fontWeight: FontWeight.w600, color: Colors.white)
                                ),
                            ],
                          ),
                          decoration: BoxDecoration(
                            color: Colors.black,
                            borderRadius:
                              BorderRadius.circular(4),
                          ),
                        ),
                      ),
                      Expanded(
                        child: ListView.separated(
                        itemCount: entries.length,
                        itemBuilder: (BuildContext context, int index) {
                          return ListTile(
                            leading: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: <Widget>[
                                Icon(icons[index], size: 28.0),
                              ],
                            ),
                            title: Text('${entries[index]}', style: TextStyle(fontWeight: FontWeight.w600)),
                            subtitle:
                                Text('${entriesAddresses[index]}'),
                          );
                        },
                        separatorBuilder:
                            (BuildContext context, int index) => const Divider(
                          color: Color(0xffe0e0e0),
                          height: 1,
                          thickness: 1,
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ]),
            ),
          ),
        ],
      ),
    );
  }
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Container(
          //decoration: BoxDecoration(
            //color: Colors.grey[900],
          //),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Row(
          mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
          Container(
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(12.0),
            ),
            alignment: Alignment.center,
          width: appWidth,
          height: appHeight,
          child: Center(
            child: MyWidget()
          ),
        )
        ])
            ]
          )
        )
      ),
      debugShowCheckedModeBanner: false,
    );
  }
}