12일차 과제 - rlatkddbs99/Flutter GitHub Wiki

키오스크 앱

main.dart

import 'package:flutter/material.dart';

import 'OptionCard.dart';
import 'mainPage.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MainPage(),
    );
  }
}

admin_page.dart

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

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: ListView(
        children: [
          ListTile(
            title: Text("메뉴 추가"),
          ),
          ListTile(
            title: Text("키오스크 화면 잠그기"),
          ),
          ListTile(
            title: Text("매장 등록 정보"),
          )
        ],
      ),
    );
  }
}

mainPage.dart

import 'package:ex2/admin_page.dart';
import 'package:flutter/material.dart';

import 'OptionCard.dart';

class MainPage extends StatefulWidget {
  const MainPage({super.key});

  @override
  State<MainPage> createState() => _MyAppState();
}

class _MyAppState extends State<MainPage> {
  List myMenu = [];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      floatingActionButton: myMenu.isNotEmpty
          ? FloatingActionButton.extended(
              onPressed: () {},
              label: Text("결제하기"),
            )
          : null,
      appBar: AppBar(
        backgroundColor: Colors.white,
        title: GestureDetector(
            onDoubleTap: () {
              Navigator.push(context,
                  MaterialPageRoute(builder: ((context) => AdminPage())));
            },
            child: Text("분식왕 이테디 주문하기")),
        foregroundColor: Colors.black,
        elevation: 0,
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "주문리스트",
            style: TextStyle(fontSize: 28, fontWeight: FontWeight.bold),
          ),
          Container(
            alignment: Alignment.center,
            height: 50,
            child: myMenu.isNotEmpty
                ? ListView.builder(
                    scrollDirection: Axis.horizontal,
                    itemCount: myMenu.length,
                    itemBuilder: ((context, index) {
                      return Chip(
                        label: Text(myMenu[index]),
                        onDeleted: () {
                          myMenu.removeAt(index);
                          setState(() {});
                        },
                      );
                    }))
                : Text("주문한 옵션이 없습니다"),
          ),
          SizedBox(
            height: 8,
          ),
          Text("음식",
              style: TextStyle(fontSize: 28, fontWeight: FontWeight.bold)),
          Expanded(
            child: GridView(
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 3,
              ),
              children: [
                InkWell(
                  onTap: () {
                    myMenu.add("떡볶이");
                    setState(() {});
                  },
                  child: OptionCard(
                      foodName: '떡볶이',
                      imgUrl: "assets/images/option_bokki.png"),
                ),
                InkWell(
                  onTap: () {
                    myMenu.add("맥주");
                    setState(() {});
                  },
                  child: OptionCard(
                      foodName: '맥주', imgUrl: "assets/images/option_beer.png"),
                ),
                InkWell(
                  onTap: () {
                    myMenu.add("김밥");
                    setState(() {});
                  },
                  child: OptionCard(
                      foodName: '김밥',
                      imgUrl: "assets/images/option_kimbap.png"),
                ),
                InkWell(
                  onTap: () {
                    myMenu.add("오므라이스");
                    setState(() {});
                  },
                  child: OptionCard(
                      foodName: '오므라이스',
                      imgUrl: "assets/images/option_omurice.png"),
                ),
                InkWell(
                  onTap: () {
                    myMenu.add("돈가스");
                    setState(() {});
                  },
                  child: OptionCard(
                      foodName: '돈가스',
                      imgUrl: "assets/images/option_pork_cutlets.png"),
                ),
                InkWell(
                  onTap: () {
                    myMenu.add("라면");
                    setState(() {});
                  },
                  child: OptionCard(
                      foodName: '라면', imgUrl: "assets/images/option_ramen.png"),
                ),
                InkWell(
                  onTap: () {
                    myMenu.add("우동");
                    setState(() {});
                  },
                  child: OptionCard(
                      foodName: '우동', imgUrl: "assets/images/option_udon.png"),
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}

OptionCard.dart

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

class OptionCard extends StatelessWidget {
  const OptionCard({super.key, required this.imgUrl, required this.foodName});
  final String imgUrl;
  final String foodName;
  @override
  Widget build(BuildContext context) {
    return Card(
      margin: EdgeInsets.all(4),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [
          Expanded(
            child: Image.asset(
              imgUrl,
              fit: BoxFit.cover,
            ),
          ),
          Text(foodName),
          Text("담기"),
        ],
      ),
    );
  }
}

연락처 main.dart

import 'package:flutter/material.dart';

import 'page/main_page.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MainPage(),
    );
  }
}

