Как я могу иметь размеры виджетов относительно размера экрана во флаттере?

Question

Я создавал приложение для флаттера. Там я сделал SliverAppBar:

child: NestedScrollView (
  headerSliverBuilder: (BuildContext context, i) {
    return <Widget> [
      SliverAppBar (
        backgroundColor: Colors.black,
        expandedHeight: 150.0,
      )
    ];
  },

Я сделал высоту до 150.0 пикселей. Но я понял, что этот размер будет меняться в разных устройствах. Как я могу заставить размер занимать 40% экрана в каждом устройстве?

Answer 1

Вы можете использовать BuildContext context с MediaQuery, чтобы узнать размер экрана текущего устройства. Например:

    var width = MediaQuery.of(context).size.width  * 0.4; // set width to 40% of the screen width
    var height = MediaQuery.of(context).size.height  * 0.4; // set height to 40% of the screen height