Flutter 코드의 기본 구조

Ruinak·2021년 10월 16일
0

Flutter

목록 보기
6/12
post-thumbnail

코드

// ignore_for_file: prefer_const_literals_to_create_immutables, prefer_const_constructors
import 'package:flutter/material.dart';

// main 스레드는 runApp 을 실행시키고 종료됩니다.
void main() {
  // 비동기로 실행됨(이벤트 루프에 등록된다)
  runApp(FirstApp());
  // sleep(Duration(seconds: 2));
  // print("main 종료");
}

class FirstApp extends StatelessWidget {
  const FirstApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: SafeArea(
        child: Scaffold(
          // 기본 구조 1. AppBar
          appBar: AppBar(
            backgroundColor: Colors.blueAccent,
            title: Text("First App"),
            leading: Icon(Icons.menu),
          ),
          // 기본 구조 2. body
          body: Container(
            height: 100,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.end,
              children: [
                Container(
                  width: 100,
                  color: Colors.green,
                ),
                Container(
                  width: 100,
                  color: Colors.red,
                ),
                Container(
                  width: 100,
                  color: Colors.orange,
                ),
              ],
            ),
          ),
          // 기본 구조 3. floatingActionButton
          floatingActionButton: FloatingActionButton(
            child: Text("Button"),
            onPressed: () {
              print("버튼 클릭됨");
            },
          ),
          // 기본 구조 4. bottomNavigationBar
          bottomNavigationBar: BottomNavigationBar(
            items: [
              BottomNavigationBarItem(
                  label: "hello", icon: Icon(Icons.access_alarm_rounded)),
              BottomNavigationBarItem(
                  label: "hello", icon: Icon(Icons.access_alarm_rounded))
            ],
            backgroundColor: Colors.yellow,
          ),
        ),
      ),
    );
  }
}
profile
Nil Desperandum <절대 절망하지 마라>

0개의 댓글