순한맛 시즌2 반응형 레이아웃으로 유투브 페이지 구조 만들기 반응형 레이아웃 기본1 // main.dart import 'package:flutter/material.dart'; import 'MyPage.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return MaterialApp( theme: ThemeData( primarySwatch: Colors.lightBlue, textTheme: TextTheme( bodyText2: TextStyle( f..
순한맛 시즌2-3 리스트뷰(ListView)에서 데이터 전달하고 페이지 이동하기 - Generate : length의 길이만큼 0부터 인덱스-1까지의 범위에 각 인덱스를 오름차순으로 호출해서 만든 값으로 리스트 생성 예시1) int 타입 3개를 호출함. 0, 1, 2. 그런데 이 호출한 값을 index * index 하고 출력하라는 조건이 주어져서 해당 식을 수행한 후 출력 결과 = 0, 1, 4 - LikeButton like_button | Flutter Package Like Button is a flutter library that allows you to create a button with animation effects similar to Twitter's heart when you like..
순한맛 시즌2-2 리스트뷰 빌더(ListView builder)와 다이어로그(Dialog) 팝업창 띄우기 - GestureDetector : 제스처 기능을 지원하지 않는 위젯을 이것으로 감싸면 onTap 메서드로 제스터 기능 사용가능하게 해주는 위젯 + Inkwell 위젯도 같은 기능을 함. 하지만 잉크가 퍼지는듯한 애니메이션이 조금 다름 - Card class - ListView에 나올 card들의 크기를 지정할 때, Container / SizedBox 두 가지를 사용할 수 있음. Container를 써도 무방하지만 Container 위젯은 컬러, 패딩, 데코레이션 등 다양한 것들을 지정할 수 있기 때문에 크기 조절만 할 거라면 SizedBox가 좋음. SizedBox는 사이즈 지정하는 것 외에 아무..
순한맛 시즌2-1 플러터 온보딩 스크린(Flutter Onboarding screen) 만들기 - Onboarding screen 온보딩 스크린 : 앱 시작 시, 제일 처음 사용법을 담은 introduction 페이지들과 같은걸 on-boarding screen 무료 이미지 제공 사이트 Free Vectors, Stock Photos & PSD Downloads | Freepik Millions of Free Graphic Resources. ✓ Vectors ✓ Stock Photos ✓ PSD ✓ Icons ✓ All that you need for your Creative Projects. #freepik www.freepik.com const : 한번 정해지면 바뀌지 않는 데이터를 사용하는 위젯 ..
순한맛 26 패치강좌 1 플러터 2.0 Snack bar와 ScaffoldMessenger - Why ScaffoldMessenger? 기존 Scaffold 위젯 ▲ Center 위젯 ▲ FlatButtond 위젯 ▲ Scaffold.of(Context) > Scaffold. 메소드가 의미하는 건 현재의 BuildContext에서 위로 거슬러 올라가며 가장 가까운 Scaffold 찾아서 반환 하지만 Scaffold. 메소드가 가지고 있는 현재의 Context로는 찾을수가 없었음 그래서 Builder 위젯을 만들어서 새로운 Context를 Scaffold. 메소드가 전달받게 한 후, 그 위치부터 Scaffold 위치를 찾아나서게 함 이 때 생기는 문제점 > 주문확인 페이지에서 구현된 Snackbar는 주문..
순한맛 24 Collection(컬렉션)과 Generic(제네릭) - Interpolation : 보간법 예시) 당신의 점수는 $score 이며 당신의 레벨은 $Level 입니다. 사용자들마다 각자 다른 $변수값을 주기 위함. - Collection / Generic Collection : 데이터들을 모아서 가지고 있는 자료구조 Generic : Collection이 가지고 있는 데이터들의 데이터타입을 지정. 코드의 가용성과 재사용성 높힘 - List Java : Flutter ▼ Array : List 1. fixed-length List : List 크기 지정 (Java로 치면 Array) 2. growable List : 제약 없이 증가 (Java로 치면 Arraylist) ...? var name..
- 퀴즈 첫번째 사진을 통해 push method를 이용해 ScreenA 라우터를 불러오는 기능을 구현함. - 퀴즈 두번째 사진을 통해 ScreenA 위젯도 오류 없이 구현함. 하지만 버튼을 누르면 페이지 이동이 되지 않는다. 왜 그럴까? >> 왜 퀴즈 주세요..ㅜㅜ 우선, 실행 시 다음과 같은 오류가 뜸. Navigator operation requested with a context that does not include a Navigator. (= 네비에 포함되지 않은 context로 요청된 네비 오퍼임.) 정말 모르겠어서 구글하면서 해보는데 너무 무서운 오류 뜸... 무서워서 우선 걍 넘어갈래.. 못 풀겠어요 순한맛 24 강의 끝에 풀이 import 'package:flutter/material...
순한맛 22 네비게이터 이해하기 - Route의 개념 Flutter에서 Route 개념 : 스마트폰에서 보여지는 하나의 화면(Screen) 또는 페이지(Page)를 뜻함. - Navigator의 정의 : 모든 App Page들을 관리하며, App Pages의 데이터들을 관리하기 위해서 Stack이라는 차곡차곡 쌓는 자료구조 형식으로 Route 개체들을 관리함. 또한, Stack 자료구조를 활용하기 위해 push, pop method 제공함. (* stack 자료구조 FILO 구조 : First In Last Out. 선입 후출. 들어오는건 순서대로, 나가는건 가장 마지막 것부터 들어올때 push(), 내보낼때 pop() ) First Page에서 Second Page로 이동했을 때, 실제로는 First ..
