[Flutter] Main과 MateriaApp의 필수적인 속성

플러터도 여느 프로그램처럼 main 함수에서 시작한다.

main 함수에서는 runnApp 함수로 일반적으로 MaterialApp을 호출한다.

MaterialApp은 타이틀, 앱의 전반적인 디자인과 관련된 테마 등을 속성으로 가지며, home 속성으로 하위 스크린을 호출할 수 있다.

 

안드로이드 디자인을 기반으로 하는 MaterialApp 대신 IOS 디자인을 기반으로하는 CupertinoApp을 사용할 수도 있다. 대부분의 디자인이 커스텀이 되기때문에 사실 어떤 것을 사용하든 상관이 없고 정보가 더 많은 MaterialApp을 기본으로 사용하는 것을 추천한다. (CupertinoApp을 사용하면 picker view를 사용할 수 있다는 장점은 있다.)

 

Main 함수

void main() {

//1) 스마트폰 알림바의 색상을 변경한다. 따로 설정하지 않는다면 반투명이다.
  SystemChrome.setSystemUIOverlayStyle(
      SystemUiOverlayStyle(statusBarColor: Color(0xFFF9F9F9)));
      
//2) MyApp을 호출한다. 반드시 MaterialApp(CupertinoApp)을 return 받아야한다.
  runApp(MyApp());
}

 

 

MaterialApp

MaterialApp(

//1) 앱의 전반적인 테마를 설정한다.
    theme: ThemeData(
	  primaryColor: Colors.white, //위젯들의 색상이 해당 색상과 보색을 띄게된다.
      accentColor: Colors.green, //강조하는 색상을 정한다.
      brightness: Brightness.light, //black이라면 다크모드이다. 일반적으로 스마트폰의 설정을 불러와 유동적으로 변경한다.
      
      /*텍스트의 style을 미리 설정해놓고 호출해 사용할 수 있다.
		text 위젯 style 속성에서 호출한다. style: Theme.of(context).textTheme.bodytext1*/
      textTheme: TextTheme(bodytext1: TextStyle(fontWeight: FontWeight.bold)) 
      
      /*앱에서 만들어지는 버튼들의 default 형태를 설정한다. 테마를 사용하지 않으려면 RawMaterialButton을 사용해야한다. */
	buttonTheme : ButtonThemeData(
		shape : RoundedRectangleBorder(borderRadius : BorderRadius.circular(50)),
        buttonColor : Colors.deepPurple,
        textTheme : ButtonTextTheme.primary 
        //버튼의 텍스트 색상에 관여한다. primary라면 primaryColor를, acceent라면 accentColor을 반영한다.
  
  	  //위젯의 밀집도와 관련
  	visualDensity: VisualDensity.adaptivePlatformDensity,
  ),

//2. 메인 위젯 호출, MyApp은 일반적으로 Scaffold로 이루어짐
    home: MyApp(title: 'AA Crowd Consulting'),
  ));

}

 

* textTheme와 buttonTheme 속성이 상당히 편리하므로 필수적으로 사용하는 것이 좋다.

 

* visualDensity 속성은 링크 참고

https://material.io/design/layout/applying-density.html#components