• Roson的Qt之旅#108 QML ListView的布局、方向和堆叠顺序


    1.列表视图的布局

    ListView中的项目的布局可以由这些属性控制。
    orientation - 控制项目是水平地还是垂直地流动。这个值可以是Qt.Horizontal或Qt.Vertical。
    layoutDirection - 控制水平方向的视图的水平布局方向:也就是说,项目是否从视图的左侧布局到右侧,或者反过来。这个值可以是Qt.LeftToRight或Qt.RightToLeft。
    verticalLayoutDirection - 控制垂直方向的视图的垂直布局方向:也就是说,项目是否从视图的顶部向底部布局,或者反之亦然。这个值可以是ListView.TopToBottom或ListView.BottomToTop。

    默认情况下,ListView有一个垂直方向,项目从上到下排列。下表显示了ListView可以有的不同布局,这取决于上述属性的值。


    1.1具有Qt垂直方向的列表视图


    1.2具有Qt水平方向的列表视图

    2.Flickable方向  

    默认情况下,垂直的ListView将flickableDirection设置为Flickable.Vertical,而水平的ListView将其设置为Flickable.Horizontal。此外,垂直的ListView只计算(估计)contentHeight,而水平的ListView只计算contentWidth。其他维度被设置为-1。
    自Qt 5.9(Qt Quick 2.9)以来,可以制作一个可以向两个方向滑动的ListView。为了做到这一点,可以将flickableDirection设置为Flickable.AutoFlickDirection或Flickable.AutoFlickIfNeeded,并且必须提供所需的contentWidth或contentHeight。

    1. import QtQuick 2.9
    2. import QtQuick.Window 2.2
    3. Window {
    4. visible: true
    5. width: 640
    6. height: 480
    7. title: qsTr("Hello World")
    8. ListView {
    9. width: 180; height: 200
    10. contentWidth: 320
    11. flickableDirection: Flickable.AutoFlickDirection
    12. model: ContactModel {}
    13. delegate: Row {
    14. Text { text: 'Name: ' + name; width: 160 }
    15. Text { text: 'Number: ' + number; width: 160 }
    16. }
    17. }
    18. }

    运行效果如下


      


    3.ListView中的堆叠顺序

    项目的Z值决定了它们是在其他项目的上方还是下方呈现。ListView使用几种不同的默认Z值,这取决于正在创建的项目的类型


    如果项目的Z值为0,就会设置这些默认值,所以将这些项目的Z值设置为0没有任何影响。请注意,Z值是实数类型的,所以有可能设置像0.1这样的小数值。
    参见QML Data Models、GridView、PathView、和Qt Quick Examples - Views.

  • 相关阅读:
    Kyligence 联合创始人兼 CEO 韩卿荣获金融科技风云人物奖
    18、JAVA入门——接口
    独家巨献!阿里专家兼Github贡献者,整理的SpringBoot入门到成神
    阿里巴巴面试题- - -多线程&并发篇(三十五)
    Qwt QwtWheel绘制滚动轮
    Linux服务器的一些优点
    hive变更数据过程
    leetcode LCR 007 mid. 三数之和。对撞指针解法
    myBatis处理一对多&多对一查询
    css 文本属性
  • 原文地址:https://blog.csdn.net/jolin678/article/details/126215082