Flutterの練習3
前回作ったアプリのボタンをアイコンに変えます。ついでに、iOS風のデザインと言われているCupertinoのアイコンも使ってみます。
できたのはこちらです。
CupertinoのインポートはMaterial.dartに続いて記述します。
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
ボタンのRowは以下の通りです。
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Column(
children: [
IconButton(
icon: const Icon(
Icons.add,
),
tooltip: 'Increase One',
onPressed: _incrementCounter,
),
const Text('Plus One'),
],
),
const SizedBox(width: 40),
Column(
children: [
CupertinoButton.filled(
onPressed: _decrementCounter,
child: const Text('minus'),
),
const Text('Minus One'),
],
),
const SizedBox(width: 40),
Column(
children: [
CupertinoButton(
onPressed: _resetCounter,
child: const Icon(CupertinoIcons.refresh),
),
const Text('Reset the Number'),
],
),
],
),
main.dartはこちらです。