본문 바로가기
반응형

앱개발12

[Flutter] Card & ListTitle & Icon 아래에 더 정확한 설명을 해주는 주소 첨부 Flutter에는 Card라는 기능이 있습니다. 처음에 Container로 만들었지만 Card로 바꾼 이유는 디자인과 편의성 때문입니다. 카드는 모서리 끝에 약간 둥근 느낌이 있고, Container 처럼 margin과 padding을 줄 수 있습니다. padding을 주는 방법은 제 코드에서 child:Row 부분에서 Alt(Option)키를 누르고 엔터를 치시면 확인 하실 수 있습니다. 그리고 간단하게 아이콘과 텍스트 꾸미는 방법을 알아봅시다. Card( color: Colors.white, margin: EdgeInsets.symmetric(vertical: 10.0,horizontal: 25.0), child: Padding( padding: const .. 2020. 8. 7.
[Flutter] CircleAvatar & Fonts Flutter는 CircleAvatar라는 Widget이 있습니다. 이미지를 원형에 넣고 싶어서 쓴 기능입니다. 쓰는 방법은 간단합니다. backgroundImage를 통해 이미지를 넣어줍니다. child: Column( children: [ CircleAvatar( radius: 60.0, backgroundImage : AssetImage('images/img1.jpeg'), 다만 여기서 중요한건 경로 설정입니다. 경로 설정은 pubspec.yaml 파일에서 진행합니다. flutter: assets: - images/img1.jpeg 저는 images 라는 폴더를 만들었고, 그 안에 img1.jpeg 파일을 넣어줬습니다. 그리고 파이썬 처럼 간격이 매우 중요하기 때문에 유의하시길 바랍니다! Font를.. 2020. 8. 6.
[Flutter] Stateless Widget와 Stateful Widget Stateless Widget은 상태를 가지지 않은 위젯입니다. 화면이 랜더링이 되고 나서 그 이후에는 변경이 되지 않은 작업을 할 때 많이 사용을 합니다. Stateful Widget은 Stateless와 반대로 상태를 가질 수 있는 위젯입니다. 화면이 랜더링이 되고 나서, 사용자에게 입력을 받거나 클릭으로써 상태가 바뀌는 등 작업에 사용을 합니다. ex)CheckBox,Silder 등 즉 Sateless Widget은 UI작업을 할 때, 바로바로 보기 위해 사용을 합니다. (보여주기만 하는 것) Sateful Widget은 상태를 가지고 컨트롤 할 때 사용합니다. (터치 컨트롤) 이렇게 나눈 이유는 두 개의 LifeCylce이 다르기 때문입니다. Stateless는 보여주기만 하는 build로 넘어가.. 2020. 8. 5.
[Flutter] MainAxisAlignment (Axis) Flutter의 메인 축을 정렬하는 기능에 대해서 적어보겠습니다.(Axis는 중심선이라는 뜻 입니다.) 6가지의 함수가 있습니다. MainAxisAlignment.start MainAxisAlignment.end MainAxisAlignment.center MainAxisAlignment.spaceBetween MainAxisAlignment.spaceAround MainAxisAlignment.spaceEvenly 이것을 그림으로 나타내자면 Start 는 왼쪽 끝, End는 오른쪽 끝, Center는 중간을 뜻합니다. 사용은 Row() or Column() 안에서 적어주면 됩니다. import 'package:flutter/cupertino.dart'; import 'package:flutter/mat.. 2020. 8. 5.
반응형