본문 바로가기

Gridview3

[flutter 상태관리] 6. stateful widget 실습2, 태그 필터 갤러리 만들기 상태 관리 관점에서 stateful widget 실습을 하고 있습니다. sateful widget 실습 1에서 체크박스로 선택 가능한 갤러리를 만들었는데요. 이 화면을 개선해서 태그로 필터 기능을 가지는 갤러리로 수정해 보도록 하겠습니다. *이번 실습을 통해서 배우는 것 1. GridView 2. where 활용법 (자바스크립트의 filter) 4. 상위 위젯에서 하위 위젯으로 상태와 콜백 메소드 건네주기 5. 갤러리 만들기 6. Drawer 지난 앱의 상태 지난 포스트에서 만든 앱은 아래와 같은 화면을 가지고 있습니다. 갤러리는 사진을 단순히 보여주는 일반모드와, 사진을 길게 클릭했을 때 체크박스로 선택을 할 수 있는 태그 모드가 있습니다. 사진의 체크박스를 선택하면 선택된 상태는 로컬 상태에 저장됩니.. 2022. 6. 6.
[flutter 상태관리] 3. stateless widget 실습 지난 포스트에서 stateless widget을 상태의 관점에서 정적 위젯과, 상태가 주입된 위젯으로 분류해 보았습니다. 이번 글의 목표는 정해진 사진을 출력하는 정적 위젯을 만들어보고 정적 위젯을 다시 상태가 주입된 위젯으로 바꾸는 코딩을 해보는 것입니다. GridView로 갤러리를 만들어보는 데모도 포함되어 있습니다. 기초적인 과정이니 눈으로 가볍게 따라와 주세요. 전체 소스를 참고하고 싶으신 분은 아래로 쭉 내려주세요. 이전 글을 읽고 오시면 더욱 좋습니다:) [flutter 상태관리] 2. stateless widget (스테이트리스 위젯) 플러터에서 상태 관리에 관한 포스팅을 하고 있습니다. 아직은 좀 더 작은 주제인 stateless widget과 stateful widget을 사용하는 로컬 .. 2022. 6. 1.
[Flutter Layout] 14. 플러터 갤러리 만들기(using GirdView) GridView에 대해 알아보고, GirdView를 이용해서 갤러리를 만들어 보도록 하겠습니다. 전체 소스코드는 하단에 첨부되어있습니다. 다음 내용을 다루고 있습니다. GridView란 GridView 위젯 사용법 GridView로 갤러리 만들기 GirdView 란 GridView는 스크롤 가능한 2D 위젯 배열입니다. 여기서 핵심 개념은 GridView가 스크롤 가능하고 2차원이라는 것입니다. 즉 스크롤 가능한 테이블입니다. ListView와 마찬가지로 가로 또는 세로로 스크롤할 수 있습니다. GirdView에서는 여러 가지 사례를 다루는 몇 가지 생성자가 있습니다. 생성자의 자세한 내용은 아래 공식 문서를 확인해 주세요. https://api.flutter.dev/flutter/widgets/Grid.. 2022. 4. 15.