フロント側をFlutter（スマホ）Thymeleaf（PC）、バックエンド側SpringBootの自動作成＠自動生成ツール作成中

18:39
①今日は、『自動作成できたFlutterプログラムでをスマホ実機で動かしたい。』をやっている。まずこんな感じでAndroidStudioに入れた。
まあ、この時点では動いてくれるという思いでいっぱいだった。けど、入れてみたら、コンパイルエラーがたくさんある。

自動作成後のAndroidStudioProjectsへの設定
１．既存のプロジェクト「flutter_app」があれば、
　AndroidStudioProjectsフォルダ（例：C:\Users\自ユーザー\AndroidStudioProjects\flutter_app）の
　flutter_appフォルダをどこかにバックアップする。
２．AndroidStudioを立ち上げる。
３．既存のプロジェクト「flutter_app」があれば、削除する。
　手順：File→Close Projectをクリック
　　　一覧が出てきます。
　　　消したいプロジェクトを右クリック→Remove from Recent Project（Delete）押下。
　　　AndroidStudioを終了し、AndroidStudioProjectsフォルダ
　　　（例：C:\Users\自ユーザー\AndroidStudioProjects\flutter_app）の削除を確認する。
４．AndroidStudioを立ち上げる。
５．新規Flutterプロジェクトとして、プロジェクト「flutter_app」を作成する。
　新規→新規Flutterプロジェクト」→Flutterをクリック
　　一番左に位置する「Flutter Application」を選択して、右下に位置する「Next」
　　ProjectName:flutter_app、プロジェクトタイプ：Application、組織：com.kaz01で、
　　右下に位置する「Finish」押下。
　　途中、FlutterのSDKの場所を聞かれるので、セットアップ「Flutterの環境構築（Windows）」時に
　　　「例：flutter_windows_2.8.1-stable.zip」を展開後置いた場所
　　　（例：C:\src\flutter\bin\flutter）を指定する。
　　　補足：展開後置いた場所が分からないときは、Flutterの環境構築が済んでいれば、
　　　　　　DOSコマンドで「where.exe flutter」で表示されます。
６．プロジェクト「flutter_app」に、自動作成したもの
　（Flutter_JavaSpringプログラム作成ツール\作成例\作成先フォルダ\flutter_app）を置く。
　手順：
　　・ファイルエクスプローラーで、「Flutter_JavaSpringプログラム作成ツール\作成例\
　　　作成先フォルダ\flutter_app\lib」以下をすべて選択し、右クリック→コピー押下
　　　AndroidStudio画面・プロジェクト「flutter_app」・「flutter_app\lib」で
　　　右クリック→Paste→Copy画面が出るのでOK押下。
　　　途中、上書き確認が出るので、Overwrite押下する
　　・「Flutter_JavaSpringプログラム作成ツール\作成例\作成先フォルダ\flutter_app\pubspec.yaml」を選択しコピー
　　　プロジェクト「flutter_app」右クリック→Paste→Copy画面が出るのでOK押下。
　　　途中、上書き確認が出るので、Overwrite押下する
７．プロジェクト「flutter_app」・pubspec.yamlを選択し表示されたエディタの右上「Pub Get」を押下する。
　　「Process finished with exit code 0」がMessege欄に表示される。
　　これにより、PGMエラーは表示されなくなる。Warningは残るので気になるものがあれば修正してください。

②コンパイルエラーがたくさんある。ので、一つ一つつぶしている。今日は、このへんまで。続きはあしたやろう。

■情報画面Form、検索画面Formのクラスにcupertino.dartのimportが必要
これ→import 'package:flutter/cupertino.dart';

■情報画面Form、検索画面FormのクラスのDateはDateTime?とする。
　・dartにDateクラスはない。?をつけないとnullが設定できない。
  late Date insdtFrom; // 登録日時From
↓
  late DateTime? insdtFrom; // 登録日時From

■情報画面Form、検索画面FormのクラスのLongはintとする。
  late Long biztypeCd; // 業種ID
↓
  late int biztypeCd; // 業種ID

■検索画面Formのクラスにcomm_utils.dartのimportが必要
これ→import 'package:flutter_app/utils/comm_utils.dart';

