Flutterでアプリを作ってみようとしたところ様々なアプリでよく目にする、

キャプチャ

のアイコンの出し方が分からず小一時間ほど悩んだので、同じことで悩む人がへるように出し方を書いておきます。

記事を書いたあとに気づいたのですが、Drawerを設定したらデフォルトでハンバーガーボタンが設定されるようで私の調査は無駄に終わりました。



Drawer以外でハンバーガーボタンを使いたいという人は参考にしてください。(そんな人いないだろ)




『三』(ハンバーガーボタン)の出し方


結論からですが『三』のアイコンは以下のコードで出すことができます。

Icons.dehaze_sharp

キャプチャ


ちなみに私はこれを見つけるためにFlutterの公式のアイコン画像のページのアイコンとひたすらにらめっこしていました。




上記で紹介したもののほかに、線の細さが違う似たようなアイコン他に3つありました。

キャプチャ

芸術的センスにかけている私からしてみたらこれらをどう使い分けたらいいか分からないという。



サンプルコード


以下は、『三』をヘッダーに表示させるサンプルコードになります。

import 'package:flutter/material.dart';

void main() {
runApp(App());
}

class App extends StatelessWidget {
@override
// 表示する Widget の一覧

Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false, // <- Debug の 表示を OFF
home: Scaffold(
appBar:AppBar(
leading: Padding(
padding: const EdgeInsets.all(8.0), // マージンの設定
child: Icon(Icons.dehaze_rounded), // アイコンの種類
)
)
),
);
}
}


キャプチャ