코딩전사의 기록

[Flutter] CustomScrollView CustomScrollView 헤더의 확장, 축소 그리고 여러 개의 리스트뷰를 하나의 화면에 표현할 때 주로 사용합니다. 특징 CustomScrollView 은 다른 위젯처럼 child 나 children 이 아닌 slivers 를 받습니다. class S.. dalgoodori.tistory.com 이전 포스팅에서는 CustomScrollView 와 SliverAppBar 를 제외한 sliver 에 대해서 포스팅 했습니다. 이번 포스팅에서는 헤더를 확장, 축소하여 다양하게 UI 를 구현하는 SliverAppBar 에 대해서 포스팅 합니다. AppBar 와 겹치는 부분은 제외하고 자주 쓰는 것으로 해서 기록용으로 포스팅하겠습니다. 구현 CustomScrol..

CustomScrollView 헤더의 확장, 축소 그리고 여러 개의 리스트뷰를 하나의 화면에 표현할 때 주로 사용합니다. 특징 CustomScrollView 은 다른 위젯처럼 child 나 children 이 아닌 slivers 를 받습니다. class SampleScreen extends StatelessWidget { const SampleScreen({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return Scaffold( body: CustomScrollView( slivers: [ ], ), ); } } slivers 는 List 받는다고 되어있지만 그냥 위젯을 넣으면 아래와 같은 에러가 발생합니다. ..

get | Flutter Package Open screens/snackbars/dialogs without context, manage states and inject dependencies easily with GetX. pub.dev 설정 pubspec.yaml dependencies: get: ^4.6.5 main.dart MaterialApp 을 GetMaterialApp 으로 변경해주세요. import 'package:flutter/material.dart'; import 'package:get/get.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key})..

Form 과 함께 많이 쓰이는 TextFormField 를 포스팅합니다. TextFormField 의 기능은 너무 많으니 자주 쓰는 것들로 해서 기록용으로 포스팅하려고 합니다. TextFormField() 글자 수 제한 maxLength 로 글자 수를 제한할 수 있습니다. maxLength 를 적용하면 우측 하단에 counterText 가 나타납니다. TextFormField( maxLength: 6, ) counterText 는 decoration 의 InputDecoration 을 이용하여 바꿔줄 수 있습니다. counterStyle 로 꾸밀 수 있지만 counter 를 이용하여 임의로 만들 수 있습니다. counter 가 적용되어 있다면 counterText 와 counterStyle 은 무시합니다..

여러 항목 중 하나를 선택하는 것을 구현할 때 쓰이는 DropDownButton 입니다. 간단 구현 방법 DropDown 으로 선택된 값의 상태를 변경해주어야 하니 StatefulWidget 으로 만듭니다. DropDown 에 넣을 목록과 현재 선택값을 선언해주세요. initState 에서 현재 선택값을 목록의 첫번째 값으로 넣어줍니다. final _cities = ['서울', '대전', '대구', '부산', '인천', '울산', '광주']; String _selectedCity = ''; @override void initState() { super.initState(); setState(() { _selectedCity = _cities[0]; }); } DropdownButton 을 구현합니다. v..

get | Flutter Package Open screens/snackbars/dialogs without context, manage states and inject dependencies easily with GetX. pub.dev 설정 pubspec.yaml dependencies: get: ^4.6.5 main.dart MaterialApp 을 GetMaterialApp 으로 변경해주세요. import 'package:flutter/material.dart'; import 'package:get/get.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key})..

get | Flutter Package Open screens/snackbars/dialogs without context, manage states and inject dependencies easily with GetX. pub.dev 설정 pubspec.yaml dependencies: get: ^4.6.5 main.dart MaterialApp 을 GetMaterialApp 으로 변경해주세요. import 'package:flutter/material.dart'; import 'package:get/get.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key})..

get | Flutter Package Open screens/snackbars/dialogs without context, manage states and inject dependencies easily with GetX. pub.dev 설정 pubspec.yaml dependencies: get: ^4.6.5 main.dart MaterialApp 을 GetMaterialApp 으로 변경해주세요. import 'package:flutter/material.dart'; import 'package:get/get.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key})..

get | Flutter Package Open screens/snackbars/dialogs without context, manage states and inject dependencies easily with GetX. pub.dev 설정 pubspec.yaml dependencies: get: ^4.6.5 main.dart MaterialApp 을 GetMaterialApp 으로 변경해주세요. import 'package:flutter/material.dart'; import 'package:get/get.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key})..

get | Flutter Package Open screens/snackbars/dialogs without context, manage states and inject dependencies easily with GetX. pub.dev 설정 pubspec.yaml dependencies: get: ^4.6.5 main.dart MaterialApp 을 GetMaterialApp 으로 변경해주세요. GetX 를 상태관리로만 사용하실거면 GetMaterialApp 으로 변경하지 않아도 됩니다. import 'package:flutter/material.dart'; import 'package:get/get.dart'; void main() { runApp(const MyApp()); } class MyA..