how to custom position button in flutter?

user_3123657 0
Viewed 9231

I'm trying to position a button in custom place in Flutter web app but i cant. Here is my code:

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context)
        .size; // This method will give us the height and width of our device screen
    return Container(
        height: size.height,
        width: size.width,
        decoration: BoxDecoration(
            image: DecorationImage(
                image: AssetImage("assets/images/687.jpg"), fit: BoxFit.cover)),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            FlatButton(
              color: Colors.black,
              onPressed: () {},
              child: Text("Login"),
              textColor: Colors.white,
            ),
          ],
        ));
  }
}

Here is picture for demonstration the custom place that i want: enter image description here

flutter-layout dart flutter
1 Answers

You can use the container set full width to it, add margin and place button inside it.Margin help to adjust the button n any place.

or you can user Positioned Widget

example:

new Positioned(
   left: MediaQuery.of(context).size.width/2+100,
   top: MediaQuery.of(context).size.height/2,
   child: new Container(
     width: 100.0,
     height: 80.0,
     decoration: new BoxDecoration(color: Colors.red),
     child: new Text('hello'),
    )
user_51375390
Related