どのようにフラッタのアイコン/アイコンのボタンを変更するには?


Icon Widgetはフラッタにアイコンを導入する主な方法です.そして、IconButton Widgetはボタンのように行動します、しかし、通常のボタンの代わりにアイコンで.そこでこの記事では、フラッタのアイコン/アイコンボタンのサイズ変更方法について説明します.

始めましょう.
どのようにフラッタのアイコン/アイコンのボタンを変更するには?
アイコンのサイズプロパティを使用できます.コードスニペットは以下のようになります.
アイコンのサイズプロパティを使用できます.
Icon(
  Icons.radio_button_checked,
  size: 12,
),
IconButtonのために使用することができます
Transform.scale(
  scale: 0.5,
  child: IconButton(
    onPressed: (){},
    icon: new Image.asset("images/IG.png"),
  ),
),
IconButton(
              onPressed: () {},
              icon: const Icon(Icons.account_box),
              iconSize: 50,
            ),
次のように試してみてください.
new SizedBox(
   height: /*calculate from width and no:of child*/,
   width: /*calculate from width and no:of child*/,
   child: new IconButton(
      padding: new EdgeInsets.all(0.0),
      icon: new Image.asset("images/IG.png"),
      onPressed: null,
   )
)
IconButtonの幅と高さを設定し、コンテナウィジェットの中心に設定します.
Container(
           height: 18.0,
           width: 18.0,
           color: Colors.yellow,
           child: new IconButton(
             padding: new EdgeInsets.all(0.0),
             color: Colors.red,
             icon: new Icon(Icons.clear, size: 18.0),
             onPressed: null,
           )
       )
例:
 return Scaffold(
      appBar: AppBar(
        title: const Text("Icon Size Example"),
      ),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          const Text("Small size Icon"),
          const Icon(
            Icons.home_filled,
            size: 40,
          ),
          const SizedBox(
            height: 40,
          ),
          const Text("This is Icon Button"),
          Center(
            child: Container(
              color: Colors.grey,
              width: 100,
              height: 50,
              child: IconButton(
                onPressed: () {
                  Fluttertoast.showToast(
                    msg: "Icon Button Clicked",
                  );
                },
                icon: const Icon(Icons.change_circle_outlined),
                iconSize: 35,
              ),
            ),
          ),
        ],
      ),
    );
出力は以下のようになります.
出力:

まとめ
読んでくれてありがとう!
親切にあなたの提案/フィードバックをはるかに良いサービスをドロップします.
あなたのアイデアを現実に変換しますか?我々は開発サービスを支援するのが大好きだ.
FlutterAgency.comは、フラッタ技術とフラッター開発者に捧げられる我々のポータルプラットホームです.ポータルはフラッターウィジェットガイド、フラッタプロジェクト、コードLIBSなどのようなフラッターからクールなリソースがいっぱいです.