Q&A
前提
制作しているアプリ内にToDoリスト機能があり、
自分が過去に登録したタスクを選択した年月毎の一覧で
見返せるようなデザインにしたいです。
画像のような、カレンダーによくある年月選択を
リストの上に実装したいのですが、可能でしょうか。
書籍やネット上の記事で調べましたが、
年月選択単体での実装方法は見つからず質問いたしました。
稚拙な質問で申し訳ございませんが、ご回答お待ちしています。
実現したいこと
・カレンダー上部の年月選択のみをリストの上に実装したい。
気になる質問をクリップする
クリップした質問は、後からいつでもマイページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
下記のような質問は推奨されていません。
- 質問になっていない投稿
- スパムや攻撃的な表現を用いた投稿
適切な質問に修正を依頼しましょう。
回答1件
0
ベストアンサー
https://pub.dev/packages/month_picker_dialog_2/example
見た目にそこまで拘らないなら上記などいくつもパッケージがあるので良いものを探して使うのが速いと思われます。もちろんそのパッケージに何かあったら代わりを探すか自分で何とかするかということになりますが。
自分で作りたいならList<DateTime>とカウンターの組み合わせでできるでしょうからまずはそれらを勉強されてはいかがでしょう。
よければ参考にされてください。
import 'package:flutter/material.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( debugShowCheckedModeBanner: false, home: HomePage(), ); } } class HomePage extends StatefulWidget { const HomePage({Key? key}) : super(key: key); @override State<HomePage> createState() => _HomePageState(); } class _HomePageState extends State<HomePage> { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(), body: Center( child: YearAndMonthSelectionUI( ), ), ); } } class YearAndMonthSelectionUI extends StatefulWidget { const YearAndMonthSelectionUI({Key? key}) : super(key: key); @override State<YearAndMonthSelectionUI> createState() => _YearAndMonthSelectionUIState(); } class _YearAndMonthSelectionUIState extends State<YearAndMonthSelectionUI> { int index = 0; String get formattedDateTime { return '${months[index].year}年 ${months[index].month}月'; } @override Widget build(BuildContext context) { return Row( mainAxisAlignment: MainAxisAlignment.center, children: [ IconButton( icon: Icon(Icons.keyboard_double_arrow_left), onPressed: () { setState(() { if (index > 11) { index=index-12; } }); }, ), ////////////////////////////////////// IconButton( icon: Icon(Icons.arrow_back_ios), onPressed: () { setState(() { if (index > 0) { index--; } }); }, ), ////////////////////////////////////// Text(formattedDateTime), ////////////////////////////////////// IconButton( icon: Icon(Icons.arrow_forward_ios), onPressed: () { setState(() { if (index < months.length - 1) { index++; } }); }, ), ////////////////////////////////////// IconButton( icon: Icon(Icons.keyboard_double_arrow_right), onPressed: () { setState(() { if (index < months.length-12) { index=index+12; } }); }, ), ], ); } } final List<DateTime> months = [ for(int y=2020;y<2025;y++) for(int m=1;m<13;m++) DateTime(y,m), ];
投稿2023/01/14 01:19
総合スコア615
関連した質問
Q&A
解決済
pythonで文字列をリストに変換したい
回答1
クリップ0
更新
2023/03/29
Q&A
解決済
rubyの問題解説をお願いしたいです。
回答3
クリップ0
更新
2023/03/25
Q&A
解決済
pythonでイコールの条件判定式でご教示下さい
回答2
クリップ0
更新
2023/03/23
Q&A
解決済
ある数値以下の間隔の場合にリストを結合したい
回答2
クリップ0
更新
2023/03/21
Q&A
解決済
gas 埋め込みスクリプトをscriptタグに移動させたい
回答1
クリップ1
更新
2023/03/26
Q&A
解決済
listの抜き出し方法が分からない
回答1
クリップ0
更新
2023/03/30
Q&A
解決済
スーパークラスのコンストラクタを呼び出したい
回答1
クリップ0
更新
2023/03/26
下記のような回答は推奨されていません。
このような回答には修正を依頼しましょう。
2023/01/15 04:28