BEETLE2000 https://blog.hatena.ne.jp/BEETLE2000/ Flutter開発メモ https://beetle2000.hatenadiary.com/ ステッパー (Stepper) は、進捗状況を視覚的に表示するためのUIコンポーネントです。本記事では、Flutterを使用してシンプルかつ柔軟にカスタマイズ可能なステッパーを作成する方法を紹介します。 以下のコードを題材に、実際にどのようにシンプルなステッパーを構築したかを解説していきます。 完成イメージ このステッパーは以下のように動作します： 現在のステップ (currentStep) に応じて丸数字や線の色が変わる。 丸数字は現在の進捗を表し、丸と丸の間にある線も進捗状況を示す。 ステップの数 (totalSteps) と線の幅 (lineWidth) を柔軟にカスタマイズ可能。 コー… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fbeetle2000.hatenadiary.com%2Fentry%2F2025%2F01%2F13%2F123608" title="【Flutter】シンプルなステッパーの例 - Flutter開発メモ" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/B/BEETLE2000/20250113/20250113123405.gif Hatena Blog https://hatena.blog 2025-01-13 12:36:08 rich https://beetle2000.hatenadiary.com/entry/2025/01/13/123608 1.0 100%