実現したいこと
ElevatedButtonをイメージ図のようにListに格納されている項目数分、forなどで追加したいと思っています。(ベタ書きした場合は、表示され正常に動きますが、コーディングが長く見にくくなってしまうので、コンパクトに出来ないかと思い模索している所です。)
イメージ図のように、よくあるRowとColumnのボタン配置かと思います。
まだ、RowとColumnの使い方を熟知していないので、混乱している部分もあります。
考えている仕様としては、以下のようなものになります。
・「A」から「H」までの項目は、「ItemNameDistribute」というclassで処理を行っています。(選択したカテゴリに該当するボタン表示項目を取得します)
カテゴリによってボタン表示項目が「A」から「n(必要数分)」に分けてあり、該当するカテゴリの対象となる項目を取得しています。
・「カテゴリA」の場合は、表示ボタン数が8つ
・「カテゴリB」の場合は、表示ボタン数が5つ
のように、「カテゴリX」によって表示ボタン数に変動があるので、ベタ書きのコーディングではなく、Forなどである分だけ追加するような形式にしたいと思っています。
試したこと
forEachで同じように試してみましたが、forの時と同じようにエラーが出ずに処理を上手く通っていないようで、ボタンは1つも表示されていない状態です。
発生している問題・エラーメッセージ
特にエラーなどが発生しておらず、どこから手を付けていいのかわからない状態です。
※「試したこと」の内容が発生している内容にもなります。
該当のソースコード
@override Widget build(BuildContext context) { //class(カテゴリA・カテゴリBのItemNameの振り分け) final itemNameDistribute = ItemNameDistribute( strStatus: widget.strStatus, strCategory: widget.strCategory); itemNameDistribute.itemNameDistributeMain(); return Scaffold( --- 省略 --- body: SafeArea( child: Stack( children: [ --- 省略 --- Container( padding: const EdgeInsets.fromLTRB(20.0, 100.0, 20.0, 0), child: (() { //Rowは2つずつなのでカウントアップは2ずつ(Row=2,Column=n) for (var index = 0; index < itemNameDistribute.ItemName.length - 1; index = index + 2) { Column( children: [ // Row( crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [ Expanded( flex: 1, //「ButtonWithNormal」は、ElevatedButton作成用のclassを切り出して処理を行っています。 child: ButtonWithNormal( label: itemNameDistribute.ItemName[index], //null対応まだ color: Colors.white, height: 100, //「_startHandbookListDetail」は、ボタン押下後に処理結果表示画面に遷移する予定です onPressed: () => (itemNameDistribute.ItemName[index] != null) ? _startHandbookListDetail( widget.strStatus, widget.strCategory, itemNameDistribute.ItemName[index]) : null //取り敢えず対応 ), ), const SizedBox( width: 20.0, ), Expanded( flex: 1, child: ButtonWithNormal( label: itemNameDistribute.ItemName[index + 1], //null対応まだ color: Colors.white, height: 100, onPressed: () => (itemNameDistribute.ItemName[index + 1] != null) ? _startHandbookListDetail( widget.strStatus, widget.strCategory, itemNameDistribute.ItemName[index + 1]) :null //取り敢えず対応 ), ), const SizedBox(width: 20.0), ], ), ], ); } })(), ), ], ), ), ); }
補足情報(FW/ツールのバージョンなど)
Flutter 3.7.3
Dart 2.19.2
※AndroidStudioで開発
イメージ図
全てのボタンが表示されている場合です。
このボタンが、カテゴリによって「A」~「E」までの奇数だったりします。

0 コメント