close

How To Make Round button with text and icon in flutter?

Hello Guys How Are You all? Hope you all are fine. Today I am Coming With New Tutorial For Futter Where You will Learn How To Make a Round button with text and icon in flutter ?. Here I have all possible methods to make a Round button with text and icon in a flutter. So Without wasting your time, Let’s start this article.

button with text and icon in flutter, round button with text and icon in flutter, How To Make Round button with text and icon in flutter

Method 1: Using FlatButton

Here We are using a FlatButton that contains a Column (for showing a text below the icon) or a Row (for text next to the icon), and then having an Icon Widget and a Text widget as children.

Here’s an example:

Output will be like below.

Full Source Code Of Method 1

Method 2 : Using ClipOvel and Material.

In Method 2 we are using ClipOvel And Material to make button with icon with it. Here’s an example:

Output will be like below.

Full Source Code Of Method 2

Method 3 : Using RaisedButton

Here We are going to use RaisedButton and then we will use Row OR Column for RaisedButton’s Child. Below Is Example.

Output Will Be Like Same As Below.

Full Source Code of RaisedButton Is Here Below.

Method 4 : Using RaisedButton Different Method

Here Is Another Method For RaisedButton. Here’s an example:

Output Will Be Like Same As Below.

Full Source Code of Method 4 Is Here Below.

So it’s all About How To Make Round button with text and icon in flutter?. Hope this tutorial helped you a lot. Comment below Your thoughts and your queries. And Also Comment on your suggestion here.

Also Read

Leave a Comment

%d bloggers like this: