2015-11-01 87 views
6

我有项的行当窗口宽度获取对于一行中的显示的所有项目太小,这应堆作为显示在下面的草图:流布局与中心的内容

enter image description here

Flow组件堆的项目,但他们不是中心,但排列在左侧或右侧:

Flow { 
    Item {} 
    Item {} 
    Item {} 
    Item {} 
    Item {} 
} 

是否有QML内置的方式,使中心的流量?

回答

3

那么没有内置的方式,但我找到了解决办法。

这个想法很简单,因为Flow已经是Item它有anchors.leftMarginanchors.rightMargin。因此,如果我们可以计算,Flow的行内有多少元素,那么我们可以计算左右边距。因此,我们可以在中心。

这是一个简单的代码,

 Flow { 
     property int rowCount: parent.width/(elements.itemAt(0).width + spacing) 
     property int rowWidth: rowCount * elements.itemAt(0).width + (rowCount - 1) * spacing 
     property int mar: (parent.width - rowWidth)/2 

     anchors { 
      fill: parent 
      leftMargin: mar 
      rightMargin: mar 
     } 

     spacing: 6 
     Repeater { 
      id: elements 
      model: 5 
      Rectangle { 
       color: "#aa6666" 
       width: 100; height: 100 
      } 
     } 
1

Qml中是否有一种内置方式来使流程居中?

你可以做一下数学计算来检查,如果最后“行”在Flow是不是满的,然后添加一些垫片项目在该行中的项目的左侧和右侧。可能你必须使用一些C++;即QQuickItem::stackBefore()QQuickItem::stackAfter()将垫片项目重新放置在Flow的子项列表中。每个间隔物的宽度将是该行内剩余空间的一半。这并不漂亮,但它应该工作。

0

我不认为有任何内置的方式来这样做。你必须做出自己的元素。