๐ป ๊ฐ๋ฐ/Flutter
๋ธ๋ก๊ทธ ๋ด์ ๊ฒ์๋ฌผ์ PC ๋ฒ์ ์ ์ต์ ํ ๋์ด ์์ต๋๋ค. ์ค๋์ ModalBttomSheet๋ฅผ ์ฌ์ฉํ๋ฉด์ ๋ฐ์ํ๋ ๋ฌธ์ ์ ๋ํด ์ ์ด๋ณด๋ ค๊ณ ํฉ๋๋ค. ModalBottomSheet์ TextField๋ฅผ ์ฌ์ฉํ์ฌ ํค๋ณด๋๋ก ์ฌ์ฉ์์ ์
๋ ฅ์ ๋ฐ์ผ๋ ค๊ณ ํ์ต๋๋ค. ํ์ง๋ง ModalBottomSheet๊ฐ ํ์
๋ ํค๋ณด๋์ ๋์ด๋งํผ ์ฌ๋ผ๊ฐ์ง ์์์ ModalBottomSheet๊ฐ ํค๋ณด๋์ ๊ฐ๋ ค์ง๋ ํ์์ด ๋ฐ์ํ์ต๋๋ค. ์๋์ ๊ฐ์ ์ํฉ์
๋๋ค. ํค๋ณด๋๊ฐ ํ์
๋๋ฉด์ ModalBottomSheet๋ฅผ ๊ฐ๋ ค ์ฌ์ฉ์๊ฐ ์
๋ ฅํ ํ
์คํธ๋ฅผ ํ์ธํ ์ ์๋ ๋ฌธ์ ๊ฐ ๋ฐ์ํ์ต๋๋ค. ModalBottomSheet๊ฐ ํค๋ณด๋์ ์ํด ๊ฐ๋ ค์ง๋ ํ์ ์ฐ์ ModalBottomSheet์ ์์ฑ์ ๋ํด ๋ถ์ํ์ต๋๋ค. ๊ทธ๋ฌ๋ ์ค isScrollContro..
๐ป ๊ฐ๋ฐ/Flutter
๋ธ๋ก๊ทธ ๋ด์ ๊ฒ์๋ฌผ์ PC ๋ฒ์ ์ ์ต์ ํ ๋์ด ์์ต๋๋ค. ์ค๋์ Equatable์ ๋ํด ์์๋ณด๋ ค๊ณ ํฉ๋๋ค. BLoC์ ๋ํ ๊ธ์ ์ฐ๊ธฐ ์ ์ BLoC์์ ์ฌ์ฉํ๋ Equatable์ ๋ํ ์ ๋ฆฌ๊ฐ ์ฐ์ ์ ์ด๋ผ๊ณ ์๊ฐํ์ต๋๋ค. ๋ฐ๋ก ๋ณธ๋ก ์ผ๋ก ๋ค์ด๊ฐ๋ณด์ฃ ! ์๋ ์ฝ๋๋ฅผ ๋จผ์ ์ดํด๋ณด๊ฒ ์ต๋๋ค. class Person { final int pid; final String name; final int age; Person(this.pid, this.name, this.age); } void main() { Person p1 = new Person(20221234, "kodo", 25); Person p2 = new Person(20221234, "kodo", 25); (p1 == p2) ? print("same") : ..
๐ป ๊ฐ๋ฐ/Flutter
๋ธ๋ก๊ทธ ๋ด์ ๊ฒ์๋ฌผ์ PC ๋ฒ์ ์ ์ต์ ํ ๋์ด ์์ต๋๋ค. ์ค๋์ ํ๋ฌํฐ์์ ์๋ ๋ก๊ทธ์ธ์ Splash Screen์ ๊ตฌํํด๋ณด๋ ค๊ณ ํฉ๋๋ค. ์๋ ๋ก๊ทธ์ธ์ ์ฑ ๊ฐ๋ฐ์ ์ ํด๋ดค๋ค๋ฉด ํ ๋ฒ์ฏค์ ๊ตฌํํด๋ดค์ ๊ธฐ๋ฅ์ด๋ผ๊ณ ์๊ฐํฉ๋๋ค. SharedPreference๋ฅผ ํ์ฉํด์ ๊ตฌํํ๋๋ฐ ์ค๋์ ์กฐ๊ธ ๋ค๋ฅธ ๋ฐฉ์์ผ๋ก ์ ๊ทผํ์ต๋๋ค. ๋ฐ๋ก BLoC๋ฅผ ํตํด์ ๊ตฌํํ๋๋ฐ์, BLoC๋ฅผ ์ฌ์ฉํ๋ฉด ์๋ ๋ก๊ทธ์ธ๊ณผ Splash Screen์ ํ๋์ ๋ก์ง์ผ๋ก ์ฒ๋ฆฌํ ์ ์์ต๋๋ค. ํ๋ฒ ์์ํด๋ณด์ฃ . ๋ฐ๋ก BLoC๋ก ๊ตฌํํ์ง ์๊ณ ๊ธฐ์กด์ ๋ฐฉ์์ผ๋ก ๊ตฌํํ๊ณ BLoC๋ก ๋ฆฌํํ ๋งํ๋ ๋ฐฉ์์ผ๋ก ์ ๊ทผํฉ๋๋ค. ๊ธฐ์กด ๋ฐฉ์์ผ๋ก ๊ตฌํํ๋ฉด์ ๋ฐ์ํ๋ ๋ฌธ์ ์ ์ด ๋ฌธ์ ๋ฅผ ์ด๋ค ์์ผ๋ก ํด๊ฒฐํ๋์ง๊ฐ ์ค์ํ๋๊น์. ์๋ ๋ก๊ทธ์ธ ์์ ๋ง์๋๋ฆฐ ๊ฒ์ฒ๋ผ SharedPrefer..
๐ป ๊ฐ๋ฐ/Flutter
๋ธ๋ก๊ทธ ๋ด์ ๊ฒ์๋ฌผ์ PC ๋ฒ์ ์ ์ต์ ํ ๋์ด ์์ต๋๋ค. ์ ๋ง ์ค๋๋ง์ ๊ธ ์ฐ๋ ๊ฑฐ ๊ฐ๋ค์. ๋ฏธ๊ตญ์์ ๋์์์ ์ผ๊ธฐ ์ด ๊ฒ ๋ง์ง๋ง์ธ๋ฐ ์ฃผ๊ธฐ์ ์ผ๋ก ์ฐ๋ ค๊ณ ํ์๋๋ฐ 1ํ๊ธฐ์ ํ๋ก์ ํธ๊ฐ ๋๋ฌด ๋ง์์ ๋ฐ๋นด์ต๋๋ค. ๊ธ ์ฐ๊ณ ์๋ ์ง๊ธ์ ์์จ์ํํธ์์ 7์ฃผ์ง๋ฆฌ ์ฑ์ฉ์ฐ๊ณํ ์ธํด์ ํ๊ณ ์์ต๋๋ค. ์ธํด์ ์งํํ๋ฉด์ ํ๋ฌํฐ๋ก ๊ฐ๋ฐ์ ํ๊ณ ์๋๋ฐ ๊ฐ๋ฐํ๋ฉด์ ์๊ฒ๋ ๊ฒ๋ค, ์ ๋ฆฌํ๋ฉด ์ข์ ๊ฒ๋ค์ ์ ์ด๋๊ณ ์ถ์ด์ ์ค๋๋ถํฐ ์ฃผ๊ธฐ์ ์ผ๋ก ํฌ์คํ
์ ํด๋ณด๋ ค๊ณ ํฉ๋๋ค. (1ํ๊ธฐ ํ๊ณ ๋ก์ ์์ฑํ๊ณ ์๋๋ฐ ์์ง ์์ฑ์ด ์๋ผ์ ๋น๊ณต๊ฐ๋ก ํด๋จ์ต๋๋ค...) ์ฑ๊ธํค ์ฑ๊ธํค, ์ ๊ณต์๋ผ๋ฉด ๋ค๋ค ๋ง์ด ๋ค์ด๋ดค์ ๋จ์ด์ผ ๊ฒ๋๋ค. ๋ง ๊ทธ๋๋ก ์ฑ๊ธ, ํ๋์ ์ธ์คํด์ค๋ง ์กด์ฌํ๋๋ก ํ๋ ๊ฒ์
๋๋ค. ์ธ์คํด์ค๋ฅผ ํ๋๋ง ๊ฐ์ง๊ธฐ ์ํด์๋ ์ด๋ป๊ฒ ํด์ผํ ๊น์? ๋จธ๋ฆฌ ์์ ๋ ..
๐ป ๊ฐ๋ฐ/Flutter
์ง๋ ์๊ฐ์ Column์ ๋ํด ์ ๋ฆฌํ์๋ค. ์ค๋ ์ ๋ฆฌํ ๋ด์ฉ์ Column์ผ๋ก ์์ ฏ๋ค์ ๋ณด์ฌ์ค ๋ ๋ฐ์ํ ์ ์๋ ๋ฌธ์ ๋ฅผ ํด๊ฒฐํด์ฃผ๋ ๋ ๋ค๋ฅธ ์์ ฏ์ด๋ค. import 'package:flutter/material.dart'; void main() { return runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar( title: Text("Column ์์ "), ), body: Column( mainAxisAlignment: MainAxisAlignment.spaceEvenly, ve..
๐ป ๊ฐ๋ฐ/Flutter
์ง๋ ์๊ฐ Container์ ์ด์ด ์ค๋์ Column, Row, Expanded์ ์์๋ณด๋ ค๊ณ ํ๋ค. ์ด์ ํฌ์คํ
์์ ๋ถ๊ฐ๋ฅํ๋ Container ๊ฐ์ ๋ถ๋ฆฌ๋ฅผ ์ด๋ฌํ ์์ ฏ๋ค์ ์ด์ฉํ์ฌ ํด๊ฒฐํ ์ ์๋ค. https://codekodo.tistory.com/95 3. Container, Padding ์ค๋ ์์๋ณผ ๊ฒ์ Container์ Padding ์์ ฏ์ด๋ค. ๊ฐ์ด ๋ฌถ์ด์ ์์ฑํ๋ ์ด์ ๋ ๋ ์์ ฏ์ด ๊ฑฐ์ ์ ์ฌํ๊ธฐ ๋๋ฌธ์ด๋ค. Container ์ฐ์ ๊ณต์๋ฌธ์์๋ Container๊ฐ ์์ ์์ ฏ์ ์ปค์คํฐ๋ง์ด์ง ํ ์ ์๋ ์์ ฏ์ด codekodo.tistory.com ์ค๋ ์์๋ณผ ๊ฒ์ Container์ Padding ์์ ฏ์ด๋ค. ๊ฐ์ด ๋ฌถ์ด์ ์์ฑํ๋ ์ด์ ๋ ๋ ์์ ฏ์ด ๊ฑฐ์ ์ ์ฌํ๊ธฐ ๋๋ฌธ์ด๋ค. ์ฐ์ ๊ณต์๋ฌธ์์๋ Co..
๐ป ๊ฐ๋ฐ/Flutter
์ค๋ ์์๋ณผ ๊ฒ์ Container์ Padding ์์ ฏ์ด๋ค. ๊ฐ์ด ๋ฌถ์ด์ ์์ฑํ๋ ์ด์ ๋ ๋ ์์ ฏ์ด ๊ฑฐ์ ์ ์ฌํ๊ธฐ ๋๋ฌธ์ด๋ค. Container ์ฐ์ ๊ณต์๋ฌธ์์๋ Container๊ฐ ์์ ์์ ฏ์ ์ปค์คํฐ๋ง์ด์ง ํ ์ ์๋ ์์ ฏ์ด๋ผ๊ณ ๋์์๋ค. ์ด ๋ง์ ์ฆ, ์ฌ๋ฐฑ, ๊ฐ๊ฒฉ, ํ
๋๋ฆฌ ๋๋ ๋ฐฐ๊ฒฝ์์ ์ถ๊ฐํ๊ณ ์ถ์ ๋ Container๋ฅผ ์ฌ์ฉํ ์ ์๋ค๋ ๊ฒ์ด๋ค. ์ค์ ๋ก Cotainer ์์ ฏ์ ๋ค์ํ ์์ฑ์ ๊ฐ์ง๊ณ ์๋ค. Container Container({ Key? key, AlignmentGeometry? alignment, EdgeInsetsGeometry? padding, Color? color, Decoration? decoration, Decoration? foregroundDecoration, dou..
๐ป ๊ฐ๋ฐ/Flutter
ํ๋ฌํฐ์ ์์ ฏ์ ํฌ๊ฒ ๋ ๊ฐ์ง๋ก ๋๋๋ค. Stateful๊ณผ Stateless Stateful์ ์์ ฏ์ด ๋์ํ๋ ๋์ ๋ด๋ถ ํด๋์ค์์ ๋ฐ์ดํฐ ๋ณ๊ฒฝ์ด ํ์ํ ๊ฒฝ์ฐ์ ์ฌ์ฉ๋๋ค. setState ์คํ ์ดํ ํ๋ฉด์ ๋ค์ ๊ทธ๋ ค์ ๋ณ๊ฒฝ๋ ๋ถ๋ถ์ ๋ค์ ๋ฐ์ํ๋ค. Stateless๋ Stateful๊ณผ ๋ค๋ฅด๊ฒ ์์ ฏ์ด ๋์ํ๋ ๋์ ๋ฐ์ดํฐ ๋ณ๊ฒฝ์ด ์ผ์ด๋์ง ์๋ ๊ฒฝ์ฐ์ ์ฌ์ฉ๋๋ค. ์ฌ์ฉ์์ ๋ฐ์๊ณผ ์๊ด ์์ด ํ๋ฉด๋ง ๋ณด์ฌ์ค ๋ ์ฌ์ฉํ๋ค๊ณ ์๊ฐํ๋ฉด ๋๋ค. import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) ..
๐ป ๊ฐ๋ฐ/Flutter
ํ๋ฌํฐ๋ ์์ ฏ์ผ๋ก ์์ํด์ ์์ ฏ์ผ๋ก ๋๋๋ค. ํ๋ฌํฐ๋ก ์ฑ์ ๊ฐ๋ฐํ ๋ ํ๋ฉด์์ ๋ณด์ด๋ ๋ชจ๋ ๊ฒ(element๋ค์ ๋ฐฐ์น)๊ณผ padding, margin๊ณผ ๊ฐ์ ๋ณด์ด์ง ์๋ ๊ฒ๋ค์ด ์์ ฏ์ด๋ค. ์ด๋ฌํ Widget๊ฐ์ ๊ด๊ณ๋ฅผ Widget Tree๋ผ๊ณ ํ๋ค. Widget๋ค์ ๋ถ๋ชจ์ ์์์ ๊ด๊ณ๋ฅผ ๊ฐ๋๋ค. MyApp์ ์์์ผ๋ก MaterialApp์ด ์กด์ฌํ๋ค. Material์ ํ์ฌ ์๋๋ก์ด๋์ ์ ์ฉ๋ UI์ด๋ค. https://flutter.dev/docs/development/ui/widgets/material Material Components widgets flutter.dev ์ด์ ๋๋น๋๋ ๊ฒ์ Cuppertino, ํ์ฌ IOS์ ์ ์ฉ๋ UI์ด๋ค. https://flutter.dev/docs/developm..