Flutterを理解する！初心者でも分かる特徴、コンポーネント、基礎知識などを簡単に解説！

最終更新：2021/09/03 投稿：2021/03/07

FlutterはGoogle社によって開発されたオープンソースのモバイルアプリケーションフレームワークです。クロスプラットフォームアプリ開発を得意としており、表現力豊かで柔軟なUIを実現できます。この記事ではFlutterを理解するために初心者でも分かる特徴、コンポーネント、基礎知識などを簡単に解説していきます。

Flutter

クロスプラットフォームとは

Flutterの読み方と旧名

Flutterの特徴

迅速な開発

表現力豊かで柔軟なUI

プログラミング言語『Dart』を採用

Flutterのコンポーネント（構成）

Flutter Engine（エンジン）

Library（ライブラリ）

Widget（ウィジェット）

代表的なクロスプラットフォーム

Xamarinとは

VisualStudioとは

Monaca

まとめ

Flutter

FlutterとはGoogle社によって開発されたオープンソースのモバイルアプリケーションフレームワークです。主にAndoroidやiOS向けのモバイルアプリケーションの開発に利用されます。Flutterは「クロスプラットフォームにおいて100%のコードを共通化しない」という選択をしており、各プラットフォームのOSの機能に大きく依存するコードについては、ネイティブの言語で実装する仕様になっております。Flutterの特徴は『迅速な開発』『表現力豊かで柔軟なUI』『ネイティブパフィーマンス』を掲げております。

『Flutter　基本情報』
開発者：Google
種別：クロスプラットフォームアプリ開発
特徴：『迅速な開発』『表現力豊かで柔軟なUI 』『ネイティブパフォーマンス』

Flutterの公式サイトはこちら＞＞

クロスプラットフォームとは

クロスプラットフォームとはWindows、Macのように異なるOSやWebアプリ、デスクトップアプリ、スマートフォンアプリなど様々なデバイスの異なるプラットフォームにおいて同じ仕様のアプリケーションを動かすことに対応したプログラムのことです。同様の意味を持つ言葉として『マルチプラットフォーム』と呼ばれる場合があります。特にios、Androidといったスマートフォンアプリケーション市場においては近年リリースされるアプリのほとんどがクロスプラットフォームアプリとなっております。
クロスプラットフォームアプリ開発を行うことでこれまでOS単位やデバイス単位でそれぞれプログラムを実装しなければ無かった工数を一元管理出来ることから効率的に開発に取り組むことができ重宝されております。クロスプラットフォームを実現できる代表的な開発環境として『Unity』『Visual Studio』『Xamarin』などが挙げらます。

クロスプラットフォームのメリット・種類、基礎知識について解説された記事はこちら＞＞

Flutterの読み方と旧名

Flutterの読み方は『フラッター』です。誕生初期の旧名は『Sky』と呼ばれておりました。

Flutterの特徴

Flutterの特徴を見ていきましょう。

迅速な開発

Flutterは迅速な開発という特徴があります。「Stateful Hot Reload」を使用しており、アプリをミリ秒単位で実現します。完全にカスタマイズ可能なウィジェットの豊富なセットを使用して、ネイティブインターフェイスを数分で構築することができます。

表現力豊かで柔軟なUI

Flutterは表現力豊かで柔軟なUIという特徴があります。Flutterではマテリアルデザインを採用しております。マテリアルデザインはリアルな動きや奥行きに沿ったデザインのフレームワークです。これによってユーザーは視覚的にアプリを分かりやすく操作することができます。このようにネイティブエンドユーザーエクスペリエンスに重点を置いた機能を迅速に扱えます。非常に高速なレンダリングと表現力豊かで柔軟なデザインが実現できます。

プログラミング言語『Dart』を採用

Flutterはプログラミング言語『Dart』を採用しているという特徴があります。DartとはGoogle社によって2011年に開発されたWebアプリケーション向けのプログラミング言語です。開発された目的はJavaScriptにおける課題を解決するためでした。2018年にはDart2をリリースしており、強力な型システムなどの言語機能の強化が行われております。

dartの歴史、特徴、基礎知識について解説された記事はこちら＞＞

