flutter create a button with 2 icons-CodePudding

[ Elevated button with icon and arrow1

I can create a button with an icon using this code

 ElevatedButton.icon(
          icon: Icon(
            Icons.home,
            color: Colors.green,
            size: 30.0,
          ),
          label: Text('Elevated Button'),
          onPressed: () {
            print('Button Pressed');
          },
          style: ElevatedButton.styleFrom(
            shape: new RoundedRectangleBorder(
              borderRadius: new BorderRadius.circular(20.0),
            ),
          ),
        )

but how to put an arrow on the right side of the button?

CodePudding user response：

It seems like you want a

 Container(
        margin: const EdgeInsets.all(10),
        decoration: BoxDecoration(
          border: Border.all(
            color: Colors.black,
            width: 1,
          ),
        ),
        child: const ListTile(
          leading: Icon(Icons.mail),
          trailing: Icon(Icons.arrow_forward_ios),
          title: Text('Change Email Address'),
        ),
      )

You can also use IconButton instead of a regular Icon in this example.

CodePudding user response：

To add two icons to an elevated button, just wrap your child widget with a row widget. See implementation below:

ElevatedButton(
  onPressed: () {},
  child: Row(
    mainAxisAlignment: MainAxisAlignment.spaceBetween,
    children: const [
      Icon(Icons.home),
      Text('Home'),
      Icon(Icons.navigate_next)
    ],
  ),
),

CodePudding user response：

As per your shared Image I have try same design in Various ways choice is yours