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 Widget 오늘 알아볼 것은 Container와 Padding 위젯이다. 같이 묶어서 작성하는 이유는 두 위젯이 거의 유사하기 때문이다. 우선 공식문서에는 Container가 자식 위젯을 커스터마이징 할 수 있는 위젯이라고 나 codekodo.tistory.com Column Column은 수직 방향으로 element를 보여주는 위젯이다. Column도 다양한 속성을 가지고 있다. Column Column({..

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..