すらぼうの開発ノート

モバイルアプリエンジニアのメモ

【Flutter / Dart】乱数の作成方法まとめ

Dartで乱数を作成する方法を説明する。 必要なライブラリ パターン別乱数生成方法 整数( 例. 0から100の間の整数 ) 少数 ( 例. 0.0から0.999...の間の少数 ) 自然数 ( 例. 1から100の間の整数 ) 任意の範囲の整数 ( 例. 50から60の間の整数 ) 任意の範囲の少…

【Flutter】Snackbarの使用方法まとめ

本エントリではSnackBarの使用方法について説明する。 SnackBarとは SnackBarの作成・表示方法 表示方法 デザインの変更 ボタンあり 表示時間の調整 背景色の変更 サイズの変更 角の丸さ調整 SnackBarとは api.flutter.dev SnackBarはアプリの画面下部に数秒…

【Flutter】FloatingActionButtonのデザインバリエーションまとめ

本エントリではFloatingActionButtonのデザインバリエーションについて説明する FloatingActionButtonとは FloatingActionButtonのデザインバリエーションについて FloatingActionButton.small() FloatingActionButton.large() FloatingActionButton.extende…

【Flutter】FloatingActionButtonを複数表示する方法

本エントリでは floatingActionButtonを複数表示する方法 を以下の流れで説明する。 floatingActionButtonとは floatingActionButtonを1個表示する [補足] floatingActionButtonに文字列を表示したいケース floatingActionButtonを複数個表示する 垂直方向に…

【Flutter】IconButtonの使用方法まとめ

本エントリではIconButtonの使用方法についてまとめる。 IconButtonとは 必須のプロパティ onPressedがnullの場合の表示 デザイン サイズ アイコンの色 タップ時の背景色 タップ中の背景色 タップ時の処理 通常タップ 長押しタップ その他 アイコンの回転 Ic…

【Flutter】Textウィジェットで文字列を改行する

以下のコードの様にTextウィジェットに文字列を渡すだけの場合、画面幅まで文字列が達した場所で改行され表示される。 改行なしの場合 そこで任意の場所で改行を行いたい場合、以下の方法で簡単に実現することができる。 \n を用いる 三重引用符( """ )を…

【Flutter】ElevatedButtonのデザイン例(サイズ、背景色、形状、枠線)

ElevatedButtonとは 実装 デフォルトのデザイン 無効時のデザイン デザイン設定一覧 サイズ styleプロパティを指定 SizedBoxでラップ サイズを設定する際の注意点 背景色 形状 枠線 枠線の色を設定する 枠線の太さを設定する ElevatedButtonとは api.flutter…