{"id":8390,"date":"2023-07-31T06:36:53","date_gmt":"2023-07-31T06:36:53","guid":{"rendered":"https:\/\/www.bacancytechnology.com\/qanda\/?p=8390"},"modified":"2023-07-31T06:37:50","modified_gmt":"2023-07-31T06:37:50","slug":"flutter-use-image-as-icon","status":"publish","type":"post","link":"https:\/\/www.bacancytechnology.com\/qanda\/flutter\/flutter-use-image-as-icon","title":{"rendered":"How to Use an Image Instead of an Icon in Flutter?"},"content":{"rendered":"<p>ImageIcon widget is the most suitable widget to use images as icons in Flutter. You can use its property image to assign your own image.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\">ImageIcon(\r\n     AssetImage(\"images\/icon.png\"),\r\n     color: Colors.red,\r\n     size: 24,\r\n),<\/pre>\n<p>Also you can just convert images to svg icons and use as below,<br \/>\nThere is one library to render SVGs on a canvas, available here: <a href=\"https:\/\/github.com\/dnfield\/flutter_svg\" target=\"_blank\" rel=\"noopener\">github<\/a><\/p>\n<p>The API as of right now would look something like <strong>new SvgPicture.asset(&#8216;asset_name.svg&#8217;).<\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"<p>ImageIcon widget is the most suitable widget to use images as icons in Flutter. You can use its property image to assign your own image. ImageIcon( AssetImage(&#8220;images\/icon.png&#8221;), color: Colors.red, size: 24, ), Also you can just convert images to svg icons and use as below, There is one library to render SVGs on a canvas, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":8393,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[15],"tags":[],"class_list":["post-8390","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-flutter"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.bacancytechnology.com\/qanda\/wp-json\/wp\/v2\/posts\/8390"}],"collection":[{"href":"https:\/\/www.bacancytechnology.com\/qanda\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.bacancytechnology.com\/qanda\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.bacancytechnology.com\/qanda\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bacancytechnology.com\/qanda\/wp-json\/wp\/v2\/comments?post=8390"}],"version-history":[{"count":3,"href":"https:\/\/www.bacancytechnology.com\/qanda\/wp-json\/wp\/v2\/posts\/8390\/revisions"}],"predecessor-version":[{"id":8394,"href":"https:\/\/www.bacancytechnology.com\/qanda\/wp-json\/wp\/v2\/posts\/8390\/revisions\/8394"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.bacancytechnology.com\/qanda\/wp-json\/wp\/v2\/media\/8393"}],"wp:attachment":[{"href":"https:\/\/www.bacancytechnology.com\/qanda\/wp-json\/wp\/v2\/media?parent=8390"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bacancytechnology.com\/qanda\/wp-json\/wp\/v2\/categories?post=8390"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.bacancytechnology.com\/qanda\/wp-json\/wp\/v2\/tags?post=8390"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}