Есть странное поведение стека с Fittedbox в макете? - PullRequest
0 голосов
/ 04 мая 2018

Я следую учебному пособию по теме карты и пишу код примера карты галереи флаттера

https://github.com/flutter/flutter/blob/master/examples/flutter_gallery/lib/demo/material/cards_demo.dart

Официальный пример карты здесь

image

Я не знаю логики со стеком в сочетании со встроенной коробкой. Почему высота? Я просто следую инструкциям по установке полей снизу, слева и справа до 16.0,16.0,16.0. Если у меня нет недопонимания, это запас между родителем и блоком размера. Почему бы существовала высота? Есть ли какой-нибудь черный магический код этого? Я просто хочу понять логику этого.

Мой результат image

image

 var titleImage2 = new SizedBox(
      height: 200.0,
      child: new Stack(
        children : <Widget> [
            //new Text("First element" , style: new TextStyle(color: Colors.red),),
            new Positioned(
                //top: 0.0,
                left : 16.0, 
                right : 16.0, 
                bottom: 16.0,
                //width: 100.0,
              child: new FittedBox(
                fit : BoxFit.scaleDown, 
                alignment: Alignment.topLeft,
                child : new Container(
                  child: new Text(
                      "Hello world"
                  ),
                )
              ),
            )],
      ),
); 

Сводка: почему только установите слева, справа, снизу на поле 16.0, это будет существующая высота? Я новичок флаттера

left : 16.0, 
right : 16.0, 
bottom: 16.0,

Странное изображение

image

1 Ответ

0 голосов
/ 04 мая 2018

Я не могу рассказать вам об особенностях фактического алгоритма, который делает это возможным, но я могу сказать вам, почему - потому что вы используете FittedBox. FittedBox выполняет всевозможные вычисления, чтобы попытаться вписать ваш элемент в родительский элемент, основываясь на ограничениях родителя и потомка. Это полезно для таких вещей, как изображения, которые имеют определенное соотношение сторон, но в остальном не имеют ограничений по размеру.

Поскольку у вас есть текст в качестве дочернего элемента FittedBox, возможно, у него проблемы с вычислением размера, до которого он может масштабироваться - я понятия не имею, о чем будет сообщать текст (и я игнорирую контейнер, потому что он в основном просто делегирует макет своему ребенку, если он не имеет ширины и высоты). Попробуйте установить его в BoxFit.cover, и вы увидите, что произойдет. Но почему он выбирает именно этот размер, я понятия не имею.

Я бы порекомендовал удалить FittedBox, если вы не используете изображение; это причина того, что вы видите.

...