๐ป ๊ฐ๋ฐ/Flutter
5. SingleChildScrollView, ListView
์ง๋ ์๊ฐ์ 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..
4. Column, Row, Expanded
์ง๋ ์๊ฐ Container์ ์ด์ด ์ค๋์ Column, Row, Expanded์ ์์๋ณด๋ ค๊ณ ํ๋ค. ์ด์ ํฌ์คํ ์์ ๋ถ๊ฐ๋ฅํ๋ Container ๊ฐ์ ๋ถ๋ฆฌ๋ฅผ ์ด๋ฌํ ์์ ฏ๋ค์ ์ด์ฉํ์ฌ ํด๊ฒฐํ ์ ์๋ค. https://codekodo.tistory.com/95 3. Container, Padding ์ค๋ ์์๋ณผ ๊ฒ์ Container์ Padding ์์ ฏ์ด๋ค. ๊ฐ์ด ๋ฌถ์ด์ ์์ฑํ๋ ์ด์ ๋ ๋ ์์ ฏ์ด ๊ฑฐ์ ์ ์ฌํ๊ธฐ ๋๋ฌธ์ด๋ค. Container ์ฐ์ ๊ณต์๋ฌธ์์๋ Container๊ฐ ์์ ์์ ฏ์ ์ปค์คํฐ๋ง์ด์ง ํ ์ ์๋ ์์ ฏ์ด codekodo.tistory.com ์ค๋ ์์๋ณผ ๊ฒ์ Container์ Padding ์์ ฏ์ด๋ค. ๊ฐ์ด ๋ฌถ์ด์ ์์ฑํ๋ ์ด์ ๋ ๋ ์์ ฏ์ด ๊ฑฐ์ ์ ์ฌํ๊ธฐ ๋๋ฌธ์ด๋ค. ์ฐ์ ๊ณต์๋ฌธ์์๋ Co..
3. Container, Padding
์ค๋ ์์๋ณผ ๊ฒ์ Container์ Padding ์์ ฏ์ด๋ค. ๊ฐ์ด ๋ฌถ์ด์ ์์ฑํ๋ ์ด์ ๋ ๋ ์์ ฏ์ด ๊ฑฐ์ ์ ์ฌํ๊ธฐ ๋๋ฌธ์ด๋ค. Container ์ฐ์ ๊ณต์๋ฌธ์์๋ Container๊ฐ ์์ ์์ ฏ์ ์ปค์คํฐ๋ง์ด์ง ํ ์ ์๋ ์์ ฏ์ด๋ผ๊ณ ๋์์๋ค. ์ด ๋ง์ ์ฆ, ์ฌ๋ฐฑ, ๊ฐ๊ฒฉ, ํ ๋๋ฆฌ ๋๋ ๋ฐฐ๊ฒฝ์์ ์ถ๊ฐํ๊ณ ์ถ์ ๋ Container๋ฅผ ์ฌ์ฉํ ์ ์๋ค๋ ๊ฒ์ด๋ค. ์ค์ ๋ก Cotainer ์์ ฏ์ ๋ค์ํ ์์ฑ์ ๊ฐ์ง๊ณ ์๋ค. Container Container({ Key? key, AlignmentGeometry? alignment, EdgeInsetsGeometry? padding, Color? color, Decoration? decoration, Decoration? foregroundDecoration, dou..
2. Stateless, Stateful
ํ๋ฌํฐ์ ์์ ฏ์ ํฌ๊ฒ ๋ ๊ฐ์ง๋ก ๋๋๋ค. Stateful๊ณผ Stateless Stateful์ ์์ ฏ์ด ๋์ํ๋ ๋์ ๋ด๋ถ ํด๋์ค์์ ๋ฐ์ดํฐ ๋ณ๊ฒฝ์ด ํ์ํ ๊ฒฝ์ฐ์ ์ฌ์ฉ๋๋ค. setState ์คํ ์ดํ ํ๋ฉด์ ๋ค์ ๊ทธ๋ ค์ ๋ณ๊ฒฝ๋ ๋ถ๋ถ์ ๋ค์ ๋ฐ์ํ๋ค. Stateless๋ Stateful๊ณผ ๋ค๋ฅด๊ฒ ์์ ฏ์ด ๋์ํ๋ ๋์ ๋ฐ์ดํฐ ๋ณ๊ฒฝ์ด ์ผ์ด๋์ง ์๋ ๊ฒฝ์ฐ์ ์ฌ์ฉ๋๋ค. ์ฌ์ฉ์์ ๋ฐ์๊ณผ ์๊ด ์์ด ํ๋ฉด๋ง ๋ณด์ฌ์ค ๋ ์ฌ์ฉํ๋ค๊ณ ์๊ฐํ๋ฉด ๋๋ค. import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) ..
1. Widget
ํ๋ฌํฐ๋ ์์ ฏ์ผ๋ก ์์ํด์ ์์ ฏ์ผ๋ก ๋๋๋ค. ํ๋ฌํฐ๋ก ์ฑ์ ๊ฐ๋ฐํ ๋ ํ๋ฉด์์ ๋ณด์ด๋ ๋ชจ๋ ๊ฒ(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..