[flutter1] flutter 기본 구조

flutter을 살짝 봤었는데 너무 어려워서 포기했다가 다시 기본부터 잡아보기로! 👊 회사 맥북엔 어떻게 했는지는 모르겠지만 플러터 개발 환경을 잘 세팅해놨는데 집 맥북 세팅은 망했다…이거 때문에 더 하기 싫었음 😭 세팅 다시 차근차근 해보고 강의도 열심히 듣고 벨로그도 열심히 써야지 👩🏻‍💻

main.dart 기본 구조

void main() {
  runApp(
    MaterialApp(
      debugShowCheckedModeBanner: false, //개발중이라는 표시로 오른쪽 상단에 표기되는 태그 제거
      //배경색깔을 지정할 수 있는 Scaffold 위젯
      home: Scaffold(
          backgroundColor: Colors.lime, //background색상을 변경한다.
          body: Center(
            //child 파라미터
            child: Text('hanbyeul', style: TextStyle(color: Colors.cyan)),
          )),
    ),
  );
}

✔️ void main(){}

return value(리턴 값)가 없는 함수인 경우 사용한다.

void main() {}

✔️ runApp()

flutter 앱을 실행하는 함수이다.

void main() {
	runApp();
}

✔️ MaterialApp()

• 항상 최상위에 위치한다.
• 구글이 만들고, 지향하는 디자인인 Material Design을 사용할 수 있도록 만들어준다.

void main() {
	runApp(
    	MaterialApp(),
    );
}

✔️ Scaffold()

• MaterialApp() 아래에 위치하며, 많은 기본 기능들을 제공한다.
• 화면의 구조를 만들 수 있게 해주는 위젯
• ex) AppBar, BottomNavigationBar 등등

❓ Widget(위젯)은 화면에 보여지는 모든 요소를 말한다.

void main() {
	runApp(
    	MaterialApp(
        	home: Scaffold(),
        ),
    );
}

단축키 설정

setting > 키맵 > 단축키 설정 동작 검색 > 설정할 동작에서 마우스 오른쪽 클릭 > 키보드 단축키 추가 > 단축키 입력

이 단축키 설정으로 코드 정리하는 단축키를 설정했다. 정리를 원하는 줄에 커서를 두고 '⌥⌘L' 단축키 입력하면 코드 줄이 정리되도록 설정했다. 나는 인텔리제이로 작업했다.