contact_screen.dart

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

import '../widget/ContactTile.dart';

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

  @override
  Widget build(BuildContext context) {
    return ListView(
      children: [
        ContactTile(
            imgUrl: 'https://picsum.photos/150/150',
            name: '이테디',
            phone: '010-1010-2222'),
        ContactTile(
            imgUrl: 'https://picsum.photos/50/50',
            name: '밀리',
            phone: '010-1010-3333'),
        ContactTile(
            imgUrl: 'https://picsum.photos/120/120',
            name: '크리스',
            phone: '010-1010-4444'),
        ContactTile(
            imgUrl: 'https://picsum.photos/130/130',
            name: '주노',
            phone: '010-1010-5555'),
        ContactTile(
            imgUrl: 'https://picsum.photos/140/140',
            name: '해리',
            phone: '010-1010-6666'),
        ContactTile(
            imgUrl: 'https://picsum.photos/160/160',
            name: '벨라',
            phone: '010-1010-7777'),
        ContactTile(
            imgUrl: 'https://picsum.photos/170/170',
            name: '헬렌',
            phone: '010-1010-8888'),
      ],
    );
  }
}

history_screen.dart

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

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

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Text("history Screen"),
    );
  }
}

setting_screen.dart

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

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

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Text("setting Screen"),
    );
  }
}

ContactTile.dart

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

class ContactTile extends StatelessWidget {
  const ContactTile(
      {super.key,
      required this.name,
      required this.phone,
      required this.imgUrl});

  final String name;
  final String phone;
  final String imgUrl;

  @override
  Widget build(BuildContext context) {
    return ListTile(
      onTap: (){
        Navigator.push(context, MaterialPageRoute(builder: (context) => ContactDetailPage(
          name : name,
          phone : phone,
          image : imgUrl,
        )))
      },
      title: Text(name),
      subtitle: Text(phone),
      leading: CircleAvatar(
        backgroundImage: NetworkImage(imgUrl),
      ),
      trailing: Icon(Icons.call),
    );
  }
}

contact_detail_page.dart

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

class ContactDetailPage extends StatelessWidget {
  const ContactDetailPage(
      {super.key,
      required this.name,
      required this.phone,
      required this.image});
  final String name;
  final String phone;
  final String image;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      extendBodyBehindAppBar: true,
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        elevation: 0,
      ),
      body: Column(
        children: [
          Image.network(
            image,
            width: double.infinity,
            fit: BoxFit.cover,
            height: 240,
          ),
          ContactTile(imgUrl: image, name: name, phone: phone)
        ],
      ),
    );
  }
}

main_page.dart

import 'package:call/screen/contact_screen.dart';
import 'package:call/screen/history_screen.dart';
import 'package:call/screen/setting_screen.dart';
import 'package:call/widget/ContactTile.dart';
import 'package:flutter/material.dart';

class MainPage extends StatefulWidget {
  const MainPage({super.key});

  @override
  State<MainPage> createState() => _MainPageState();
}

class _MainPageState extends State<MainPage> {
  var currentScreenIndex = 0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        elevation: 0,
        title: Text("내 연락처"),
        actions: [
          IconButton(onPressed: () {}, icon: Icon(Icons.search)),
          IconButton(onPressed: () {}, icon: Icon(Icons.more_vert))
        ],
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {},
        child: Icon(Icons.add),
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: [
          BottomNavigationBarItem(icon: Icon(Icons.home), label: "연락처"),
          BottomNavigationBarItem(icon: Icon(Icons.history), label: "통화기록"),
          BottomNavigationBarItem(icon: Icon(Icons.settings), label: "설정"),
        ],
        onTap: (value) {
          currentScreenIndex = value;
          setState(() {});
        },
        currentIndex: currentScreenIndex,
      ),
      body: [
        ContactScreen(),
        HistoryScreen(),
        SettingScreen(),
      ][currentScreenIndex],
    );
  }
}
⚠️ **GitHub.com Fallback** ⚠️