Tourismプロジェクトのブログ

活動の様子やメンバーの興味があることを書いていきます!

Flutterでアプリを作ってみた part1

こんにちは、あるいはこんばんは。ともきです。

今回からは、Tourismプロジェクトの新人研修で制作したアプリについて話していきます。

どんなアプリか

端的に言うと、漫画アプリです。 漫画を読んでいると、 あのシーンをもう一度見たい‼と思うことが多々あるでしょう。

そんなとき、ストーリーごとに分けられていれば、読み返す際に「○○巻からだったっけ…」と思い返さなくてよくなるよね⁉ といった経緯でこのアプリを制作しました。

ホーム画面を作った

まずは、アプリを起ち上げたときの画面を作りました。

この画面に使用したのは、Cardというウィジェットです。 今回は、Cardの中に画像、文字、アイコンをいれて、タップすることにより画面遷移するようにしました。

このほかにも背景の色、配置場所、影の色、形などを指定することができます。     デザインの幅は広いですね!

さらに、SingleChildScrollViewとすることによって、画面のスクロールを可能にし、漫画を追加しても表示されるようにしました。

以下が、ホーム画面のコードです。(ワンピースのみ)

おわりに

今回は、ホーム画面 言わば、アプリの土台を作成しました。 試行錯誤しながらだったので時間をかけて何とかできた程度です。 これからデザインの改善も行っていきたいと思います。

次回は画面遷移のことについて紹介していきます。 お楽しみに~~~

~メンバー募集中!~

Tourism Projectはメンバーを募集中です!気になる方はお気軽にTwitterなどでお声がけください!!

詳しくはTourismプロジェクトホームページ、Twitterをご覧ください。

tourism-project.com

twitter.com

アプリ「撮っテク!」の詳細はこちらから

totteku.tourism-project.com