【Flutter/Dart開発】カレンダーで利用開始・終了日を導入→固定費を表現した話【スマホアプリ】

 

こんにちは、たちつてとです。

自作の出費記録アプリを(一人で)使ってて、

アマプラなど、月ごとに固定額が出ていくのを

わざわざ毎月やるのもアホらし。と思い、

アプリ側で固定費の入力画面を作成しました。

 

カレンダー機能の導入について

なお、カレンダの導入については

がっつり

【Dart/Flutter開発】画面遷移とカレンダー機能を実装、実際の(自作)アプリと考え方を共に...

こちらの記事で書きました。今回の記事では述べません。

カレンダ導入でいらっしゃった方はこちらへどうぞ。

 

機能一覧

以下の様な画面です。

f:id:tachitutetoNosuke:20211105193833p:plain

  • 固定費の一覧があって、それぞれのTextを編集できる。
  • Text以外のところをタップすると、

    アニメーションで適用日を編集する行に変わる

  • 適用日は外部パッケージで、便利に?選択できる

 

固定費を登録してどうなるか

こうなります。今回やりたいことです。

f:id:tachitutetoNosuke:20211105200308p:plain

一番右の画像のように、月毎の出費合計を

出すところがあるのですが、

そこに自動的に固定費の金額を足します。

 

画像の様に、固定費で500円

固定費でない通常の入力で1000円

合わせて1500円という表示になります。

 

画像では緑の枠の項目に

2022/03/09, 2999/12/31とあります。

一方、一番右は2021年11月の表示ですが、

2022/03/09〜 2999/12/31の範囲にはありませんから

合計には入っていないという具合です。

これを利用開始・終了日と勝手に読んでいます。

 

実際のソース

クラス

@HiveType(typeId: 2)
class RegularCost{
RegularCost({
this.id = -1,
this.categoryCd = -1
, this.name = ''
, this.money = 0
, this.memo=''
, this.dateFrom = "2021-01-01"//利用開始日デフォルト
, this.dateTo = "2999-12-31"//利用終了日デフォルト
});

@HiveField(0)
final int id;
@HiveField(1)
final int categoryCd;
@HiveField(2)
String name;
@HiveField(3)
int money;
@HiveField(4)
String memo;
@HiveField(5)
String dateFrom;//利用開始日
@HiveField(6)
String dateTo;//利用終了日
}

Hiveむにゃむにゃ、は気にしないでください。

スマホのストレージにデータを保存するのに

Hiveというパッケージを見つけたって感じです。

【Dart/Flutter開発】ローカルのストレージでデータ記録/管理できるHiveについてまとめた話【個人開発】

一応こちらでまとめています。

 

ともかく、クラスに利用日のフィールドを設定。

陽に設定されない時は、「ずっと」という意味で

2021/01/01〜2999/12/31とした。

ただし、問題は後者の2999年なんです...

 

_showDatePickerの注意点

多分、↑の方であげた過去記事も似たようなソースを

書いていると思うんですが

final DateTime? selected = await showDatePicker(
context: context,
initialDate: 初期値,
firstDate: DateTime(2021),
lastDate: DateTime(2999,12,31),//ここです
);

lastDateも利用終了日のデフォに合わせないと、

エラーが吐かれます。

つまり、firstDate〜lastDateの範囲外で

入力/表示したいDateを無理やり表示させることはできない

です。

例)

○良い例

  • initailDate 2021/05/01
  • firstDate 2020/07/05
  • lastDate 2026/07/05

×悪い例

  • initailDate 2021/05/01
  • firstDate 2021/07/05
  • lastDate 2022/07/05

 

まあそれはそれで結構なんですが...

f:id:tachitutetoNosuke:20211105204224p:plain

いや2999年は編集したいわって時、

年を変えようとすると、この画像みたいになります。

いつなったら2020年代に来るんや...

 

という注意でした。

まあ、デフォの値を2022/01/01とかにすれば

OKな話です。

 

固定費の抽出

Hive.openBox<RegularCost>(_cost).then((value) {
Box<RegularCost> mesBox = value;

for (RegularCost cost in mesBox.values) {// 固定費ループ
if(DateTime(int.parse(_year), int.parse(_month),1).isAfter(DateTime.parse(cost.dateFrom))
&& DateTime(int.parse(_year), int.parse(_month),1).isBefore(DateTime.parse(cost.dateTo))
)// 利用日判定
_sum += cost.money;
}
});

HIve使っているのでわかりにくいですが、

要は登録されている固定費項目について

ループかけて

DateTime型の比較をしています。

 

isAfter/isBefore

 

というのが比較演算子?になります。

C#とか「=>」で比較できたのに

エラー吐かれてビックリでした。

 

isAfter/isBeforeという比較メソッドで

表示中の年月

(=_year,_month:ドロップダウンの選択値)

が利用開始日/終了日の間にあるか

を見ています。

 

って感じで以上です。

お疲れ様でした。

 

[商品価格に関しましては、リンクが作成された時点と現時点で情報が変更されている場合がございます。]

Android/iOSクロス開発フレームワークFlutter入門 [ 掌田津耶乃 ]
価格:3300円(税込、送料無料) (2021/10/25時点)

楽天で購入
[商品価格に関しましては、リンクが作成された時点と現時点で情報が変更されている場合がございます。]

Flutter モバイルアプリ開発バイブル [ 南里勇気 ]
価格:3509円(税込、送料無料) (2021/9/20時点)

[商品価格に関しましては、リンクが作成された時点と現時点で情報が変更されている場合がございます。]

Javaのオブジェクト指向がゼッタイにわかる本[第2版] [ 立山秀利 ]
価格:2530円(税込、送料無料) (2021/9/26時点)

エンジニア発オンラインスクール【RUNTEQ】