kriti sharma
kriti sharma

Reputation: 371

How to align widgets inside a row

I would like to align my widgets at the start and at the end of row and I am not able to acheive so? I am confused what to do

doing padding is a static solution and it is giving the overflow error in some devices I want to acheive it for generic all device I dont know how to do.

Kindly help

Padding(padding:EdgeInsets.only(top:60,left:30,right:30),child:
  Row(
    children: <Widget>[                    
       Cancel_btn,
       Retry_btn
     ],
   )
)

Upvotes: 0

Views: 74

Answers (2)

CopsOnRoad
CopsOnRoad

Reputation: 268414

There are many ways of doing it.

(I) Using mainAxisAlignment.

Row(
  mainAxisAlignment: MainAxisAlignment.spaceBetween, // add this
  children: [
    Child1(),
    Child2(),
  ]
)

(II) Using Spacer().

Row(
  children: [
    Child1(),
    Spacer(), // or add this
    Child2(),
  ]
)

Upvotes: 1

user10539074
user10539074

Reputation:

minimal amount of code

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(),
        body: Container(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween, // magic is here
            children: <Widget>[
              RaisedButton(child: Text('Cancel'), onPressed: () {}),
              RaisedButton(child: Text('Retry'), onPressed: () {}),
            ],
          ),
        ),
      ),
    );
  }
}

enter image description here

Upvotes: 1

Related Questions