Flutter (27) 썸네일형 리스트형 listview 안에 listview사용하기 ListView위젯 안에 Listview위젯을 감싸고 있느 경우 shrinkWrap 프로퍼티를 true로 설정해줘야 하며 위젯에서 스크롤이 되려면 physcis 프로퍼티의 NeverScrollableScrollPhysics를 설정해줘야한다. 이미지 등록하기 image_picker라이브러리를 사용한다. 다트 파일에 image picker와 dart:io를 임포트해 주자. import 'dart:io'; import 'package:image_picker/image_picker.dart'; 소스코드 import 'dart:io'; import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; import 'package:image_picker/image_picker.dart'; class Example1Page extends StatefulWidget { const Example1Page({Key? key}) : super(key: key); @override State cre.. datePicker 달력 DatePicker는 사용자가 날짜를 선택할 수 있게 해주는 Flutter의 Material 위젯이다. showDatePicker() 함수를 사용하여 달력을 보여준다. Flutter DateTime Picker는 쉽게 사용자가 지정할 수 있고 여러 언어로 날짜 및 시간 선택을 지원한다. 실행화면 날짜를 선택하는 코드 DateTime? pickedDate = await showDatePicker( context: context, initialDate: DateTime.now(), firstDate: DateTime(1950), //DateTime.now() - 오늘 전에는 선택못하게 lastDate: DateTime(2100)); if (pickedDate != null) { print(pickedDate.. Category_detail_page 전체 틀은 클래스의 정보들이 계속 나와야 하기 때문에 ListView형식을 사용해서 클래스들을 보여준다. 디폴트로 클래스들을 등록순서대로 보여준다. dropdownButton을 사용하여 인기순,등록순,추천순으로 리스트를 보여준다. 주소뒤에 쿼리스트링 형식으로 카테고리리스트 형식을 받는다. http://localhost:8000/api/category/{catgoryId}?sort=recent&min_price=0&max_price=0 실행화면 글자가 2줄을 넘어갈때 '...'로 처리하할때 사용한다. overflow: TextOverflow.ellipsis, maxLines: 2 dropdownButton https://sub1-coding.tistory.com/297 DropDownButton 카드 결제.. lesson_detail_page lesson_detail_page는 appbar랑, body의 백그라운드 이미지를 같이 넣어주어야하기 때문에 sliverListView를 사용 sliverappbar를 사용하여 appBar에 listview의 배경색을 같이 사용하고 싶을때 사용한다. sliverappbar를 만들 때는 CustomScrollView안에다가 만들어 주고 CustomScrollView안에 Sliver가 있고 그 안에 SliverAppBar,SliverList,SliverGrid가 존재한다. double타입으로 받은 리뷰점수를 별모양으로 표시를 해줍니다. https://sub1-coding.tistory.com/296 SliverAppBar SliverAppBar 앱의 스크롤에 따라 모양이 변하는 app bar를 말한다. Bo.. home_page home_page는 NestedScrollView, SliverList를 사용한다. sliverList는 gridview나 listview같은 리스트들을 함께 스크롤 하고싶을때 사용한다. sliverList는 delegate 매개변수를 가지고 있습니다. delegate는 뷰를 스크롤하면서 항목을 제공한다. SliverChildListDelegate로 하위 요소 항목을 명시할 수 있다. 구현화면 전체코드 import 'package:finalproject_front/constants.dart'; import 'package:finalproject_front/pages/main/home/components/category_select.dart'; import 'package:finalproject_front.. DropDownButton 카드 결제페이지에서 할부여부 버튼을 누르면 아래와 같이 나오게 할것이다. pubdev에 있는 dropdown_button2 라이브러리 사용한다. 의존성 추가 버튼을 누르면 rebuild해서 보여주기 때문에 statefulwidget으로 만들어준다. 리스트로 보여줄 것들을 아이템에 담아준다. map()함수를 사용하여 items 안에 있는 문자열을 DropdownMenuItem인스턴스로 변환한다. 그리고toList()함수를 사용하여 다시 리스트로 변환시켜서 items프로퍼티에 리스트를 저장한다. 마지막으로 꼭 높이지정을 해준다. 나는 Container로 높이지정을 해주었다...(이거때문에 시간을 한참 잡아먹음..) 동작결과 코드 import 'package:flutter/material.dart'; impo.. SliverAppBar SliverAppBar 앱의 스크롤에 따라 모양이 변하는 app bar를 말한다. Body에 List뷰를 사용했을때 상단 AppBar가 확장되거나 내가 스크롤하는 움직임에 따라서 변화를 주고 싶을 때 주로 사용합니다. SliverAppBar는 3단어로 구성되어있다. CustomScrollView, SliverAppBar,SliverList 여기서 Sliver란 CustomScrollView를 만들때 CustomScrollView의 하위항목으로 제공되는 scrollable한 위젯들을 Sliver라고 한다. 코드 import 'package:extended_image/extended_image.dart'; import 'package:flutter/material.dart'; class LectureDeta.. 이전 1 2 3 4 다음
