前提
制作しているアプリ内にToDoリスト機能があり、
自分が過去に登録したタスクを選択した年月毎の一覧で
見返せるようなデザインにしたいです。
画像のような、カレンダーによくある年月選択を
リストの上に実装したいのですが、可能でしょうか。
書籍やネット上の記事で調べましたが、
年月選択単体での実装方法は見つからず質問いたしました。
稚拙な質問で申し訳ございませんが、ご回答お待ちしています。
実現したいこと
・カレンダー上部の年月選択のみをリストの上に実装したい。
気になる質問をクリップする
クリップした質問は、後からいつでもMYページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。

回答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
あなたの回答
tips
太字
斜体
打ち消し線
見出し
引用テキストの挿入
コードの挿入
リンクの挿入
リストの挿入
番号リストの挿入
表の挿入
水平線の挿入
プレビュー
質問の解決につながる回答をしましょう。 サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。 また、読む側のことを考えた、分かりやすい文章を心がけましょう。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2023/01/15 04:28