6일차 과제 - rlatkddbs99/Flutter GitHub Wiki

스타벅스 메뉴판 만들기

main.dart

import 'package:contact_app/ContactTile.dart';
import 'package:contact_app/DrinkTile.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(
      home: Scaffold(
        bottomSheet: Container(
          color: Colors.black87,
          height: 64,
          child: Padding(
            padding: const EdgeInsets.symmetric(horizontal: 16),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text(
                  "주문할 매장을 선택해주세요.",
                  style: TextStyle(color: Colors.white),
                ),
                Icon(
                  Icons.expand_more,
                  color: Colors.white,
                )
              ],
            ),
          ),
        ),
        bottomNavigationBar: BottomNavigationBar(
            selectedItemColor: Colors.green,
            unselectedItemColor: Colors.grey,
            type: BottomNavigationBarType.fixed,
            items: [
              BottomNavigationBarItem(icon: Icon(Icons.home), label: '홈'),
              BottomNavigationBarItem(
                  icon: Icon(Icons.credit_card), label: 'pay'),
              BottomNavigationBarItem(
                  icon: Icon(Icons.local_cafe), label: 'order'),
              BottomNavigationBarItem(icon: Icon(Icons.shop), label: 'shop'),
              BottomNavigationBarItem(
                  icon: Icon(Icons.more_horiz), label: 'other'),
            ]),
        appBar: AppBar(
          iconTheme: IconThemeData(
            color: Colors.black, //색변경
          ),
          backgroundColor: Colors.white,
          leading: Padding(
            padding: const EdgeInsets.all(8.0),
            child: Icon(Icons.navigate_before),
          ),
          elevation: 0,
          centerTitle: false,
          actions: [
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: Icon(Icons.search),
            ),
          ],
        ),
        body: ListView(
          children: [
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: Text(
                "NEW",
                style: TextStyle(fontSize: 42),
              ),
            ),
            DrinkTile(
              menuKr: '골든 미모사 그린 티',
              menuEn: 'Golden Mimosa Green Tea',
              price: '6100원',
              imgUrl: 'assets/images/item_drink1.jpeg',
            ),
            DrinkTile(
              menuKr: '블랙 햅쌀 고봉 라떼',
              menuEn: 'Black Rice Latte',
              price: '6300원',
              imgUrl: 'assets/images/item_drink2.jpeg',
            ),
            DrinkTile(
              menuKr: '아이스 블랙 햅쌀 고봉 라떼',
              menuEn: 'Iced Black Rice Latte',
              price: '6300원',
              imgUrl: 'assets/images/item_drink3.jpeg',
            ),
            DrinkTile(
              menuKr: '스타벅스 튜메릭 라떼',
              menuEn: 'Starbucks Turmeric Latte',
              price: '6100원',
              imgUrl: 'assets/images/item_drink4.jpeg',
            ),
            DrinkTile(
              menuKr: '아이스 스타벅스 튜메릭 라떼',
              menuEn: 'Iced Starbucks Turmeric Latte',
              price: '6100원',
              imgUrl: 'assets/images/item_drink5.jpeg',
            ),
          ],
        ),
      ),
    );
  }
}

DrinkTile.Dart

import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/container.dart';
import 'package:flutter/src/widgets/framework.dart';

class DrinkTile extends StatelessWidget {
  const DrinkTile(
      {super.key,
      required this.MenuKr,
      required this.MenuEn,
      required this.Price,
      required this.ImgUrl});

  final String MenuKr;
  final String MenuEn;
  final String Price;
  final String ImgUrl;

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: Row(
        children: [
          CircleAvatar(
            backgroundImage: AssetImage(ImgUrl),
            radius: 48,
          ),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(MenuKr),
                Text(
                  MenuEn,
                  style: TextStyle(
                      fontSize: 14,
                      fontWeight: FontWeight.w200,
                      color: Colors.grey),
                ),
                Text(Price),
              ],
            ),
          )
        ],
      ),
    );
  }
}