개발노트

AnimatedList AnimatedList가 앞서 소개해드린 ListView 애니메이션 효과 구현 보다 더욱 간단한 이유는 위젯 자체에서 Animation을 제공한다는 점입니다. 따라서 Animation Tween을 따로 구현할 필요가 없어 소스가 더욱 간결해집니다. ListView 위젯에 애니메이션 효과를 넣어야한다면 AnimatedList를 사용하는 것이 더욱 간단합니다. 예시. import 'package:flutter/material.dart'; import 'package:font_awesome_flutter/font_awesome_flutter.dart'; class TestScreen extends StatefulWidget { const TestScreen({super.key}); @o..

ListTile ListTile 위젯은 목록 또는 리스트 항목을 나타내는 Flutter 위젯 중 하나로, 다양한 속성을 통해 제목, 부제목, 아이콘 및 기타 정보를 표시할 수 있습니다. 위 그림와 같이 사용할 위젯이 필요하다면 Container 위젯을 이용하여 만들기보다 ListTile 위젯을 사용하면 편리합니다. import 'package:flutter/material.dart'; import 'package:font_awesome_flutter/font_awesome_flutter.dart'; class TestScreen extends StatefulWidget { const TestScreen({super.key}); @override State createState() => _TestScree..

Flutter의 장점 중 하나는, 구현하고자 하는 위젯들이 대부분 이미 만들어져있다는 것에 있습니다. 위젯을 사용하려면 pubspec.yaml 이나 node.js 혹은 flutter SDK 터미널로 설치만 해주시면됩니다. 오늘은 card_swiper라는 위젯을 프로젝트에 설치하여 사용해 보도록하겠습니다. 기존의 ListView는 스크롤 시, item 상관없이 슬라이드 되었다면, card_swiper는 각각의 item에 할당되어있는 index를 통해 하나씩 스크롤되는 점이 차이가 있으며, 그 밖에도 여러가지 속성을 이용하여 보다 깔끔한 ListView를 만들 수 있습니다. (.NET MAUI에서 했던 CarouselView과 비슷하지만, 보다 사용하기 간편하고 멋집니다.) 링크: https://mroh12..

이전 시간에 만들었던 page_dump.dart에 ListView 위젯을 사용하여 리스트에 있는 아이템을 노출시켜 보도록 하겠습니다. ListView의 Item으로 사용할 객체를 따로 생성하기 위해 models 라는 폴터를 생성하고 거기에 entity_dump.dart를 생성하겠습니다. Dump라는 객체를 먼저 생성하고, Dump를 item으로 갖는 List인 DumpList를 생성하도록 하겠습니다. 객체 생성. entity_dump.dart import 'package:flutter/material.dart'; enum Level { easy, nomal, hard } class Dump { late final String title, content; Level level; IconData icons;..

이번 시간에는 List가 아닌 ObservableCollection 라는 클래스를 사용하여 ListView에 연동 시켜본다. (MVVM 패턴 유지) - Model: Quest.cs - View: Page21.xaml , Page21.xaml.cs (코드 비하인드) - ViewModel: Page21_ViewModel.cs https://docs.microsoft.com/ko-kr/dotnet/api/system.collections.objectmodel.observablecollection-1?view=net-6.0 ObservableCollection 클래스 (System.Collections.ObjectModel) 항목이 추가 또는 제거되거나 전체 목록이 새로 고쳐질 때 알림을 제공하는 동적 데이터 ..