전체 글980 Flutter - RotatedBox, Transform.rotate, AnimatedBuilder, 위젯 회전하기 안녕하세요 독학코딩입니다. 오늘은 Flutter에서 위젯을 세로로 배치하는 방법에 대해서 배워보겠습니다. 그리고 세로 배치와는 비슷하지만 효과와 쓰임새가 다른 위젯 회전에 대해서도 배워보겠습니다. Flutter RotatedBox Flutter에서 위젯을 90도 혹은 180도 회전에서 배치하는 것은 상당히 간단합니다. 레이아웃을 세로 정의할 필요도 없습니다. 그저 RotatedBox만 사용하시면 됩니다. class FirstRoute extends StatefulWidget { const FirstRoute({Key? key}) : super(key: key); @override State createState() => _FirstRouteState(); } class _FirstRouteState ex.. 2022. 4. 30. Flutter - ExpansionPanel, ExpansionPanelList, 눌러서 열기, 확장 패널 안녕하세요 독학코딩입니다. 오늘은 앱을 개발할 때 정말 많이 사용하는 눌러서 열기 기능에 대해서 배워보겠습니다. 위젯 이름은 ExpansionPanel인데 한국어로는 정확한 번역이 있는지 모르겠네요. 직역으로는 확장 패널인데 눈으로 보시면 익숙하실 겁니다. Flutter ExpansionPanel class FirstRoute extends StatefulWidget { const FirstRoute({Key? key}) : super(key: key); @override State createState() => _FirstRouteState(); } class _FirstRouteState extends State { bool _expanded = false; @override Widget build(.. 2022. 4. 28. Flutter - Theme, ThemeData, 테마 바꾸기 안녕하세요 독학코딩입니다. 오늘은 Flutter에서 앱의 전체 테마를 한번에 바꾸는 방법에 대해서 배워보겠습니다. 일반적으로는 라이트모드, 다트모드가 있고 만약 원하신다면 더 특별한 커스텀 테마를 적용하는 것도 가능합니다. Flutter Theme Flutter Theme는 하위 위젯의 테마를 적용하는 위젯입니다. 여기서 테마는 앱의 색과 폰트를 의미합니다. 하위 위젯은 Theme.of를 나중에 Theme이 변경되면 ThemeData 개체를 사용하여 자동으로 재구성되므로 변경사항을 적용할 수 있습니다. Flutter Theme을 사용하는 방법은 간단합니다. Theme은 그 하위 모든 위젯의 색과 폰트를 설정하는 위젯이니 Theme을 적용하시고 싶은 위젯 위에 Theme을 작성하시면 됩니다. Elevate.. 2022. 4. 19. Flutter - RefreshIndicator, Pull to Refresh, 당겨서 새로고침 안녕하세요 독학코딩입니다. 오늘은 Flutter에서 Pull to Refresh 기능인 당겨서 새로고침을 배워보겠습니다. 어떤 앱을 보든 기본적으로 있는 기능있는데요. 모두 본적이 있으실 겁니다. 화면을 아래로 당기면 새로고침 스피너가 나오면서 화면이 새로고침 되는걸 보셨을 겁니다. 오늘은 그 기능인 RefreshIndicator를 배워보겠습니다. Flutter RefreshIndicator RefreshIndicator는 스크롤 가능한 하위 항목이 오버스크롤 되면 새로고침 콜백이 호출됩니다. 다만, Vertical Scroll View에서만 가능하다는 걸 유의하셔야 합니다. int refreshnum = 0; RefreshIndicator( onRefresh: () async { refreshnum +.. 2022. 4. 16. Flutter - Inkwell, GestureDetector, 터치 클릭 인식 안녕하세요 독학코딩입니다. 오늘은 Flutter에서 사용자의 터치 혹은 클릭 그에 더해서 길게 누르기, 두번 누르기 등 모든 사용자 제스처를 인식할 수 있는 위젯 GestureDetector를 배워보도록 하겠습니다. Flutter GestureDetector GestureDetector( onTap: () { print("Button Clicked!"); }, child: Container( color: Colors.yellow.shade600, padding: EdgeInsets.all(50), child: Text('PRINT'), ), ), GestureDetector는 사용하기 아주 간편한 위젯 중 하나 입니다. GestureDetector의 child에 클릭 효과를 주고 싶은 위젯을 넣어주면 됩.. 2022. 4. 12. Flutter - AbsorbPointer, 클릭 터치 방지 안녕하세요 독학코딩입니다. 오늘은 Flutter에서 화면 터치를 방지하는 방법에 대해서 배워보겠습니다. 특정 레벨의 사용자만 사용할 수 있는 기능 혹은 특정 조건에서만 활성화 되는 버튼을 만들기에 좋은 기능이니 잘 알아두시면 좋습니다. Flutter AbsorbPointer Absorb는 한글로 "흡수"입니다. Pointer는 보통 마우스 포인터, 클릭을 의미하니 AbsorbPointer는 말 그대로 클릭을 흡수하는 위젯입니다. class FirstRoute extends StatefulWidget { const FirstRoute({Key? key}) : super(key: key); @override State createState() => _FirstRouteState(); } class _Firs.. 2022. 4. 9. Flutter StatelessWidget, StatefulWidget 차이 안녕하세요 독학코딩입니다. 오늘은 Flutter에서 가장 중요한 개념인 StatelessWidget 와 StatefulWidget의 차이에 대해서 배워보겠습니다. 영어 단어로만 생각하면 Stateless, Stateful는 상태가 없는, 상태가 있는 혹은 상태 비저장, 상태 저장 등으로 해석할 수 있습니다. 한글로 생각하니깐 조금 이해하기 좋으신가요? Flutter StatelessWidget 공식 문서에 설명에서 StatelessWidget 는 "변경 가능한 상태가 필요하지 않은 위젯" 입니다. class FirstRoute extends StatelessWidget { const FirstRoute({Key? key}) : super(key: key); @override Widget build(Bui.. 2022. 4. 7. Flutter DropdownButton 다루기 안녕하세요 독학코딩입니다. 오늘은 Flutter의 드랍다운버튼, Dropdownbutton에 대해서 배워보겠습니다. 어떤한 앱을 만드시든 아마 필수적으로 들어갈 수 밖에 없는 위젯이니 이 기회에 잘 알아두시면 좋을 것 같습니다. Flutter DropdownButton 기초 DropdownButton( value: dropdownValue, onChanged: (String? newValue) { setState(() { dropdownValue = newValue!; }); }, items: dropdownList.map((String value) { return DropdownMenuItem( value: value, child: Text(value), ); }).toList(), ) Flutter .. 2022. 4. 5. 이전 1 ··· 114 115 116 117 118 119 120 ··· 123 다음
