전체 글27 플러터(Flutter) - 코드 작성이 쉬워지는 IDE 단축키 알아보기 플러터 개발을 위해 Android Studio와 같은 IDE 툴을 쓸 때 가장 자주 사용하는 세 가지 단축키를 소개합니다. Stateless 혹은 Stateful 위젯에 대한 boilerplate 코드를 만들 때, 특정 위젯을 다른 위젯으로 감싸거나 혹은 없앨 때, 줄 간격을 맞출 때 사용하는 단축키 각각이 무엇인지 예제와 함께 알아보겠습니다. Stateless Widget과 Stateful Widget 을 만드는 단축키 Stateless 위젯에 대한 boilerplate 코드를 만들 때는 stless + tab 키를 사용합니다. 반대로 Stateful 위젯의 경우에는 stful + tab 키를 사용해서 만들어 줍니다. 그런 다음 비어있는 class 칸에 이름을 넣어주면 바로 아래에 있는 Key에도 동일.. 2022. 10. 10. 플러터(Flutter) - Null Safety 에러 없애기 먼저 Null Safety 에러 하나를 해결하고, 플러터에서 얘기하는 Null Safety가 무엇이고 왜 적용되었는지 알아본 뒤, 코딩할 때 마주치는 null safety 관련 연산자 ?와 !, late에 대해 알아봅시다. 패키지를 추가한 뒤 마주친 Null Safety 에러 해결하기 제가 현재 포스트 작성 시점에서 사용 중인 플러터 버전은 3.3.3이고, 다트(Dart) 버전은 2.18.2입니다. 플러터 프로젝트에서 로그인 페이지를 구현하기 위해 flutter_signin_button 패키지를 추가했더니 dependencies에 있는 flutter_signin_button와 font_awesome_flutter가 null safety를 지원하지 않는다는 에러가 떴습니다. pubspec.yaml 파일을 .. 2022. 10. 9. Flutter 데모 앱 살펴보기 3 - interactivity, navigation 플러터 코드랩 예제가 재미있기 때문에, startup_namer, part2 도 한 번 살펴보겠습니다. 이 예제에서는 리스트 아이콘을 통해 새로운 페이지로 이동하는 코드가 담겨 있습니다. 프로젝트 생성하기 코드랩 따라하기 코드랩에서 안내하는 대로 샘플 프로젝트를 생성해보겠습니다. 터미널을 켜서 flutter create startup_namer로 플러터 프로젝트를 생성해줍니다. (startup_namer part1 프로젝트가 동일한 이름을 쓰고 있었기 때문에 기존 프로젝트 이름을 변경해주었습니다.) 그 다음 startup_namer 프로젝트로 이동해서 flutter pub add english_words 커맨드를 통해 english_words 패키지를 플러터 프로젝트 패키지 관리 파일인 pubspec.y.. 2022. 10. 8. Flutter Material 디자인 - BottomNavigationBar (탭 바) 플러터의 Material 디자인이 담긴 Material 위젯에서는 탭 바를 BottomNavigationBar 클래스에서 제공하고 있습니다. Material 위젯에서 기본적으로 제공하는 샘플을 통해 동작을 살펴보겠습니다. Bottom Navigation Bar는 클릭한 탭의 정보를 업데이트해서 보여주기 때문에 Stateful 위젯이고, 화면 구성 시에 주로 Scaffold 위젯에서 하단에 Floating Action Button 대신 Bottom Navigation Bar를 보여주는 형식을 따르게 됩니다. Bottom Navigation Bar에서 개별 탭은 BottomNavigationBarItem 위젯을 통해 구성하고 있습니다. Bottom Navigation Bar 샘플 프로젝트 생성 후 실행하기 .. 2022. 10. 6. 이전 1 2 3 4 5 6 7 다음
