| ページ一覧 | ブログ | twitter |  書式 | 書式(表) |

MyMemoWiki

「Flutter コードサンプル」の版間の差分

提供: MyMemoWiki
ナビゲーションに移動 検索に移動
7行目: 7行目:
 
===テキストのみ配置する===
 
===テキストのみ配置する===
 
====ウィジェット====
 
====ウィジェット====
**Flutterでは画面表示はウィジェットという部品によって作成される。
+
*Flutterでは画面表示はウィジェットという部品によって作成される。
**ウィジェットを入れ子にすることで構築し、ウィジェットツリーと呼ぶ。
+
*ウィジェットを入れ子にすることで構築し、ウィジェットツリーと呼ぶ。
 +
 
 
====StatelessWidgetとStatefulWidget====
 
====StatelessWidgetとStatefulWidget====
 
*runAppの引数に指定されているのは、MyAppクラスのインスタンス
 
*runAppの引数に指定されているのは、MyAppクラスのインスタンス

2020年3月15日 (日) 06:56時点における版

Flutter コードサンプル

Flutter|Dart|

テキストのみ配置する

ウィジェット

  • Flutterでは画面表示はウィジェットという部品によって作成される。
  • ウィジェットを入れ子にすることで構築し、ウィジェットツリーと呼ぶ。

StatelessWidgetとStatefulWidget

  • runAppの引数に指定されているのは、MyAppクラスのインスタンス
  • MyAppは、StatelessWidgetのサブクラス
  • StatelessWidgetはステート(状態)を持たない
  • StatefullWidgetはステート(状態)を持つ
  • ウィジェットはいずれかを継承して作成する
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),
      ),
    );
  }
}

Flutter simple.png