Skip to main content

Flutter Apprentice1章と2章で分からなかったことをまとめる

Flutter Apprenticeを買いました。
Chapter1 Getting Started
Chapter2 Hello, Flutter
を読んだので分からなかったことをまとめる


Flutter全般
・Flutterに向いてる人
モバイルアプリの経験がない人
今アプリを持っていない人
アプリを持っているがこれからのメンテナンスコストを考えた結果使う人

・Flutterが向いていないもの
複雑なゲーム
ネイティブの機能を使うもの
Watch OSやTV等のデバイス対応が必要になる場合

 

AndroidStudio
・AndroidStudioからFlutter Projectを作る
New Projectでは画面を選ぶ必要がある。
Flutter SDKのパスを選択する。
この二つを実施すると普通にプロジェクト作れる

・Flutter Inspector
View->Tool Window->Flutter Inspector
or
右端にタブがある

 

ウィジェット
・accentColor

accentColor: Colors.black
          colorScheme: ColorScheme.fromSwatch(primarySwatch: Colors.blue).copyWith(secondary: Colors.black)

・色の違い
>primaryColor アプリの基本色になります。AppBarやTabBar、FloatingActionButtonなど、アプリのメインとなるWidgetの背景色がこれになります
>accentColor アプリのアクセントカラーです。ScrollViewをいっぱいまでスクロールしたときにでるoverscroll edge effectなどの色になります
https://itome.team/blog/2019/12/flutter-advent-calendar-day12/

・ColorScheme.fromSwatch
ColorScheme.fromSwatch
はMaterialColorのみ入れれる。
MaterialColorってクラスが定義されてる

・primarySwatchとprimaryColorの違い
>It is usually better to define a primarySwatch instead of primaryColor. Because some material components may use a different shade of the primaryColor for things such as shadow, border, …
https://stackoverflow.com/questions/50212484/what-is-the-difference-between-primarycolor-and-primaryswatch-in-flutter

・font-weight
700がbold
400がnormal
この手のデザイン初めて知った。
https://developer.mozilla.org/ja/docs/Web/CSS/font-weight

・クリック処理
GestureDetectorを使う
https://www.choge-blog.com/programming/flutterlistview-builder-tap/

・Pixelの名前
>描画に使うドットと端末のドットが混在しないように、この記事でもプログラム上のドットをlogical pixel、液晶のドットをdevice pixelと呼ぶことにします。
https://toconakis.tech/flutter-size/

・Expanded
>ExpandedというWidgetは、RowやColumnの子Widget間の隙間を目一杯埋めたいときに使います。
https://qiita.com/nannany_hey/items/d4114f615e4d53964121

・Slider
>divisionsはメモリの数値を決めるための値で、(max – min) / divisionsの計算で値が決定します。
https://flutter.ctrnost.com/basic/interactive/form/slider/

 

関連記事:

Pocket