YMLib - Flutter - コンソールにメッセージを表示

コンソールにメッセージを表示

2024/11/30

コンソールにメッセージを表示してみます。

◆環境

OS	Windows 10 Home 22H2 64bit OS x64 プロセッサ
Flutter	3.24.2
Dart	3.5.4
Android Studio	Iguana 2023.2.1 Patch 1

[New]-[New Flutter Project...]を選択します。

[Next]をクリックします。

[Project name]に ymflu003 と入力し[Create]をクリックします。

~/lib/main.dartのコメント行を全て削除します。

main.dart

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:

67:
68:
69:

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headlineMedium,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ), // This trailing comma makes auto-formatting nicer for build m

ethods.
);
}
}

Android StudioのDevice Managerをクリックします。

[Pixel_3a_API_34_extension_level_7_x86_64]の右にある三角の再生ボタンをクリックします。

Android Studioの画面上部にある三角の再生ボタンを押します。

Consoleにメッセージが出ています。

画面上の＋をクリックします。

画面上の数字が１増えました。

Consoleにメッセージが表示されました。

＋ボタンを押したときにConsoleにメッセージを表示するようにしてみます。

main.dart

1:
2:
3:
4:
5:
6:
7:

  void _incrementCounter() {
    print("_incrementCounter() START");
    setState(() {
      _counter++;
    });
    print("_incrementCounter() END");
  }

＋ボタンを押したら追加したメッセージが表示されました。

printの下に黄色い線が表示されていたので内容を確認します。

production codeではprintを呼び出さないでくださいとのことです。

debugPrintに変更したところ黄色い線が消えました。

main.dart

1:
2:
3:
4:
5:
6:
7:

  void _incrementCounter() {
    debugPrint('_incrementCounter() START');
    setState(() {
      _counter++;
    });
    debugPrint('_incrementCounter() END');
  }

printと同様にConsoleにメッセージが表示されました。

▲ PageTop ■ Home