В чем разница между использованием выравнивания или позиционированного флаттера - PullRequest
Новая
       20

В чем разница между использованием выравнивания или позиционированного флаттера

0 голосов
/ 11 марта 2019

Это конкретный пример использования и позиционированного виджета, и Align Widget!Но у меня возникла проблема с выбором, что использовать!хотя оригинальная проблема состоит в том, чтобы установить смещения некоторых FAB относительно его контейнера, а не экрана 

Stack(
      children: <Widget>[
        Positioned(left: 0.0, child: Text("Top\nleft")),
        Positioned(bottom: 0.0, child: Text("Bottom\nleft")),
        Positioned(top: 0.0, right: 0.0, child: Text("Top\nright")),
        Positioned(bottom: 0.0, right: 0.0, child: Text("Bottom\nright")),
        Positioned(bottom: 0.0, right: 0.0, child: Text("Bottom\nright")),
        Positioned(left: width / 2, top: height / 2, child: Text("Center")),
        Positioned(top: height / 2, child: Text("Center\nleft")),
        Positioned(top: height / 2, right: 0.0, child: Text("Center\nright")),
        Positioned(left: width / 2, child: Text("Center\ntop")),
        Positioned(left: width / 2, bottom: 0.0, child: Text("Center\nbottom")),
      ],
    )
    Example #2 (Using Align in Stack)

    Stack(
      children: <Widget>[
        Align(alignment: Alignment.center, child: Text("Center"),),
        Align(alignment: Alignment.topRight, child: Text("Top\nRight"),),
        Align(alignment: Alignment.centerRight, child: Text("Center\nRight"),),
        Align(alignment: Alignment.bottomRight, child: Text("Bottom\nRight"),),
        Align(alignment: Alignment.topLeft, child: Text("Top\nLeft"),),
        Align(alignment: Alignment.centerLeft, child: Text("Center\nLeft"),),
        Align(alignment: Alignment.bottomLeft, child: Text("Bottom\nLeft"),),
        Align(alignment: Alignment.topCenter, child: Text("Top\nCenter"),),
        Align(alignment: Alignment.bottomCenter, child: Text("Bottom\nCenter"),),
        Align(alignment: Alignment(0.0, 0.5), child: Text("Custom\nPostition", style: TextStyle(color: Colors.red, fontSize: 20.0, fontWeight: FontWeight.w800),),),
      ],
    );

> Blockquot

e

Ответы [ 2 ]

1 голос
/ 11 марта 2019
  • Positioned - выравнивание на основе смещения, в котором в качестве единицы измерения используется DP
  • Align, используется% от родительского размера

Как таковое, Alignment(0.1, 0.1)не может быть представлен с помощью Positioned.И, аналогично, Align не может представлять Positioned(top: 10, left: 10).

Во-вторых, Positioned находится в другом потоке .

Stack может измерять себя на основеразмер одного из дочерних исключая Positioned виджетов .

Таким образом, использование Align против Positioned может привести к Stack другого размера.

0 голосов
/ 11 марта 2019

Positioned может использоваться только в пределах Stack и позиционирует дочерний элемент относительно размера Stack.

https://docs.flutter.io/flutter/widgets/Positioned-class.html

Align будет настолько большим, насколько это возможно, в пределах его родителя (или размера относительно дочерних элементов, если переданы heightFactor, widthFactor) и позиционирует его дочерний элемент относительно себя. Align можно использовать везде, а не только внутри Stack.

https://docs.flutter.io/flutter/widgets/Align-class.html

...