리프의 개발 블로그

레이아웃은 위젯의 위치를 잡아주는 역할을 합니다. 레이아웃이 다른 위젯이나 레이아웃의 child 또는 children 속성을 가지기도 합니다. Container Container는 한 개의 자식을 갖는 레이아웃 위젯입니다. Container의 생성자는 아래와 같습니다. Container({ Key key, this.alignment, this.padding, Color color, Decoration decoration, this.foregroundDecoration, double width, double height, BoxConstraints constraints, this.margin, this.transform, this.child, }) padding은 Container 내부의 공간을 의미하고 ..

플러터의 가장 기본적인 버튼입니다. RaisedButton 뿐만 아니라 FlatButton, DropdownButton, FloatingActionButton 등의 다양한 위젯들이 있습니다. RaisedButton의 생성자는 아래와 같습니다. const RaisedButton({ Key key, @required VoidCallback onPressed, VoidCallback onLongPress, ValueChanged onHighlightChanged, ButtonTextTheme textTheme, Color textColor, Color disabledTextColor, Color color, Color disabledColor, Color focusColor, Color hoverColor, ..

Text Text는 아래와 같은 생성자로 이루어져 있습니다. const Text( this.data, { Key key, this.style, this.strutStyle, this.textAlign, this.textDirection, this.locale, this.softWrap, this.overflow, this.textScaleFactor, this.maxLines, this.semanticsLabel, this.textWidthBasis, }) 아래는 전체 예제 코드입니다. import 'package:flutter/material.dart'; void main() => runApp(TextDemo()); class TextDemo extends StatelessWidget { static ..

위젯은 화면에 표시되는 것이라고 생각하면 됩니다. 모든 화면 표시와 사용자 상호작용에 위젯을 사용하기 때문입니다. 위젯은 크게 Stateless 위젯과 Stateful 위젯으로 구별합니다. Stateless 위젯 화면 표시용 위젯입니다. 위젯이 로딩되어 화면에 표시된 이후에는 사용자 이벤트나 동작이 있어도 내용을 변경할 수 없습니다. import 'package:flutter/material.dart'; void main() => runApp(MaterialApp( title: 'Stateless Widget', home: Scaffold( appBar: AppBar(title: Text('Stateless 위젯')), body: _FirstStatelessWidget(), ), )); class _Fi..

구조 확인하기 플러터는 모든 코드가 lib 폴더에서 관리됩니다. 코드 살펴보기 import 'package:flutter/material.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( primarySwatch: Colors.blue, ), home: MyHomePage(title: 'Flutter Demo Home Page'), ); } } import는 flutter의 material UI를 의미합니다. ios 스타일의 위..

변수 선언 [ var, dynamic ] void main() { /// int num1 = 1; var num2 = 2; dynamic num3 = 3; } var과 dynamic 둘다 타입을 추론을 하는 방식입니다. 둘다 자료형을 명시 해주지 않아도 됩니다. 기본적으로 var을 사용할 하고, dynamic은 함수와 같이 사용합니다. ( dynamic은 object 느낌 ) 선언을 하지 않으면 기본 값으로 null이 들어갑니다. num num은 int형과 double형 입니다. void main() { num number1 = 1; num number2 = 1.1; } 문자열 [ ' ', " " ] void main() { var str1 = "Flutter"; var str2 = 'Flutter'; ..

설치 https://flutter-ko.dev/docs/get-started/install 설치 Flutter를 설치할 운영 체제를 선택해주세요:{{site.alert.note}} **Are you on Chrome OS?** If so, see the official [Chrome OS Flutter installation docs!](/docs/get-started/install/chromeos){{site.alert.end}} flutter-ko.dev 본인의 운영체제에 맞게 설치를 하면 됩니다. 윈도우 기준으로 설명해드리겠습니다. zip 형식의 flutter를 다운로드하고 압축을 풀면 됩니다. Ex) C:\flutter flutter 환경변수 설정 유저 환경 변수 설정의 Path에 압축 푼 플러터..