Как избежать изменения размера в режиме разделенного экрана во Flutter? - PullRequest
Новая
       12

Как избежать изменения размера в режиме разделенного экрана во Flutter?

3 голосов
/ 05 мая 2020

При попытке разработать адаптивное приложение я столкнулся с проблемой, когда приложение изменяло размер своих компонентов в режиме разделенного экрана. Как я проверил, это было вызвано тем, что контекст и окно также меняют свои значения при переключении в режим разделения экрана.

Как это выглядит (мое приложение ниже), заголовок искажается изменением размера, когда я использовал MediaQuery. of (context) .height: Its header is contorted

В полноэкранном режиме это нормально: How it should be

Есть ли способ исправить.

Мой код:

main.dart: 

import 'dart:ui';

import 'package:flutter/material.dart';
import 'screens/home.dart';
import 'package:flutter/services.dart';
import './sizing/Sizing.dart';

class Orient extends StatelessWidget{
    @override
  Widget build(BuildContext context) {
    SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
       statusBarColor: Color.fromRGBO(9, 168, 48, 1), //or set color with: Color(0xFF0000FF)
    ));
    // TODO: implement build
    return MaterialApp(
        title: 'Orient tm',
        home: SafeArea(child: Home(dimensions: Sizing(),)),
    );
  } 
}

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

PS Я пытался получить значение размера окна в режиме stati c, не используя контекст. Он работает частично, когда приложение является первым основным в режиме разделенного экрана, но не когда оно отображается как второе приложение (см. Первое изображение).

home.dart: 

import 'dart:ui';

import 'package:flutter/material.dart';
import '../sizing/Sizing.dart';

class Home extends StatelessWidget{
  final Sizing dimensions;
  Home({this.dimensions});

  List<Widget> _nav() =>  <Widget>[
      Expanded(
        flex: 2,
        child: Icon(Icons.menu),
      ),
       Expanded(
         flex: 8,
         child: Padding(
            padding: EdgeInsets.symmetric(vertical: dimensions.height*0.01), 
            // child: Container(child: Image.asset('assets/images/orient1.png'),),
           )
      ),
      Expanded(
        flex: 2,
        child: Icon(Icons.search),
      ),
  ]; 


  Container _header(context) => 
      Container(
          child: Center( 
            child: Row(
              children: _nav(),
            )
          ),
          decoration: BoxDecoration(
            color: Color.fromRGBO(9, 168, 48, 1),
            borderRadius: BorderRadius.vertical(
                bottom: Radius.elliptical(
                    dimensions.width, dimensions.width*(7/75))),
          ),
  );

    @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return (
      Scaffold(
        extendBodyBehindAppBar: true,
         appBar: PreferredSize(
           preferredSize: Size.fromHeight(dimensions.height*0.07),
           child: _header(context),
         ),
         body: Container(
           decoration: BoxDecoration(
             color: Colors.white
           ),
         ),
      )
    );
  }
}

Калибровочный арт: 

import 'dart:ui';

import 'package:flutter/material.dart';

var size = MediaQueryData.fromWindow(window).size;

class Sizing{

    final double height;
    final double width;

    Sizing(): height = size.height, width = size.width;

}

1 Ответ

0 голосов
/ 19 мая 2020

Решение пришло мне случайно, не знаю почему, но работает. Я заменил ScreenUtil (). SetHeight на ScreenUtil (). SetWidth на HEIGHT, это действительно странно, но работает отлично.

...