「Flutterで始めるモバイルアプリ開発」連載一覧
-
2021/09/28Flutterでのレイアウトの組み合わせ方を学ぼう～実際の画面例を使用
前回は、基本的な各レイアウトウィジェットについて説明しました。画面レイアウトはさまざまな組み合わせ方法があり、その組み合わせ方法によって気を付けるポイントなどが変わってしまいます。そこで、今回は実際の画面サンプルを例にどのようにレイアウトを使っていくかを紹介します。基本的なレイアウトは前回紹介したレイアウトを使いつつも、前回紹介出来なかったレイアウトもいくつか含まれています。それらはソースコードとして説明していきますが、足りない部分はリファレンスなどを参照してください。
-
2021/09/07Flutterの基本的なレイアウトの考え方・仕組みを学ぼう
UIアプリケーションの開発で最もなやむのが、伝えたい情報や使ってほしい機能をどのように利用者に伝えるかということです。その中で、レイアウトは非常に重要な要素のひとつです。同じ情報であっても見せ方によって伝わりやすさ、効果が異なるからです。また、レイアウトの構成は、プログラムの構造にも影響を与えます。例えば、レイアウトを分ける場合には同時にソースコードも分けるということがあります。同じレイアウトを実現するにも、さまざまな方法があるのです。本記事では、そのようなレイアウトのしくみについて紹介します...
-
2021/08/05Flutter2の新しい画面遷移「Navigator 2.0」を使ったページ遷移を理解しよう
今回は、前回に引き続き画面遷移について説明します。Flutter2では、新しい画面遷移の仕組み（Navigator 2.0）が導入されました。この新しい画面遷移の方法は、少々複雑でわかりにくいところがあります。また、アプリ開発だけの場合であれば、必ずしもこの仕組みを導入する必要もないと思っています。しかし、Flutter2で正式サポートされたWebアプリなどを今後想定する場合や、新しい流れの参考としてご紹介します。まだまだ利用ノウハウなども多くないため、今後の参考として捉えていただければと思い...
-
2021/06/10基本的なページ遷移を理解しよう～Flutterでの画面遷移
今回と次回ではFlutterでの画面遷移について説明します。Flutter Ver1.x（以下、Flutter1と記す）ではモバイル端末などでの使用を前提として、比較的シンプルな画面遷移の仕組みを提供していました。Flutter2では、Webアプリなども対象になったことから、より汎用的な画面遷移の仕組みが導入されています。ただし、仕組みが完全に入れ替わったわけではなく、既存の画面遷移の仕組みを拡張する形で追加されています。そのため、今回はFlutter1からの画面遷移を説明し、次回、Flutt...
-
2021/05/11Flutterアプリの画面構成を理解しよう
Dart言語についてこれまで紹介してきましたが、今回からはFlutterアプリ開発についての紹介を再開します。また、第3回でFlutterアプリ構造の概要を説明しました。今回はその続きとなる内容で、Flutterアプリでの画面を作るためのUIを中心に説明します。
-
2021/04/19Dart言語の便利な拡張表現とパッケージ管理
これまでDart言語仕様について説明してきましたが、今回はそこで紹介できなかった「カスケード表記」や「コレクション作成の拡張表現」などのシュガーシンタックスや、パッケージの作成方法と利用方法やプロジェクトファイルについて紹介します。これまで紹介した内容に比べて小粒ではありますが、「カスケード表記」や「コレクション作成の拡張表現」などはコーディングする上で、便利な表記方法なのでぜひ覚えておくとよいです。
-
2021/03/03Dart言語でのプログラム設計でワンランク上を目指そう
前回と前々回でDart言語の基本を紹介しましたが、比較的他の言語と共通する言語使用部分が大きく占めていました。今回は、「Factoryコンストラクタ」「ミックスイン」「非同期処理」について紹介します。これらの機能を理解することは少々、難しい部分がありますが、Dartの特徴がより色濃く表れている部分でもあります。
-
2021/02/16Flutter開発で使うDart言語での関数・クラスの使い方を理解しよう
前回は、Dart言語の変数や型などの非常に基本的な部分を扱いました。今回も前回に引き続き、Dart言語仕様の部分について説明します。今回は、関数やクラスなどの使い方を紹介します。関数やクラスではDart言語の特徴がより強くなるので、他の言語を知っている方もその違いを知っておくと良いでしょう。
-
2021/02/04Flutter開発で必要なDart言語の基本を理解しよう
今回は、Flutterから少々離れてDartの文法について紹介します。筆者はDartを知った時、「JavaScriptとJavaのちょうど中間のような言語」という印象をもちました。また、JavaScriptの代わりによく使われはじめているTypeScriptにも似ていると言えます。一方で、他の言語と多少似ているがゆえに、少々迷ってしまうことや勘違いしてしまうこともあります。そこで、今回からはFlutterプログラミングを行う上で必要となる、Dart言語の基本部分を紹介します。
-
2020/12/17FlutterのUIウィジェットを理解するための基本を知ろう！
前回はFlutterのインストールから雛形アプリケーションの作成と実行までを紹介しましたが、今回はその雛形アプリケーションのコードを利用してFlutterアプリケーションのプログラム内容について説明します。ただし、各部品やDartの文法は扱わないので、Flutterアプリケーションがどのような構造で作っているのかというおおよその概要が理解できるように紹介していきます。
-
2020/11/13実際にFlutterを触ってみよう～初めてのアプリ開発
前回、Flutterを中心にモバイルフレームワークについて説明をしましたが、今回は、実際にFlutterを触ってみて、どのような流れでモバイルアプリを開発していくかを説明します。
-
2020/09/02Flutterとは何か？ 使うメリットや特徴を理解する
2018年12月、Googleは「Flutter」というモバイルアプリ用のフレームワークをリリースしました。さまざまなモバイルフレームワークがある中で、改めてGoogleがリリースしたFlutterとはどのようなもので、どういった利点や特徴があるのでしょうか。まだ知らないという方や聞いたことはあるがよく分からないという方も多いと思います。今回は、筆者の経験や感想などを踏まえて、Flutterについて紹介していきます。
