【Flutter】アイコン(icon)リストの効率的な調べ方

Flutterのアイコン（icon）を一覧で知りたい

そこで、今回はFlutterのアイコンの効率的な調べ方を紹介します。

不明点などありましたら、お気軽にお問い合わせ下さい。

フリーランスのFlutterエンジニアとして働きたい方にオススメのエージェントはこちらで詳しく解説しています。

あわせて読みたい

Flutterフリーランスエージェントおすすめサイト5選！徹底比較！ Flutterの仕事をフリーランスでしたい！ どこのサイトがFlutter求人が多いのか知りたい！ そこで、今回はFlutterエンジニアの求人案件探しにオススメのサービス5選をご...

【Flutter】アイコンリストの効率的な探し方

Flutterのアイコンは以下のサイトで探すことができます。

Material Design（マテリアルデザイン）アイコン全てのリストはこちらで確認できます。

また、Flutterには「font_awesome_flutter」と呼ばれる、Font Awesomeアイコンを使用するためのライブラリもあります。これを使用することで、さらに多くのアイコンを使用することができます。Font Awesomeで使用可能なアイコンのリストはこちらで確認できます

【Flutter】Icons class/Icon classとは？

Icons class/Icon classは、アイコンを表示させるウィジェットです。

Icons classとは

Identifiers for the supported Material Icons.Use with the Icon class to show specific icons.

（直訳）サポートされているマテリアル アイコンの識別子。 Icon クラスと共に使用して、特定のアイコンを表示します。

引用：Flutter公式サイト「icons class」

Icon classとは

A graphical icon widget drawn with a glyph from a font described in an IconData such as material’s predefined IconDatas in Icons.

（直訳）icons 内のマテリアルの事前定義された IconData など、IconData で記述されたフォントからのグリフで描画されたグラフィカル アイコン ウィジェット。

引用：Flutter公式サイト「icon class」

【Flutter】アイコンのサンプルコードと使い方を解説（コピペOK）

Icons classサンプルコードは以下の通りです。コピペでそのまま使えます。

import 'package:flutter/material.dart';
import 'dart:math';

void main() => runApp(IconDemo());

class IconDemo extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('アイコンデモ'),
        ),
        body: Center(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: const <Widget>[
              Icon(
                Icons.sunny,
                color: Colors.orange,
                size: 150.0,
              ),
              Icon(
                Icons.cloud,
                color: Colors.grey,
                size: 150.0,
              ),
              Icon(
                Icons.umbrella,
                color: Colors.blue,
                size: 150.0,
              ),
            ],
          ),
        )
      ),
    );
  }
}

Iconでよく使うプロパティ

まとめ：Flutterのアイコンを効率的に探して生産性をアップさせよう！

今回はFlutterのアイコンの効率的な調べ方を紹介しました。

Flutterのアイコンを効率的に探してアプリ開発の生産性をアップしていきましょう！

Flutterエンジニアになるには？

初心者が中級者レベルのFlutterエンジニアなるまでの進め方をまとめました。

Flutterの学習方法を知る

あわせて読みたい

Flutter学習ロードマップ！０から初心者向けに完全解説！【2024年最新】 Flutterエンジニアになりたい Flutterエンジニアになるための学習ロードマップを知りたい これから、Flutterエンジニアを目指すならどうやったらなれるのか進め方は知っ...

Flutter をスクールで学ぶ

あわせて読みたい

Flutterプログラミングスクールおすすめ4社！36社の調査結果【完全公開】 Flutterでスマホアプリ開発をしたい！けど、挫折気味・・・ Flutterが学べるプログラミングスクールを知りたい！どこが良いのかな？ プログラミング初心者は疑問やエラ...

Flutterの副業を探す

あわせて読みたい

Flutterの副業案件おすすめのサイト3選！【週2・リモートあり】 Flutterで副業を始めたい！どこのサイトがおすすめか知りたい！ 週2,3日でスキルアップが望めるようなFlutterの案件をやりたい！どこのエージェントが良いかな？ 初めて...

おまけ：Flutter入門の完全ガイド

あわせて読みたい

【Flutter入門ガイド2024】知識ゼロから使い方・全体像が分かる！ Flutterの全体像がわからない。 Flutterの学習すべきことを知りたい。 新しいことを学習する際は全体像を捉えることが重要です。「今はここを学習してるんだな。」と実...