Flutter【Flutter】タブのページをスワイプで切り替える方法
タブのページをスワイプで切り替える方法を紹介します！ 前提 タブでページを切り替えられるようになっていることが前提です。タブでのページ切り替えについては、以下の記事で紹介していますのでご参照ください。 方法 ...
Flutter 記事一覧
FlutterFlutter【Flutter】画面下部のタブでページを切り替え可能にする方法
Flutter で画面下部にタブを表示するには、BottomNavigationBar を使用します。今回は、この BottomNavigationBar を使用してタブでページを切り替えられうようにする方法を紹介します！ Bott...
Flutter【Flutter】ListView にスクロールバーを表示させる方法
ListView でスクロールバーを表示する方法を紹介します！ListView の使い方については、以下の記事をご参照ください。 スクロールバーの表示方法 ListView にスクロールバーを表示するには、Scro...
Flutter【Flutter】スクロール可能なリストを表示する ListView の使い方
今回は、ListView について紹介します！ListView は、スクロール可能なリストを表示するための Widget です。画面に ListView の項目が収まらない場合はスクロールできます。 基本の使い方 以下のように...
Flutter【Flutter】TimePicker で時刻を入力できるようにする
Flutter で時刻を入力できるようにする方法について紹介します！ 日付入力を受け付ける DatePicker については、以下の記事で紹介しています。 方法 以下の関数を、ボタンの押下時等に呼び出すことで...
Flutter【Flutter】カレンダーから日付を入力できるようにする方法
Flutter でカレンダーを表示して、日付入力を受け付ける方法について紹介します！ 方法 以下の関数を呼び出すと、カレンダーが開いて日付を選択できるようになります。 Future<void> _select...
Dart【Dart】DateTimeで日付・時刻を操作する方法 まとめ
Flutter で、日付や時刻を扱うDateTimeクラスで、「現在の時刻を取得する」、「日付を比較する」、「フォーマットする」などの操作方法を紹介します。 現在の日付・時刻を取得する ローカルの日付・時刻 ローカル(端...
Flutter【Flutter】Widget を条件分岐で出し分ける方法
Flutter で、Widget を条件に応じて、出し分けたい時もあると思います。この時、if 文や switch 文を直接 child で使用して制御しようとすると、エラーになります。自分も最初 if 文を使用して Widget を制御...
Flutter【Flutter】AudioPlayers で音声を再生する
Flutter で BGM や効果音を再生する方法について紹介します！今回は、AudioPlayers のパッケージを使用して音声を再生します。 事前準備 事前準備として、AudioPlayers のパッケージインストールや、...
Flutter【Flutter】WebView で Web ページを表示する方法
Flutter で WebView を使用して、Webページを表示する方法についてご紹介します！ 事前準備 パッケージをインストール Flutter の WebView については、公式のパッケージがあります。まずは、公...
Flutter【Flutter】LinearProgressIndicator で、HP ゲージをつくってみた
Flutter で 以下のような HP によって色が変わる HP ゲージをつくってみました！そのソースコードと解説、使い方を紹介します！ ソースコード 今回作成した HP ゲージの独自 Widget クラスのソ...
Flutter【Flutter】プログレスインジケータのデザイン変更方法
Flutter におけるプログレスインジケータのサイズや、線の太さ、色といったデザインを変更する方法を紹介します！Flutter のプログレスインジケータの種類と表示方法については、以下の記事で詳しく紹介していますので、よろしければご参照...
Flutter【Flutter】プログレスインジケータの種類と表示方法
Flutter における プログレスインジケータ（Progress Indicator）の種類と表示方法について紹介します！プログレスインジケータは、処理の進行状況を表すときに使用されます。Progress が「進捗」、Indicator...
Flutter【Flutter】基本的なボタン3種類とデザインの変更方法
Flutter で使用できるボタンには、どのようなものがあるか基本的なものを紹介します。また、ボタンのデザインを変更する方法も一緒に紹介します。 基本的なボタンの種類 ボタン表示用 Widget には、基本的なものとして以下...
Flutter【Flutter】ドロップダウン(プルダウン)メニューの作り方
Flutter でドロップダウン(プルダウン)メニューを表示するには、DropdownButton を使用します。今回は、この DropdownButton について紹介します！ DropdownButton の使い方 必要な...
Flutter【Flutter】独自の Widget クラスを作成する方法
同じような Widget のまとまりを何回も使い回す場合、似たようなコードが繰り返されます。繰り返しがあっても動作はしますが、コードがわかりにくくなったり、変更が大変になったりします。そこで今回は、独自 Widget クラスを作成して使い...
Flutter【Flutter】グラデーションボタンを作成する方法
ボタンの背景をグラデーションにする方法を2種類紹介します。 ElevatedButton を使う方法 ElevatedButton の子Widget に、Inkを指定します。Ink を使うことで、Ink の子Widget であ...
Dart【Dart】乱数の生成方法と3つの応用例
Dart で乱数を生成する方法を紹介します。また、乱数の応用例として、指定の範囲でランダムに整数を生成する方法や、指定の桁数の整数をランダムに生成する方法、ランダムな文字列の作成方法も紹介します。 乱数の生成方法 math ラ...
Flutter【Flutter】Widget を下寄せして配置する4種類の方法
Text や Image、Column のような Widget を下寄せして配置する方法を4種類紹介します。ここでは、下寄せにして配置することを例にしていますが、上寄せや左右寄せなどにも応用できます。 Container 内の Wi...
Flutter【Flutter】アプリの動かし方とビルドモード（Debug / Profile / Release）について
Flutter には、ビルドモードが3種類あります。アプリ開発の状況・場面に応じてアプリの動かし方を変えるために、ビルドモードを使い分けます。今回は、このビルドモード3種類について紹介します。 Debug Mode（デバッグ モード...