코딩셰프 9강 정리
<Appbar>
centerTitle: true >>> 상단바 가운데 정렬
evaluation >>> 그림자 만들기 (소수점 단위로도 됨)
<Padding>
scaffold(body: Padding( padding: EdgeInsets.fromLTRB({30.0},top,right,bottom),),)
<정렬>
1. Center() >>> 가로 정렬
2.Column 위젯 내에서
mainAxisAlignment: MainAxisAlignment.{ceter}> 세로 정렬
crossAxisAlignment: CrossAxisAlignment.{starter} > 가로정렬
//출처:상욱조
코딩셰프 10강 정리
<Body>
Body 부분 색깔 적용
Scafold(
backgroudColor:Colors.{amber},
)
<글자 디자인>
Text('{쓸 내용}',
style: TextStyle(
color: Colors.{색깔}, //글자 색깔 처리
letterSpacing: 2.0, //글자 간격 처리
fontSize:28.0,//글자 사이즈 처리
fontWeight: FontWeight.bold, //글자 굵기 처리
),
)
<여백관리>
Column(
children:<widget>[
Sizedbox(
height: 10.0,
width: 10.0,
)]
코딩셰프 11강 정리
<image 삽입>
pubspec.yaml에서 assets 부분
assets:
- assets/hamtori.png
- assets/pangsu.png
바꾸고
다시 dart파일에 와서 <widget>[
child: CircleAvartar(
backgroundImage: AssetImage('assets/pangsu.png'),
radius: 60.0, ),]
<Debug 빨간띠 없애기>
MaterialApp(
debugShowCheckedModeBanner: false,)
코딩셰프 13강 정리
dart는 type추론이 가능한 언어지만 error의 가능성이 있기때문에 타입지정해주는 편이 좋음.
코딩셰프 14강 정리
<App bar icon button>
leading: 아이콘 버튼이나 간단한 위젯을 왼쪽에 배치할 때
actions: 복수의 아이콘 버튼 등을 오른쪽에 배치할 때
onPressed: 함수의 형태로 일반 버튼이나 아이콘 버튼을 터치했을 때 일어나는 이벤트를 정의하는 곳
ex..
appBar: AppBar(
leading: IconButton(
icon: Icon(Icons.menu),
onPressed: () {
print('menu button is clicked');
} ,
),
)
두개 할때는
actions: <Widget>[
IconButton(
icon: Icon(Icons.shopping_cart),
onPressed: () {
print('shopping_cart button is clicked');
} ,
),
IconButton(
icon: Icon(Icons.search),
onPressed: () {
print('search button is clicked');
} ,
),
],
코딩셰프 15강 정리
<drawer>
drawer메뉴를 추가하면 appbar의 leading부분에 햄버거 아이콘이 추가됨
코딩셰프 16강 정리
<listview>
children속성안에서
UserAccountsDrawerHeader 안에
currentAccountPicture, otherAccountPicture있고 required로 무조건 있어야하는 속성인 accountName과 accountEmail무조건 넣어줘야함.
ex.
ListView(
padding: EdgeInsets.zero,
children: <Widget>[
UserAccountsDrawerHeader(
currentAccountPicture: CircleAvatar(
backgroundImage: AssetImage('assets/hamtori.png'),
backgroundColor: Colors.red[200],),
otherAccountsPictures: <Widget>[
CircleAvatar(
backgroundImage: AssetImage('assets/pangsu.png'),
backgroundColor: Colors.red[200],
),
],
<UserAccountsDrawerHeader>
이거 안에 decoration:Boxdecoration이 있고, 윤곽 둥글게 하는 속성도 있는데 Boxdecoration 안에 borderRadius: BorderRadius.only 속성안에
bottomleft나 bottomright있어서 둥글게 만들어 줄 수 있다.
ex.
decoration: BoxDecoration(
color: Colors.red[200],
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(40.0),
bottomRight: Radius.circular(40.0))
),
<ListTile>
leading속성있음.(왼쪽)
trailing 속성있음.(오른쪽)
<Icon 색깔바꾸기>
Icon(Icons.home, color:Colors.grey)
'Flutter' 카테고리의 다른 글
| google_API_KEY를 숨겨요 (0) | 2022.09.21 |
|---|---|
| 정렬(column,row 등) (0) | 2021.10.03 |
| override (0) | 2021.10.01 |
| flutter 참고 유튜브 사이트 정리 (2) | 2021.08.25 |
| Git & Github 명령어 모음 (1) | 2021.08.16 |