당근 마켓 만들어 보기 - 1

모든 소스 코드 https://github.com/flutter-coder/flutter-ui-book2 에 공개 되어 있습니다

 

 

 

lib
- models // 화면에 필요한 샘플 데이터와 데이터 모델 클래스 관리 폴더
- screens // 5개의 화면 파일이 모여 있는 폴더
- chatting // 채팅 화면에 사용될 위젯 모음 폴더
- components // 여러 화면에서 공통으로 사용될 위젯 모음 폴더
- home // 홈 화면에 사용될 위젯 모음 폴더
- my_carrot // 나의 당근 화면에 사용될 위젯 모음 폴더
- near_me // 내 근처 화면에 사용될 위젯 모음 폴더
- heighborhood_life // 동네생활 화면에 사용될 위젯 모음 폴더
main_screens.dart // IndexStack, BottomNavigation 위젯을 가지는 파일 
main.dart
theme.dart // 앱 테마 관리 파일

 

yaml

# The following adds the Cupertino Icons font to your application.
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^1.0.2

google_fonts: ^6.1.0
font_awesome_flutter: ^10.6.0
intl: ^0.18.1

main_screens.dart

import 'package:flutter/material.dart';

class MainScreens extends StatefulWidget {
  @override
  _MainScreensState createState() => _MainScreensState();
}

class _MainScreensState extends State<MainScreens> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: const Text('MainScreens'),
      ),
    );
  }
}

 

theme.dart

import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';

// 텍스트 테마 설정 - 30, 20 14
TextTheme textTheme() {
  return TextTheme(
    displayLarge: GoogleFonts.openSans(fontSize: 18.0, color: Colors.black),
    displayMedium: GoogleFonts.openSans(
        fontSize: 16.0, color: Colors.black, fontWeight: FontWeight.bold),
    bodyLarge: GoogleFonts.openSans(fontSize: 16.0, color: Colors.black),
    bodyMedium: GoogleFonts.openSans(fontSize: 14.0, color: Colors.grey),
    titleMedium: GoogleFonts.openSans(fontSize: 15.0, color: Colors.black),
  );
}

// 아이콘 테마
IconThemeData iconTheme() {
  return const IconThemeData(color: Colors.black);
}

// 앱바 테마
AppBarTheme appBarTheme() {
  return AppBarTheme(
    centerTitle: false,
    color: Colors.white,
    elevation: 0.0,
    iconTheme: iconTheme(),
    titleTextStyle: GoogleFonts.nanumGothic(
        fontSize: 16.0, fontWeight: FontWeight.bold, color: Colors.orange),
  );
}

// 바텀 네이게이션 테마
BottomNavigationBarThemeData bottomNavigationBarThemeData() {
  return const BottomNavigationBarThemeData(
      selectedItemColor: Colors.orange,
      unselectedItemColor: Colors.black54,
      showUnselectedLabels: true);
}

// 전체 앱 테마 - 최상위
ThemeData themeData() {
  return ThemeData(
      scaffoldBackgroundColor: Colors.white,
      textTheme: textTheme(),
      appBarTheme: appBarTheme(),
      bottomNavigationBarTheme: bottomNavigationBarThemeData(),
      primarySwatch: Colors.orange);
}

main.dart

import 'package:class_carrot_market_v1/screens/main_screens.dart';
import 'package:class_carrot_market_v1/theme.dart';
import 'package:flutter/material.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'carrot market',
      debugShowCheckedModeBanner: false,
      home: MainScreens(),
      theme: themeData(),
    );
  }
}