1. BottomSheet 위젯 화면 아래쪽에서 올라오는 다이얼로그showBottomSheet() 및 showModalBottomSheet()의 builder 속성에 지정한 위젯을 화면 아래쪽에서 올라오도록 보여줌showModalBottomSheet()는 사용자가 Bottom Sheet 외부를 터치하면 Bottom Sheet가 자동으로 닫히지만, showBottomSheet()는 사용자가 Bottom Sheet 외부를 터치해도 Bottom Sheet가 닫히지 않음다이얼로그를 닫기 위해서는 닫히게 하려면, Navigator.of(context).pop()을 호출하면 됨import 'package:flutter/material.dart'; void main() { runApp(BottomSheetApp(..
목차1. 요구 사항git code flutter-book/flutter_shoppingcart at master · flutter-coder/flutter-bookContribute to flutter-coder/flutter-book development by creating an account on GitHub.github.com작업 순서constants.dart 파일 작업 theme.dart 파일 작업 .. header.dart… details.dart2. constants.dart 파일 작업 import 'package:flutter/material.dart';const kPrimaryColor = MaterialColor( 0xFFeeeeee, { 50: Color(0xFFeeeeee)..
1. GridView 위젯 리스트 뷰와 마찬가지로 항목을 나열하는 위젯이지만, 리스트 뷰와 달리 한 줄에 여러 개를 함께 나열할 수 있음 (그리드 형태)리스트 뷰와 마찬가지로 그리드뷰도 GridView.builder() 생성자를 제공하며,itemCount, itemBuilder 속성을 통해 항목의 개수와 위젯을 지정gridDelegate 속성을 설정해야 함이 속성에는 SliverGridDelegateWithFixedCrossAxisCount 객체를 지정해줘야 함해당 객체에서 crossAxisCount 값이 한 줄에 함께 나와야 하는 항목의 개수임그리드 두 방향을 설정하지 않으면, crossAxisCount는 가로를 가리킴참고: scrollDirection 속성에 Axis.horizontal을 설정하면, ..
1. 개요가장 일반적으로 사용되는 스크롤 위젯ListView는 주로 다음과 같은 방식으로 사용한다일반적인 ListView를 명시적으로 호출하고 children 전달하는 방법 (적은 데이터에 사용시 용이함)ListView.builder를 사용하여 동적으로 호출ListView.separated는 ListView.builder 기능에 구분선 사용 가능주요 propertyreverse: true이면 bottom에서부터 리스트 표시padding: 리스트 아이템 간격 (EdgeInsets로 적용)itemCount: 동적 리스트 아이템 개수 (ListView.builder/ListView.separated에서 사용 가능)itemBuilder: 각 동적 리스트 아이템 정의 (ListView.builder/ListVie..
목차1. Form 위젯 TextField는 단순히 하나의 텍스트 입력을 다루는데 반해서, Form은 그 자체로 입력 필드를 가지고 있지 않지만, FormField 위젯들을 그룹화하여 관리하며, 복잡한 유효성 검사와 보다 쉽게 할 수 있는 위젯이다다른 위젯과 달리 Form 위젯은 자체적인 화면을 제공하지는 않으며, 사용자가 입력한 데이터의 유효성 검증, 데이터 관리 관련 기능을 제공한다Form 위젯 내에서 TextFormField 위젯을 사용하여 각 데이터 입력을 받는 것이 일반적이다Form 위젯 작성 방법은 다음과 같다 1. Form 위젯을 위한 GlobalKey를 만들어야 한다. GlobalKey는 FormState 전체에 액세스하는 데 사용되며, 이 객체는 폼 데이터의 유효성을 검사하고 저장하는 데 ..
1. 개념StatelessWidget: 상태를 관리하지 않는 정적 위젯StatefulWidget: 상태를 관리하는 동적 위젯StatefulWidget과 StatelessWidget 코드 작성의 차이StatelessWidget은 상속받은 위젯은 build() 함수를 재정의하여 위젯을 생성Android Studio에서 stless라고 친 후, 텝키를 누르면 자동 템플릿 생성void main() { runApp(MyApp());}class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(BuildContext context) { return MaterialApp( // 여기에 위젯 설정 추가 ..