「Flutter コードサンプル」の版間の差分
ナビゲーションに移動
検索に移動
(→ウィジェット) |
|||
| 5行目: | 5行目: | ||
{{amazon|4798055832}} | {{amazon|4798055832}} | ||
| − | === | + | ===シンプルな画面=== |
====ウィジェット==== | ====ウィジェット==== | ||
*Flutterでは画面表示はウィジェットという部品によって作成される。 | *Flutterでは画面表示はウィジェットという部品によって作成される。 | ||
| 16行目: | 16行目: | ||
*StatefullWidgetはステート(状態)を持つ | *StatefullWidgetはステート(状態)を持つ | ||
*ウィジェットはいずれかを継承して作成する | *ウィジェットはいずれかを継承して作成する | ||
| − | + | *MaterialAppというマテリアルデザインを管理するウィジェットクラスを、buildで返すことでマテリアルデザインアプリになる | |
import 'package:flutter/material.dart'; | import 'package:flutter/material.dart'; | ||
| 34行目: | 34行目: | ||
} | } | ||
[[File:Flutter_simple.png]] | [[File:Flutter_simple.png]] | ||
| + | ====MaterialAppクラス==== | ||
2020年3月15日 (日) 06:58時点における版
目次
Flutter コードサンプル
シンプルな画面
ウィジェット
- Flutterでは画面表示はウィジェットという部品によって作成される。
- ウィジェットを入れ子にすることで構築し、ウィジェットツリーと呼ぶ。
StatelessWidgetとStatefulWidget
- runAppの引数に指定されているのは、MyAppクラスのインスタンス
- MyAppは、StatelessWidgetのサブクラス
- StatelessWidgetはステート(状態)を持たない
- StatefullWidgetはステート(状態)を持つ
- ウィジェットはいずれかを継承して作成する
- MaterialAppというマテリアルデザインを管理するウィジェットクラスを、buildで返すことでマテリアルデザインアプリになる
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Flutter Sample',
home: Text(
'Hello, Flutter!!',
style: TextStyle(fontSize: 32.0),
),
);
}
}
MaterialAppクラス
© 2006 矢木浩人
