UmaiZ
UmaiZ

Reputation: 133

In flutter how can we set height or width by percentage?

Need to know one thing in flutter is it possible to define height/width in % ? I am following some tutorial but in end, I notice that UI is not responsive so I think best way is to fix height or width by a percentage.

We can simply take example of SizedBox

SizedBox(height: 20,)

How can I show height like 5% in this SizedBox? or any other best solution to make height responsive?

Upvotes: 8

Views: 9892

Answers (2)

Mohamed Abdou
Mohamed Abdou

Reputation: 451

You can access the MediaQuery property

h = MediaQuery.of(context).size.height
w = MediaQuery.of(context).size.width

myWidgetHeight = h * 0.35

This is helpful when u want to get the size of the screen the app is working on and manipulate in a function, other than a widget property

Upvotes: 1

Brinda Rathod
Brinda Rathod

Reputation: 2903

You can use FractionallySizedBox instead of SizedBox.

Ex

FractionallySizedBox(heightFactor: 1, widthFactor: 0.25,
  child: Container(color: Colors.orange)),

Upvotes: 15

Related Questions