Flutterのコンポーネント（構成）

Flutterの主なコンポーネント（構成）は以下の通りです。

Flutter Engine（エンジン）

Flutter Engineは主にC++で記述されております。スマートフォンなどの組み込み機器向けからデスクトップ環境まで幅広く対応するように設計されております。主な役割として『アプリケーションを実行するmain関数になる部分』『2Dグラフィックスのレンダリング処理』『各種プラットフォームとの中継』などが挙げられます。

Library（ライブラリ）

FlutterのLibraryはDartで記述されております。UIコンポーネントが豊富なので、柔軟なデザインに対応できます。

Widget（ウィジェット）

FlutterのWidget一覧を見ていきましょう。

Basics	最初のFlutterアプリを作成する前に必ず知っておく必要があるウィジェット。
Material Components	簡単にマテリアルデザインのUIを取り入れたWebアプリケーションを作成することができる。
Align	左上や右下など子Widgetの配置を揃えることができる。
Padding	EdgeInsetsでPaddingのサイズを設定ができる。
Container	高さや幅、色、Padding、Marginなどが組み合わさっている。
Column	縦方向に並べる。
Expanded	領域の最大限のサイズまで広げる。

代表的なクロスプラットフォーム

Flutter以外の代表的なクロスプラットフォームについて見ていきましょう。

Xamarinとは

Xamarin（ザマリン）とは「Mono」や「MonoTouch」などのマルチプラットフォームを開発した企業である『Xamarin社』が提供するクロスプラットフォームアプリ開発環境です。Xamarinは2016年にマイクロソフト社に買収をされております。これを機に2016年4月よりVisual StudioにXamarinが付属する形になりました。クロスプラットフォームアプリ開発環境とはWebアプリ、デスクトップアプリ、スマートフォンアプリなど様々なプラットフォームに対応した開発環境のことでXamarinを使用することによりiOSアプリもAndroidアプリもC#で開発することが可能となりました。他にもXamarinの特徴として『ネイティブアプリの開発が得意』、『コードの共通化』などが挙げられます。

Xamarinの特徴、基礎知識について解説された記事はこちら＞＞

VisualStudioとは

Visual Studioとはマイクロソフト社が開発・提供するC#やVisual Basic（VB）向けの統合開発環境（IDE）です。統合開発環境とはソフトウェアの開発において必要な機能を豊富に取り揃えたプログラム環境用パッケージのことです。Visual Studioには開発をする上で必要な全て「コードエディタ」「コンパイラ」「デバッガ」などの様々なツールが集約されております。1997年に初版がリリースされて以降、数々のアップデートを繰り返し2020年時点で『Visual Studio 2019』が最新バージョンとなっております。Visual Studioでは様々な種類が提供されており『Visual Studio Community』『Visual Studio Code』『Visual Studio Online』などが挙げられます。主な対応プログラミング言語としてC#、Visual Basic（VB）、C++が挙げられます。

VisualStudioの特徴、基礎知識について解説された記事はこちら＞＞

Monaca

Monaca（モナカ）とは日本ソフトウェア企業『アシアル株式会社』が提供するApache Cordova(旧:PhonGap)ベースのHTML5アプリの開発プラットフォームのことです。Monacaはクラウド上で作成が出来るため、インターネットに接続したモバイルデバイスやPCがあれば作成することが出来ます。iOSでもAndroidでも同じように動作するので、iOSとAndroid用に作り直す必要がないのが特徴です。他にも『特別な知識不要』『100%ネイティブアプリ』といった点が挙げられます。

Monacaの特徴、基礎知識について解説された記事はこちら＞＞

まとめ

Flatterを理解するために初心者でも分かる特徴、コンポーネント、基礎知識などを簡単に解説させていただきました。Flatterを一言で表すと『Google社によって開発されたオープンソースのモバイルアプリケーションフレームワーク』です。特徴として「迅速な開発」「表現力豊かで柔軟なUI」「ネイティブパフォーマンス」などが挙げられます。Flatterについてこの記事に記載されている特徴、基礎知識など最低限の内容は理解しておくようにしましょう。