動機

ver4.1のリリースはなんとかこぎつけたが、ver,5にむけて今後の追加機能ににむけて、メンテしやすいようにソースコードを変える必要がある。まず、技術の習得が必要と思われ取り組んだ。

課題

1. 十二運の解説ページが、870行に達している、画面生成部分だけで850行になっている。これを汎用表示部分と、表示内容データ部分に分け、今後増えると思われる解説ページは、表示内容データのみ作成すればいいようにする。

2. 命式ページにおいて、節入り時刻前の命式の表示を、画面遷移を使って行なっているが、① 外面遷移時に画面が一瞬乱れる ② 機能追加時、もう一つのページにも同じ変更を折り込む必要があり、バグを生じやすい。

変更内容

1. 解説表示用ページにおける、画面表示部分と表示内容データに分離して、今後汎用に使えるようにする。

図と文字列を一つのListとし、①図の名前、②図の高さ、③文字列、④文字の色 で汎用表示する画面表示用widgetを作成した。

 これによって、画面表示部分が60行、表示内容データ部分700行に分離した。

2. 画面遷移をstatefulWidgetで実現する

変更前 statelessWidget
import 'package:flutter/material.dart';

・・・

class MeisikiPage extends StatelessWidget {

//■■■■■■■■■画面遷移時引数を定義するエリヤ
  String nenchu; //年柱
  String gechu; //月柱
  String nichu; //日柱
 ・・・

 MeisikiPage(
      {Key? key,

//■■■■■■■■■引数を取り込むエリヤ
      required this.nenchu,
      required this.gechu,
      required this.nichu,
     ・・・
      })
      : super(key: key);

//■■■■■■■■■このページで使う変数を定義するエリヤ
  String nenkan = '甲';
  String nensi = '子';
  String gatukan = '甲';
 ・・・

  @override
  Widget build(BuildContext context) {

//■■■■■■■■■表示に必要な内容を計算するエリヤ
    //節入り日の時節入り時刻前ボタンを表示する
    if (setuirinitisuu == 1) {
      setuiriButtonWidth = 80;
      iroSetuiri = iroPink;
    } else {
      setuiriButtonWidth = 0;
      iroSetuiri = iroTeal;
    }
    //年柱・月柱・日柱から年干・年支・月干・月支・日干・日支を作成する
    nenkan = nenchu.substring(0, 1);
    nensi = nenchu.substring(1, 2);
    gatukan = gechu.substring(0, 1);
・・・

//■■■■■■■■■画面を表示するエリヤ
 return MediaQuery(
      data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0),
      child: Scaffold(
        appBar: AppBar(
          title: const Text(
            'あなたの命式は',
・・・

      ), // Scaffold の最後
    ); // MediaQuery の最後
  } // Widget build の最後


// ■■■■■■■■■下から現れてくるコメントの表示エリヤ
  _showSetuiri(BuildContext context) {
    showModalBottomSheet(
        
        });
  } // _showSetuiri の最後
} //StatelessWidget の最後

//■■■■■■■■■関数定義エリヤ
// 関数定義 地支から蔵干を算出する
//  c = zouKan(a, b)
//   a: 地支を表す文字列 ('子','丑','寅',・・・,'戌','亥')
//   b: 節入り日からの日数を表す数字 (1~31)(節入り日は、1 とする)
//   c: 蔵干を表す文字列 ('甲','乙','甲',・・・'壬','癸')
zouKan(String a, int b) {
  //蔵干表
  String zouKanHyou = //蔵干表
      '戊戊戊戊戊戊戊丙丙丙丙丙丙丙甲甲甲甲甲甲甲甲甲甲甲甲甲甲甲甲甲' //寅
      ・・・
  return c;
}
変更後 StatefullWidget
import 'package:flutter/material.dart';
・・・

class MeisikiPage3 extends StatefulWidget {

//■■■■■■■■■画面遷移時引数を定義するエリヤ(変更前と同じ)
String nenchu; //年柱
String gechu; //月柱
String nichu; //日柱
・・・

MeisikiPage3({
Key? key,

//■■■■■■■■■引数を取り込むエリヤ(変更前と同じ)
required this.nenchu,
required this.gechu,
required this.nichu,
・・・
required this.setuirinitisuu,
}) : super(key: key);


@override
State<MeisikiPage3> createState() => _MeisikiPage3State();
}

