flutter 2강

2022. 10. 2. 00:01프로그래밍 언어/Flutter

구글 느낌 내고싶다, 커스터 마이징 하고싶다 : MaterialApp

   return MaterialApp( // IOS 느낌 : Cupertino()
      home: Icon(Icons.event)
   );

앱 영역을 상중하 로 나눠주는 기능 : Scaffold 위젯

 return MaterialApp( // IOS 느낌 : Cupertino()
   home: Scaffold(
     appBar: AppBar(), // 상단에 들어갈 위젯
     body: Container(
           child: Icon(Icons.star),
    ],
   ), // 중단에 들어갈 위젯
     bottomNavigationBar: BottomAppBar(child:  Text('hi')), // 하단에 들어갈 위젯
   )
);

여러 위젯 사용하기 

하기전: analysis_options_yaml 파일의 rules: 부분에 아래 추가 (const 안쓴 것에 대한 에러 방지)

 

prefer_const_literals_to_create_immutables: false

 

여러 위젯 가로 배치 : Row( children:[])

body: Row(
     children:[
       Icon(Icons.star),
       Icon(Icons.star),
],

Row 결과

여러 위젯 세로 배치 : Column( children:[])

body: Column(
     children:[
       Icon(Icons.star),
       Icon(Icons.star),
],

Column 결과

중앙 정렬 

body: Row(
   mainAxisAlignment: MainAxisAlignment.center, //center : 가로측 중앙정렬
     children:[
       Icon(Icons.star),
       Icon(Icons.star),
],

중앙 정렬 결과

까먹으면 Ctrl+space 로 자동완성 가능 

 

'프로그래밍 언어 > Flutter' 카테고리의 다른 글

Dart 4 비동기 프로그래밍  (0) 2022.10.03
Dart 3 함수형 프로그래밍  (0) 2022.10.03
Dart 2 객체지향 프로그래밍  (0) 2022.10.02
Dart 언어 기본기  (0) 2022.10.02
flutter 설치  (0) 2022.09.27