【今すぐはじめるFlutter入門 #1】Flutterの特徴
Flutterとは
Flutterは、Googleによって開発されたマルチプラットフォームアプリケーション開発のためのツールキットです。 Android、iOS、Web、Windows、macOS、Linuxで動作するアプリケーションを、1つのコードベースから構築することができます。
2017年の発表以来、開発者からの注目を集め、活発なコミュニティが形成されています。近頃では、日系企業で採用されるケースも増えてきました。 Stack Overflow 2023 Developer Surveyによれば、Flutterはマルチプラットフォーム技術の中で最も関心・期待が高い技術となっています。
Flutterの主な特徴
ホットリロード
ホットリロードとは、ソースコードを更新したとき、アプリを再ビルドすることなく変更をリアルタイムに反映できる機能です。 ホットリロード機能を活用することで、ストレスなく、より迅速にUI構築やデバッグを行うことができます。
2023年12月現在、Flutter Webでは、ホットリロードがサポートされていません。
Material Designコンポーネント
Flutterでは、公式が提供するさまざまなコンポーネントを利用することができます。 特に、GoogleのデザインシステムであるMaterial Designを実装したコンポーネントは、基本的なUI構築を簡単にします。
Flutter のコード例
実際に、Flutterの具体的なコードを見てみましょう。 Flutterは、開発に用いるプログラミング言語としてDartを採用しています。
また、Flutterは、宣言的UIの考え方に基づいています。 昨今、主流となっているWebフロントエンド開発におけるReact等のUIライブラリと同様に、UIをいくつかのコンポーネント(ウィジェット)に分割し、それらを組み合わせてUIを構築します。
以下はのコードは、画面中央に「Hello, world!」と表示するアプリケーションの例です。
import 'package:flutter/material.dart';
void main() {
runApp(
const Center(
child: Text(
'Hello, world!',
),
),
);
}
main()
関数は、アプリケーションのエントリーポイントです。
runApp()
関数は、引数にウィジェットを取り、ウィジェットツリーのルートに配置します。
ウィジェットツリーとは、UIを構成するためのウィジェットの階層構造のことです。
ここで、 Center
ウィジェットは、レイアウトのためのウィジェットで、子ウィジェットを中央に配置します。
また、 Text
ウィジェットは、文字列を表示するためのウィジェットです。
このコード例では、 Center
ウィジェットの子ウィジェットが Text
ウィジェットであるため、 Text
ウィジェットは画面中央に表示されます。
まとめ
Flutterは、Googleが提供するアプリケーション開発のためのSDKで、多数のプラットフォームへの対応・ホットリロード機能など優れた開発者体験を提供します。 コンポーネント指向であり、ウィジェットを組み合わせて部品・レイアウトを構築します。
次回は、Flutterのセットアップについて具体的に取り上げます。