본문 바로가기
Flutter

[Flutter - 2team] Section 5: I Am Poor

by _uke_ee 2020. 11. 9.

Flutter 강의 Section 5에서는 지난 강의들의 내용을 토대로 I am Poor 라는 이름의 앱을 만드는 것이다.

 

잠시 지난 내용을 살펴보면,

 

기본적인 Material 디자인의 레이아웃을 실행하기 위해 Scaffold 라는 위젯을 사용하였고,

Scaffold위젯의 Properties로는 AppBar, body, backgroundColor, BottomNavigationBar...등등이 있었다.

 

우선 Scaffold 클래스의 내용을 살펴보면 다음과 같다.

해석으로는 비계, 발판이라는 뜻으로 drawer, snack bars, 그리고 button sheets 등등의 API를 제공한다고 나와있다.

 

<Scaffold Properties>

1) AppBar

 - 주로 앱바 이름을 담당한다

2) body

 -  Scaffold 위젯의 기본적인 내용물을 담당한다. 

3) backgroundColor

 - Material widget의 뒷배경 color를 담당한다.

4) bottomNavigationBar

 - 다른 창으로 이동할 수 있는 버튼을 담당한다.

 

이것들 이외에도 다양한 API들을 제공하니 사이트를 참고하면 좋을 것 같다. 

(자세한 내용은 사이트 : api.flutter.dev/flutter/material/Scaffold-class.html )

 

해당 강의에서 사용한 코드는 다음과 같다.

I Am Poor

import 'package:flutter/material.dart';

void main() {
  runApp(
    MaterialApp(
      home: Scaffold(
        backgroundColor: Colors.blueGrey,
        appBar: AppBar(
          title: Center(child: Text('i am poor'),
          ),
          backgroundColor: Colors.blueGrey[900],
        ),
        body: Center(
          child: Image(
            image: AssetImage('images/coal.png'),
          ),
        ),
      ),
    ),
  );
}

 

<실행>

 

 

강의: www.appbrewery.co/p/flutter-development-bootcamp-with-dart

 

The Complete Flutter Development Bootcamp with Dart

The Complete Flutter Development Bootcamp with Dart

www.appbrewery.co

원글: luke-computer.tistory.com/2

 

Flutter Section 5: I Am Poor (Instructor. Angela Yu)

Flutter 강의 Section 5에서는 지난 강의들의 내용을 토대로 I am Poor 라는 이름의 앱을 만드는 것이다. 잠시 지난 내용을 살펴보면, 기본적인 Material 디자인의 레이아웃을 실행하기 위해 Scaffold 라는

luke-computer.tistory.com