Question

我正在尝试使用Wrap小部件编写简单的布局。我想知道是否有任何方法可以将“溢出”元素放置在第一轮而不是最后一次。例如，假设我有一个包含7个元素的水平Wrap，并且每次运行都可以容纳四个元素。我不想让最后三个元素最后在运行（行）中结束，我希望只有前三个元素在开始时以运行（行）结束。

我可以不使用其他布局小部件来实现此目的吗？

还有，是否有任何方法可以强制在换行中的某个元素之后开始新的运行？例如，如果我一直想将第一个元素放在自己的行上？

Answer 1

有一个名为textDirection的属性，它不仅可以控制文本，还可以控制小部件。

因此，您有订单项，例如

A, B, C, D|

E, F      |

您添加

Wrap(
   ...
      textDirection: TextDirection.rtl,
   ...)

项目变为

D, C, B, A|

      F, E|

在[Medium中的此[article] [1]中，有一个很好的解释说明了wrap小部件的可能性。

编辑：

换行开始从相同方向“换行”，因此布局类似

A, B      |
C, D, E, F|

的确是不可能的，仅需包裹即可。

但是。如果改用“行和列”布局，则可能可以做到这一点。这是必需的附加逻辑，但结果应该是可能的。由于没有实现布局的代码，因此我将尽力解释它。

List<Widget> widgetList = [WidgetA,WidgetB,WidgetC,WidgetD,WidgetE,WidgetF]; //The widget list A,B,C,D,E,F...  Each widget SHOULD be wrapped in Expanded(), and have a fixed height to avoid infinity height
List<Widget> reversedList = List.from(widgetList.reversed); //F,E,D,C,B,A
//We need to split this in sub list of 4 items each, I will use Spacers()  on the last sublist if it's not 4, to keep a nice layout
List<List> subLists=[];
for (var i = 0; i < reversedList.length; i +=4) {
    bool isLastSublist = i+4 > reversedList.length ;
    List subListToAdd = reversedList.sublist(i, isLastSublist ? reversedList.length : i + 4);
    //When the lengthis less than 4 we add spacers to maintain the layout spacing
    if(subListToAdd.length>4){
        for(var o = subListToAdd.length;o<=4;o++){
            sublistToAdd.add(Spacer());
        }
    }
    subLists.add(subListToAdd); 

}

//in other part of your code
//...

Column(
...
verticalDirection: VerticalDirection.up,
children:List<Widget>.generate(subLists.length,(int index) => Row(children:subLists[index]))
...
)

我现在不在我的随身电脑中，因此我无法对其进行测试，但是概念在那里，可以对代码进行优化 [1]：https://medium.com/flutter-community/flutter-wrap-widget-e1ee0b005b16

我可以颠倒Flutter Wrap小部件的运行顺序吗？

1 个答案: