파파비의 블로그

MaterialApp 위젯 안에 theme이 있고, 거기에 ThemeData를 설정할 수 있다. ThemeData는 속성이 워낙 많아 커스터마이징 하는게 압도감을 느낄 수 있음. 그래서 예시를 가져와봄 primarySwatch는 primaryColor + 그림자 등에 다양한게 적용되어 primaryColor 대신 쓰는 것을 권장함. accentColor는 primaryColor와 함께 쓰이는 색깔로, 강조하는 색깔로 쓰인다, canavasColor는 배경이되는 canvas의 색을 의미하며 fontFamily는 기본적으로 적용될 폰트를 의미한다. textTheme은 텍스트와 관련된 data를 설정 할 수 있는데, 폰트를 제외하고, 굵기나 색깔 등을 설정할 수 있다. 여기서는 ThemeData.light()..

그라디언트는 Contatiner 내의 데코레이션 항목에서 BoxDecoration을 쓸 때, 사용할 수 있다. 그라디언트를 속성에는 LinerGradient말고도 다양한 형태가 있다. 아무튼 colors 속성은 List를 받고, 비긴은 시작의 위치를 나타내며 Alignment로 정해준다. 그리고 end는 당연히 끝점. 거기에 deco에서 추가적으로 더 이쁘게, 테두리를 원형으로 한다던지의 작업을 통하면 더 예쁜 디자인이 가능하다. 이런식으로 말이다

In addition, the following resources might be helpful: Official Flutter Widget Intro + Deep Dive: Part 1 (Stateless Widgets): https://www.youtube.com/watch?v=wE7khGHVkYY Part 2 (Stateful Widgets, Widget Tree, Element Tree): https://www.youtube.com/watch?v=AqCMFXEmf3w Part 3 (Inherited Widget/ Context): https://www.youtube.com/watch?v=Zbm3hjPjQMk Part 4 (Keys): https://www.youtube.com/watch?v=kn0..

Card위젯이 있습니다. 우리는 이 Card위젯을 ListView에 column형태로 쌓아서 보여주려고 합니다. 우리는 이때 Card위젯의 배경색을 생성시 마다 랜덤하게 하여 알록달록하게 하고자 합니다. (배경색은 State에 저장되어있다고 가정합시다) 5개가 빨 주 노 초 파 순서로 쌓여 있습니다. 이중 4번째, '초록색' card를 지웠습니다. 그러면 파란색 카드가 위로 올라가겠지요. 그런데 이상한 일이 발생합니다. 파란색 카드의 내용은 동일하지만, 색깔이 초록색으로 바뀌었습니다. 왜 그런 것일까요? 문제는 플러터가 Widget Tree와 Element Tree를 비교할 때 생기게 됩니다. Element Tree는 Widget Tree가 다시 build 될 때, 위젯의 1) Widget Tree에서의..

inactive ; 실행이 되고 있지도 않은 상태를 의미해서 paused되기 전, detached가 실행되기전에 이 상태로 먼저 변함 (참고로 inactive는 예전에 paused > resume으로 돌아갈 때도 잠깐 변경 됐었지만 지금은 그렇지 않음). paused ; 시각적으로 보이지는 않지만 background에서는 돌아가고 있는 상태 resumed ; paused에서 돌아온 상태, 다시 보이기 시작하며 user input도 받을 수 있는 상태 detached ; 앱이 꺼지기 직전에 실행되는 것. - (정확히는 The application is still hosted on a flutter engine but is detached from any host views.) 특히 suspending은 o..

stateless widget 의 LifeCycle은 쉽습니다. 생성자 > Build() 이게 전부입니다. immutable한 객체이다 보니 이게 끝입니다. stateful widget은 다릅니다. stateful widget의 생성자 > stateful widget의 create state > state의 생성자 > state의 init state > build > didupdatewidget > build > dispose 이렇게 있을 수 있습니다. stateful widget의 생성자는 build가 실행될 때마다 다시 실행됩니다. 매우 여러번 실행됩니다. but, stateful widget의 create state, state의 생성자, state의 init state 은 한번씩만 실행됩니다. s..

widget tree를 다시 빌드하는 것이 비용이 많이 들지는 않지만, 어떤 위젯들은 절대 바뀌지 않는데도 다시 그려지면 그것은 낭비라고 할 수 있습니다. 우리는 조건을 충족하는 위젯들에 한해서 build가 실행되어도 다시 build가 되도록 하지 않게 할 수 있습니다. 위젯을 생성할 때 앞에 const 를 붙여주면 됩니다. 이런식으로 말이죠. 당연히 해당 위젯은 stateless여야하고, 생성자의 값이 시종일관하여 앱이 끝날 때까지 변하지 않는 그런 위젯이어야합니다. 생성자에 들어가는 인자의 값이 dynamic하면 앞에 const를 붙일 수 없습니다. 이 chartbar 위젯은 stateless지만, 들어가는 값들이 map의 value들이라서 dynamic합니다. 따라서 앞에 const를 붙일 수가 없..

플러터는 60fps를 목표로 합니다. 그래서 1초에 60번 화면을 다시 그립니다. 이게 무리가 가진 않을까요? 아닙니다. 1초에 60번 계산하고, 화면을 그리면 무리가 갈 순 있는데, 플러터는 변경사항이 없다면 이전 계산값을 그대로 사용합니다. 계산량을 확 줄일 수 있죠. setstate이 실행되면 build가 자동으로 실행되고, build가 실행되면 해당하는 코드들이 실행이 되면서 아시다시피 위젯들은 '객체'이기도 하기에 기존 객체들은 사라지고, 새로운 객체들로 대체 된다. 객체가 새롭게 생긴다면 화면에 다시 그려야 하는게 아닐까? 아니다. 플러터는 3개의 Tree로 구성되어 있다. Widget Tree - Element Tree - Render Tree 1) Widget Tree - 위젯트리는 우리가..