エディタ編
-
Android Studioを設定する
Android Studio を Flutter 仕様に変更しましょう。
-
ホットリロードの仕方
Android Studio で Hot Reload (ホットリロード) をしてみましょう。
ウィジット編
-
文字列を表示する
TextにTextStyleを組み合わせることで文字列 (テキスト) を表示することができます。 -
画像を表示する
Imageを使って、画像を表示します。 インターネット上から画像を取ってきて表示したり、 アプリ内に埋め込んだ画像を表示できます。 -
フラットなボタンを表示する
FlatButtonを使って、フラットなボタンを表示します。 -
立体的なボタンを表示する
RaisedButtonを使って、立体的なボタンを表示します。 -
ボタンの角を調整する
RaisedButtonの角を調整することで、角丸にしたり、丸みを取り除いたりしてみます。 -
ウェブビューを使用する
ウェブビュー
WebviewScaffoldを使って、ウェブページを表示します。 -
アニメーションで画像を切り替える
AnimatedCrossFadeを使って、画像などをスムーズに切り替えて表示します。
レイアウト編
-
パディングを調整する
PaddingとEdgeInsetsを使うことでパディングを持たせることができます。 -
中央に表示する
Centerを使うことで要素を中央に表示します。 -
リストを表示する
ListViewを使って、一覧 (リスト) を表示します。 -
列で縦方向に要素を並べる
列
Columnを使って、縦方向に要素を並べます。 -
行で横方向に要素を並べる
行
Rowを使って、横方向に要素を並べます。 -
スタックで自由に要素を並べる
スタック
Stackを使って、自由に要素を並べます。 -
横並びで均等に要素を並べる
行
RowとExpandedを使って横並びで均等に要素を並べてみます。 -
セーフエリアに表示する
セーフエリア
SafeAreaを使って、 iPhone X で適切なコンテンツ領域に表示されるようにします。 -
要素の大きさを制限する
ConstrainedBoxとBoxConstraintsを使うことで要素の大きさを制限します。
ライブラリ編
-
ウェブビューを使用する
ウェブビュー
WebviewScaffoldを使って、ウェブページを表示します。 -
Reduxを使う
Redux を使って見通しのよいプログラムを書きます。
-
HTTPにリクエストする
HTTP に情報をリクエストして表示します。
アニメーション編
-
アニメーションで画像を切り替える
AnimatedCrossFadeを使って、画像などをスムーズに切り替えて表示します。 -
アニメーションをちょっと本格的に実装する
Curve、AnimationControllerとTickerProviderStateMixinを使って、アニメーションを実装します。
ルーティング編
-
ルーティングを定義する
Navigatorを使って、ページ遷移を実装します。