ListView搭配ScrollView实现动态更改横向宽度

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12


Window {
    id:mainwindow
    visible: true
    width:  600
    height: 480
    title: qsTr("This is qml Window")
    color: "#ffffff"

    function init()
    {
        if(!sdkasfksdlfsd.count)
        {
            return
        }

        var widthaList = {}

        for(var i = 0;i < sdkasfksdlfsd.count;i++)
        {
            widthaList[i] = (mylistview.itemAtIndex(i).texxx.width+30)
            console.log(widthaList[i])
        }

        //排序 
        for( i = 0;i < sdkasfksdlfsd.count;i++)
        {
            for( let j = 0;j < sdkasfksdlfsd.count -i;j++)
            {
                if (widthaList[j] < widthaList[j + 1])//满足条件进行交换
                {
                    var temp = widthaList[j];
                    widthaList[j] = widthaList[j + 1];
                    widthaList[j + 1] = temp;
                }
            }
        }

        //判断
        for( i = 0;i < sdkasfksdlfsd.count ;i++)
        {
            console.log(widthaList[i]+"---"+i)

            if( widthaList[i] === scroll.contentWidth)
            {
                return
            }
            else{
                scroll.contentWidth = widthaList[i]
                if (dshfkajsdkfkasldf.width > scroll.contentWidth)
                {
                    scroll.contentWidth = dshfkajsdkfkasldf.width
                }
                return
            }
        }

    }

    Rectangle{
        id:dshfkajsdkfkasldf
        width: 530
        height: 300
        anchors.centerIn: parent
        ScrollView{
            id:scroll
            width:parent.width
            height: parent.height
            clip: true
            anchors.centerIn: parent
            contentWidth: parent.width
            contentHeight: sdkasfksdlfsd.count*30>300?sdkasfksdlfsd.count*30:300
            ListModel{
                id:sdkasfksdlfsd
            }

            ListView{
                id:mylistview
                width: parent.width
                height: parent.height
                leftMargin: 10
                topMargin: 10
                rightMargin: 10
                bottomMargin: 10
                model:sdkasfksdlfsd
                clip: true

                delegate: Rectangle{
                    width: parent.width
                    height: 30
                    color: mylistview.currentIndex == index?"#0079FE":"#ffffff"
                    property alias texxx: dadfasdfsd
                    Text {
                        id:dadfasdfsd
                        text: modeDtas
                        font.pointSize: 12
                        anchors.verticalCenter: parent.verticalCenter
                        anchors.left: parent.left
                        anchors.leftMargin: 5
                        color: mylistview.currentIndex == index?"black":"black"
                        onWidthChanged: {

                            if((width+30)>scroll.contentWidth)
                            {
                                scroll.contentWidth = width+30
                            }
                        }
                    }

                    MouseArea{
                        anchors.fill: parent
                        hoverEnabled: true
                        onClicked: {
                            mylistview.currentIndex = index
                        }
                    }
                }
            }
        }
    }
    Timer{
        id:updateWidth
        running: false
        interval: 300
        onTriggered: {
            init()
        }
    }

    Row{
        width: parent.width
        height: 30
        anchors.top: dshfkajsdkfkasldf.bottom
        anchors.topMargin: 10
        spacing: 10
        TextField{
            id:textEdit
            width: 150
            height:30
            anchors.verticalCenter: parent.verticalCenter
            selectByMouse: true
            text:""
            font.pointSize: 10
        }
        Button{
            text: "添加"
            width: 60
            height: 30
            onClicked: {
                sdkasfksdlfsd.append({"modeDtas":textEdit.text})
            }
        }
        Button{
            text: "清空"
            width: 60
            height: 30
            onClicked: {
                sdkasfksdlfsd.clear()
                scroll.contentWidth = 300
            }
        }
        Button{
            text: "删除"
            width: 60
            height: 30
            enabled: !updateWidth.running
            onClicked: {
                sdkasfksdlfsd.remove(mylistview.currentIndex)
                updateWidth.start()

            }
        }
    }
}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值