１人 Flutter Advent Calendar 2019：#13 storyboard

UI作っているとUIの部品を実機で見せたくもなります。
デザイナーなどに共有するために、いちいち専用アプリを作るのもだるいですし、実機で見せてコミュニケーション取りたいケースはたくさんあると思います。

そんな時にStoryboadというのが便利そうです。
https://proandroiddev.com/storyboarding-widgets-in-flutter-96d79d9a72f0

ただ部品を並べるための枠が用意されるだけなのですが便利です。

デザイナーなどとコミュニケーションするにも良いですし、エンジニアにとっても良いshowcaseになるります。

class TextStory extends Story {
  @override
  List get storyContent {
    return [
      Text('this is story sample'),
    ];
  }
}

のようにStoryを拡張したclassを作成して

class StoryBoardApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Storyboard([
      TextStory(),
    ]);
  }
}

といあった感じでWidget作れば良いので、組み込みも楽ちんです。

サンプルは以下です。
https://github.com/matsuhiro/story_board_test