본문 바로가기

분류 전체보기28

[flutter] 달력(table_calendar) 패키지의 날짜 선택기능 구현 내가 만드는 앱에 달력을 구현하려고 패키지를 찾다가 table_calendar라는 패키지를 찾았다. 기능은 심플하다. TableCalendar( firstDay: DateTime.utc(2010, 10, 16), lastDay: DateTime.utc(2030, 3, 14), focusedDay: DateTime.now(), ); 패키지 예제에 있는 이 코드를 다음과 같이 stateful 위젯 안에 넣어주기만 하면 된다. 이 코드도 간결하다. firstDay : 달력 시작날 lastDay : 달력 마지막날 focusedDay : 첫 달력 화면에서 포커스가 맞춰지는 곳, 대부분 직관적으로 오늘 날짜. 기본 코드만 넣어놔도 이처럼 바로 달력이 생성되는 Magic을 볼 수 있다. 이래서 쉬운줄 알았지만... .. 2024. 2. 6.
[flutter] Riverpod의 ProviderScope는 최상단에 있어야 한다. ProviderScope는 Riverpod에서 사용되는 중요한 개념 중 하나로, 프로바이더를 생성하고 관리하는 컨테이너 역할을 합니다. Riverpod는 상태 관리를 위해 프로바이더를 사용하는데, ProviderScope는 이러한 프로바이더를 효과적으로 관리하고 사용할 수 있도록 도와줍니다. 주요 특징 및 역할: 1. 프로바이더의 생성과 소멸: ProviderScope는 프로바이더의 생성과 소멸을 관리합니다. 앱의 각 부분에 대해 독립적인 ProviderScope를 만들 수 있으며, 해당 스코프 내에서만 프로바이더가 유효합니다. 2. 프로바이더의 계층 구조: ProviderScope는 계층적으로 구성될 수 있습니다. 상위 스코프에서 생성된 프로바이더는 하위 스코프에서 사용될 수 있습니다. 이를 통해 프로.. 2024. 1. 13.
[flutter] mainAxisSize - 정렬을 도와주는 코드 패스트캠퍼스 강의를 들으면서 실습중에, 다음과 같은 현상이 발생했다. Align( alignment: Alignment.bottomRight, child: Column( 주황색 버튼의 정렬을 bottonRignt(우측 하단)로 했음에도 불구하고 우측 상단에 배치되어 있다. Align( alignment: Alignment.bottomRight, child: Column( mainAxisSize: MainAxisSize.min, 강사님이 알려준 해결책은 crossAxisAlignment: CrossAxisAlignment.end를 Column에 삽입하는 것이다. 그러면 아래 사진과 같이 해결이 된다. 그럼에도 선뜻 이해가 가지 않았다. TopRight로 선언하지 않았는데 왜 bottonRight가 되지 않.. 2024. 1. 12.
[flutter] Flutter에 이미지 추가하기 이미지에 접근하려면 이미지 폴더를 추가해야한다. pubspec.yaml의 asset에 가서 이미지 폴더를 추가한다. class Body extends StatelessWidget { const Body({super.key}); @override Widget build(BuildContext context) { return Center( child: Image.asset("assets/images/sample1.png"), ); } } 그러면 다음과 sample1.png라는 이미지에 접근할 수 있다. 문제는 하위 폴더를 만들면 하위 폴더도 또 추가를 해줘야 한다. image 폴더안에 여러 폴더를 만들었을때, 자동으로 이미지가 인식되지 않고, 폴더를 만들었다면 또 지정해줘야 한다. 2024. 1. 8.