qml QtQuick2 ScrollView代码控制ScrollView滚动、ScrollView自动滚动

QtQuick1的ScrollView有flickableItem可以直接控制,但目前尚未找到QtQuick2的ScrollView的哪个属性可以直接控制其滚动,所以此方法本质上是倒腾到ScrollView的滚动条,通过控制滚动条的代码来控制ScrollView滚动到某处,需要对其滚动条自定义,滚动到的位置需要列式计算。不过这会带来个小问题就是自定义ScrollBar后当使用滚轮滚动时会同时 显示出来另一个滚动条在顶部不动,推测是自定义完滚动条后原本的滚动条并未隐藏且不关联了,解决方法可找
qml ScrollView在自定义滚动条后仍会显示一个旧的没用的滚动条解决办法

    ScrollView{//ScrollView本体
        id:scrollview
		...
        clip: true
        ScrollBar.vertical: ScrollBar{//自定义ScrollView滚动条,不然访问不到
            id:cusScrollBar
            anchors.top:scrollview.top
            anchors.bottom: scrollview.bottom
            anchors.right: scrollview.right
        }
        ......
   }
   function xxx(){//滚动方法
   		cusScrollBar.position = ...//
   }

完整案例代码参考

import QtQuick.Window 2.2
import QtQuick 2.9
import QtQuick.Controls 2.2
Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")
    color:"gray"
    
    ScrollView{//ScrollView本体
        id:scrollview
        anchors.centerIn: parent
        width: 100
        height: 70
        clip: true
        
        ScrollBar.vertical: ScrollBar{//自定义ScrollView滚动条,不然访问不到
            id:cusScrollBar
            anchors.top:scrollview.top
            anchors.bottom: scrollview.bottom
            anchors.right: scrollview.right
        }
        
        Column{
            id:column
            spacing: 10
            Repeater{//我要整十个
                id:rectRep
                model:10
                Rectangle{//里边写着序号的方块
                    width: 100
                    height: 50
                    color: "#000000"
                    Text {
                        text: index+1
                        color: "#ffffff"
                        anchors.centerIn: parent
                        font.pixelSize: 24
                    }
                }
            }
        }
    }
    property int pageNum: 1//方便计数暴露一个int变量
    
    function scroll_once(){//滚动方法
        //根据需要可自行列式计算滚动位置
        //此处是将需要滚动到的数乘以单个方块和间隙之和除以Column的总长度计算需要滚动到的位置
        cusScrollBar.position = (rectRep.itemAt(0).height+column.spacing) * pageNum / column.height
        if(pageNum<9)
            pageNum++
        else if(pageNum >= 9)
            pageNum = 0
    }
    
    Button{//按钮控制
        width: 120
        height: 24
        text: "向下滚动一个"
        onReleased: scroll_once()
    }
    Timer{//定时器控制
        interval: 1000; running: true; repeat: true
        onTriggered: scroll_once()
    }
}

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值