class _MeisikiPage3State extends State<MeisikiPage3> {

//■■■■■■■■■このページで使う変数を定義するエリヤ(記述する場所が変更)
int _counter = 0; // ボタンが押された回数(追加)
String nenchu = '甲子'; //widget内で使う年柱
String gechu = '甲子'; //widget内で使う月柱
String nichu = '甲子'; //widget内で使う日柱
・・・
//■■■■■■■■■画面の状態によって値が変わる定数を定義(追加)
int zenGo = 2; //0:節入り時刻後 1:節入り時刻前 2:節入り日以外
List<int> iroBotan = [-14575885, -12627531, -14575885];
List<int> iroTitle = [-1294214, -5767189, -1294214];
List<String> botanMoji = ['節入り時刻前', '節入り時刻後', '節入り時刻前'];
List<String> meisikiTitle = ['節入り時刻後の命式', '節入り時刻前の命式', 'あなたの命式は'];
List<int> nenchuNo = [1, 0, 1];
List<int> gechuNo = [1, 0, 1];
List<int> nichuNo = [1, 0, 1];

//■■■■■■■■■ボタンが押された時走る関数を定義エリヤ(追加)
void _incrementCounter() {
setState(() {
_counter++;
zenGo = _counter % 2;
});
}

@override
Widget build(BuildContext context) {

//■■■■■■■■■引数をwidgetで使えるようにするエリヤ(追加)
seinenInt = widget.seinen;
seigatuInt = widget.seigatu;
seinitiInt = widget.seiniti;
setuirinenInt = widget.setuirinen;
setuirigatuInt = widget.setuirigatu;
setuirinitiInt = widget.setuiriniti;
setuirinitisuuInt = widget.setuirinitisuu;

nenchu = widget.nenchu;
gechu = widget.gechu;
nichu = widget.nichu;

//■■■■■■■■■状態によって変わる最小限の変数を定義するエリヤ(追加)

nenchuNo[0] = nanmojime(rokujukkansi, nenchu);
if (seigatuInt == 2) {
nenchuNo[1] = (nenchuNo[0] - 1) % 60;
} else {
nenchuNo[1] = nenchuNo[0];
}
nenchuNo[2] = nenchuNo[0];

gechuNo[0] = nanmojime(rokujukkansi, gechu);
gechuNo[1] = (gechuNo[0] - 1) % 60;
gechuNo[2] = gechuNo[0];

nichuNo[0] = nanmojime(rokujukkansi, nichu);
nichuNo[1] = nichuNo[0];
nichuNo[2] = nichuNo[0];

nenchuH =
rokujukkansi.substring(nenchuNo[zenGo] * 2, (nenchuNo[zenGo]) * 2 + 2);
gechuH =
rokujukkansi.substring(gechuNo[zenGo] * 2, (gechuNo[zenGo]) * 2 + 2);
nichuH =
rokujukkansi.substring(nichuNo[zenGo] * 2, (nichuNo[zenGo]) * 2 + 2);


//■■■■■■■■■以下は変更前と同じ■■■■■■■■■
//■■■■■■■■■表示に必要な内容を計算するエリヤ
//節入り日の時節入り時刻前ボタンを表示する
if (setuirinitisuu == 1) {
setuiriButtonWidth = 80;
iroSetuiri = iroPink;
} else {
setuiriButtonWidth = 0;
iroSetuiri = iroTeal;
}
//年柱・月柱・日柱から年干・年支・月干・月支・日干・日支を作成する
nenkan = nenchu.substring(0, 1);
nensi = nenchu.substring(1, 2);
gatukan = gechu.substring(0, 1);
・・・

//■■■■■■■■■画面を表示するエリヤ
return MediaQuery(
data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0),
child: Scaffold(
appBar: AppBar(
title: const Text(
'あなたの命式は',
・・・

), // Scaffold の最後
); // MediaQuery の最後
} // Widget build の最後


// ■■■■■■■■■下から現れてくるコメントの表示エリヤ
_showSetuiri(BuildContext context) {
showModalBottomSheet(

});
} // _showSetuiri の最後
} //StatelessWidget の最後

//■■■■■■■■■関数定義エリヤ
// 関数定義 地支から蔵干を算出する
// c = zouKan(a, b)
// a: 地支を表す文字列 ('子','丑','寅',・・・,'戌','亥')
// b: 節入り日からの日数を表す数字 (1~31)(節入り日は、1 とする)
// c: 蔵干を表す文字列 ('甲','乙','甲',・・・'壬','癸')
zouKan(String a, int b) {
//蔵干表
String zouKanHyou = //蔵干表
'戊戊戊戊戊戊戊丙丙丙丙丙丙丙甲甲甲甲甲甲甲甲甲甲甲甲甲甲甲甲甲' //寅
・・・
return c;
}



備忘録一覧