Flutter 기본적인 위젯 정리

youngseoKim·2020년 2월 15일
1
post-custom-banner

Flutter는 레이아웃을 그리는 기본적인 단위가 위젯입니다.

화면에 텍스트를 표시하려면 Text 위젯을 사용합니다.

Text("Hello Flutter!")

화면 중앙에 표시하려면 Center 위젯을 사용하고,
child 속성으로 Text를 표시합니다.

body: Center(
    child: Text("Center!")
)

세로로 정렬하려면 Column 위젯을 사용합니다.

body: Column(
  children: <Widget>[
    Text('세로로!'), 
    Text('정렬한다!'), 
    ]
)

가로로 정렬하려면 Row 위젯을 사용합니다.

body: Row(
  children: <Widget>[
    Text('가로로!'), 
    Text('정렬한다!'), 
    ],
),

정렬은 mainAxisAlignment 속성을 사용합니다.

가운데 정렬은

mainAxisAlignment: MainAxisAlignment.center

요소들을 일정 간격으로 벌릴려면

mainAxisAlignment: MainAxisAlignment.spaceAround

버튼을 표시하는 위젯은 RaisedButton 입니다.

RaisedButton(child: Text("버튼 텍스트 ~"))

이때 버튼 텍스트의 색을 변경하려면 Text 위젯에
style 속성을 사용합니다.

RaisedButton(child: Text(
  "버튼 텍스트입니다 !",
  style:TextStyle(color:Colors.white)
  )
)
profile
현재 마크애니 블록체인팀에서 블록체인 솔루션과 DAPP 파트를 개발하고 있습니다. 서버 개발과 운영 , 클라우드 서비스에 관심이 많습니다.
post-custom-banner

0개의 댓글