■検索画面Formのクラス名の先頭を大文字にする
/// 商品情報検索画面Form
class shohinSrchForm {
↓
class ShohinSrchForm {

■エラーメッセージ用Form、検索画面Form中の、エラーメッセージ用Formクラス名の先頭を大文字にする
  // 初期値のクラスを作成している
  itemErrForm.initData()  {
↓
  ItemErrForm.initData()  {

  // プロパティ　エラーメッセージ
  late shohinSrchErrForm shohinSrchErrForm; // プロパティ　エラーメッセージ
↓
  late ShohinSrchErrForm shohinSrchErrForm; // プロパティ　エラーメッセージ

    // プロパティ　エラーメッセージ
    shohinSrchErrForm = shohinSrchErrForm.initData();
↓
    shohinSrchErrForm = ShohinSrchErrForm.initData();

■情報画面Form、検索画面Form中に「;」の無い文がある
  forShohinFormController(
      TextEditingController productsnameController
      ) {
    productsnameController.text = productsname
↓
    productsnameController.text = productsname;

  fromShohinFormController(
      TextEditingController productsnameController
      ) {
    productsnameController.text = productsname
↓
    productsnameController.text = productsname;

    item26Controller.text = item26
↓
    item26Controller.text = item26;

■情報画面Form、検索画面Form中の「int」項目はとString()が必要な場所がある
    item19Controller.text = item19;
↓
    item19Controller.text = item19.toString();

■CommUtilsクラスにurl_launch_page.dartのimportではなく、url_launcher.dartのimportが必要
import 'package:url_launcher/url_launch_page.dart';
↓
import 'package:url_launcher/url_launcher.dart';

■CommUtilsクラスのlaunchInWebViewOrVCメソッドのconstを削除する
        webViewConfiguration: const WebViewConfiguration(headers: headers)
↓
        webViewConfiguration: WebViewConfiguration(headers: headers)

■CommUtilsクラスのcreateLrgMidChangeメソッドのdbELEMENTSを削除する
    if (dbELEMENTS == null) {
      return dbELEMENTS;
    }
↓
削除

■common_util.dartのcreateLrgMidSmlChange2の変数名間違いと左側インデントを修正
	Map<String, String> data = {"fmElementNm":fmElementNm, "fmLrgKey":LrgValue,
	                        "fmMidKey":midValue, "fmMidSelKbn":fmMidSelKbn, 
↓
	  Map<String, String> data = {"fmElementNm":fmElementNm, "fmLrgKey":lrgValue,
	                        "fmMidKey":midValue, "fmMidSelKbn":midSelKbn, 

■home.dartのimmport
import 'affairs/gazo/gazo_register_amend.dart';
↓
削除

import 'form/gazo_form.dart';
↓
削除

各情報の情報画面Form、検索画面Formをimmportする
例：以下を追加
import 'form/shohin_form.dart';
import 'form/shohin_srch_form.dart';

各情報の情報一覧、情報登録更新をimmportする
例：以下を追加
import 'affairs/shohin/shohin_list.dart';
import 'affairs/shohin/shohin_register_amend.dart';

■home.dartの変数名間違い。各情報で間違っている
                        ShohinRegisterAmend(title: widget.title,
                            Shohinname: widget.Shohinname,
↓
                        ShohinRegisterAmend(title: widget.title,
                            username: widget.username,

■XXX_detail.dartの不要なimport削除や追加。
＜＜削除＞＞
import 'package:flutter_app/utils/elements.dart';
＜＜追加＞＞
import 'package:intl/intl.dart';

■XXX_detail.dartの変数名間違い。ここは、ログインユーザ名を渡しているので、usernameとするのが正しい。
  const ShohinDetail({Key? key, required this.title, required this.shohinname,
↓
  const ShohinDetail({Key? key, required this.title, required this.username,


■XXX_detail.dartの項目値が空白時の表示にconstを追記する
例：
          child:Text('商品ＣＤ : ',
            textAlign: TextAlign.left,
            overflow: TextOverflow.clip,
          ),
↓
          child:const Text('商品ＣＤ : ',
            textAlign: TextAlign.left,
            overflow: TextOverflow.clip,
          ),

■XXX_detail.dartの明細表示の値を修正
例：
_shohinForm.products
↓
_shohinForm.resDetailMapForm["products"]
・・・
_shohinForm.biztypeCdObj
↓
_shohinForm.resDetailMapForm["biztypeCdObj"]
・・・
_shohinForm.biztypeCdObj.bizname
↓
_shohinForm.resDetailMapForm["biztypeCdObj"]["bizname"]

■XXX_detail.dartの明細表示の固定エレメント値を修正
例：
    if (_shohinForm.openkbn1Obj != null) {
_shohinForm.openkbn1Obj.openkbn1Name
↓
    if (_shohinForm.resDetailMapForm["openkbn1Name"] != "") {
_shohinForm.resDetailMapForm["openkbn1Name"]

■情報画面Formに、XXX_detail.dartで使うためresDetailMapFormを追加する
＜＜追加　start＞＞
  late Map<String,dynamic> resDetailMapForm; // 明細情報
＜＜追加　end＞＞
・・・
  UserSrchForm.initData() {
・・・
＜＜追加　start＞＞
  resDetailMapForm = {}; // 明細情報
＜＜追加　end＞＞
・・・
  fromJson(String resData) {
・・・
＜＜追加　start＞＞
    // 明細情報
    if (_resDataMap["resDetailMapForm"]==null) {
      resDetailMapForm = {};
    } else {
      resDetailMapForm = _resDataMap["resDetailMapForm"];
    }
＜＜追加　end＞＞

■Spring側にresDetailMapFormを追加する。さらに固定になっているresListForm作成を各情報様に修正する。
①flutter-spring-kaz01u_元ネタ削除後_最新\src\main\java\com\kaz01u\demo\response\ResData.javaを修正
	/**
	 * getResDataMapメソッド
	 * Flutter向けデータマップを返却する
	 * 
	 * @param messageSource メッセージソース
	 * @param formComm Flutter側formComm
	 * @param resFormName Flutter側resForm
	 * @param srchFormName Flutter側srchForm
	 * @param srchOrdeFormName Flutter側srchOrdeForm
＜＜追加　start＞＞
	 * @param resDetailMapFormName Flutter側明細情報
	 * @param resListFormName Flutter側一覧情報
＜＜追加　end＞＞
	 * @return Flutter向けデータマップ
	 */
＜＜修正前　start＞＞
	public Map<String, Object> getResDataMap(MessageSource messageSource, FormComm formComm, String resFormName, String srchFormName, String srchOrdeFormName) {
＜＜修正前　end＞＞
＜＜修正後　start＞＞
	public Map<String, Object> getResDataMap(MessageSource messageSource, FormComm formComm, String resFormName, String srchFormName, String srchOrdeFormName,
												String resDetailMapFormName, String resListFormName) {
＜＜修正後　end＞＞
・・・
＜＜修正前　start＞＞
		map.put("resListForm", modelMap==null || modelMap.get("users")==null?null:modelMap.get("users"));
＜＜修正前　end＞＞
＜＜修正後　start＞＞
		map.put("resDetailMapForm", ObjectUtils.isEmpty(resDetailMapFormName) || modelMap==null || modelMap.get(resDetailMapFormName)==null?null:modelMap.get(resDetailMapFormName));
		map.put("resListForm", ObjectUtils.isEmpty(resListFormName) || modelMap==null || modelMap.get(resListFormName)==null?null:modelMap.get(resListFormName));
＜＜修正後　end＞＞

②hinagata\java\controller\admincomm\02_00_TblCommController.txtを修正
	/**
	 * リターン共通処理（Flutter、PC・WEB共用）
	 * リターン共通処理
	 *
	 * @param url 遷移先
	 * @param model モデル
	 * @param result　チェック結果
	 * @param flutterFlg　true：Flutter用　false：PC・WEB用
＜＜追加　start＞＞
	 * @param formComm Flutter側formComm
＜＜追加　end＞＞
	 * @param resFormName　レスポンスForm名
＜＜追加　start＞＞
	 * @param srchFormName Flutter側srchForm
	 * @param srchOrdeFormName Flutter側srchOrdeForm
	 * @param resDetailMapFormName Flutter側明細情報
	 * @param resListFormName Flutter側一覧情報
＜＜追加　end＞＞
＜＜削除　start＞＞
	 * @param page　検索以外の時のページ
＜＜削除　end＞＞
	 * @return Flutter用String：jsonデータ　PC・WEB用 Map<String, Object>：遷移先
	 */
＜＜修正前　start＞＞
	protected Object returnComm(String url ,Model model,BindingResult result, boolean flutterFlg, FormComm formComm, String resFormName, String srchFormName, String srchOrdeFormName) {
＜＜修正前　end＞＞
＜＜修正後　start＞＞
	protected Object returnComm(String url ,Model model,BindingResult result, boolean flutterFlg, FormComm formComm, String resFormName, String srchFormName, String srchOrdeFormName,
								String resDetailMapFormName, String resListFormName) {
＜＜修正後　end＞＞
		if (flutterFlg) {
			ResData resData = new ResData(model, result);
＜＜修正前　start＞＞
	        return resData.getResDataMap(messageSource, formComm, resFormName, srchFormName, srchOrdeFormName);
＜＜修正前　end＞＞
＜＜修正後　start＞＞
	        return resData.getResDataMap(messageSource, formComm, resFormName, srchFormName, srchOrdeFormName, resDetailMapFormName, resListFormName);
＜＜修正後　end＞＞
		} else {
			return url;
		}
	}
・・・
＜＜修正　start＞＞
以降、全ての「return returnComm(・・・」の最後を「);」→「,"■{prg_name}■", "■{prg_name}■s");」に変更する
＜＜修正　end＞＞

■2022/06/15に、勉強した成果：『Flutter_JavaSpringプログラム自動作成◎自動生成ツール』をVectorに載せました。Zenn本も書きました。使ってみての感想や間違いの指定や、こうやったほうがいいとかの情報があればメールください。
・Vector
www.vector.co.jp
・Zenn本(Flutter_JavaSpringプログラム自動作成)
zenn.dev