读书人

qml 兑现普通的滚动条

发布时间: 2013-04-05 10:24:33 作者: rapoo

qml 实现普通的滚动条
我最近写了一个界面 , 界面左边是一个listView,右边有一个滚动条。现在我想实现,拖动右边的滚动条,左边的listView 也跟着动。qml里面自带的例子我也研究过。不过那个不能实现我想要的效果。跪求qml大神给个确实能行的方法!
[解决办法]
QML问题,到http://qt-project.org/forums/里问老外吧。

[解决办法]

引用:
文档我都看了 几遍了关键是 contentY 不起作用不知道为什么的
引用:

您所说的 我都做了,没有成功
引用:

这个不难吧,用信号和槽再加几个基本的QML元素就可以搞定,思路如下:
1. 需要两个Rectangle,一个做底一个做滚动条的按钮部分。
2. 在按钮部分增加一个鼠标区域,设置拖动的相关参数
……

怎么可能呢?我刚写了个示例代码,楼主看看哪里不一样

import QtQuick 1.1

// 页面
Rectangle {
id: page
width: 360
height: 640

// 模型
ListModel {
id: model
ListElement { title: "1" }
ListElement { title: "2" }
ListElement { title: "3" }
ListElement { title: "4" }
ListElement { title: "5" }
ListElement { title: "6" }
ListElement { title: "7" }
ListElement { title: "8" }
}

// 视图
ListView {
id: view
anchors.fill: parent
anchors.rightMargin: 12
model: model
delegate: delegate
spacing: 5
}

// 代理
Component {
id: delegate

// 列表项
Rectangle {
width: parent.width
height: 100
border.color: "red"

Text {
anchors.centerIn: parent
text: title
font.pointSize: 24
color: "black"
}
}
}

// 滚动条


Rectangle {
id: scrollbar
x: 350
y: 0
width: 10
height: 640
color: "black"

// 按钮
Rectangle {
id: button
x: 0
y: view.visibleArea.yPosition * scrollbar.height
width: 10
height: view.visibleArea.heightRatio * scrollbar.height;
color: "green"

// 鼠标区域
MouseArea {
id: mouseArea
anchors.fill: button
drag.target: button
drag.axis: Drag.YAxis
drag.minimumY: 0
drag.maximumY: scrollbar.height - button.height

// 拖动
onMouseYChanged: {
view.contentY = button.y / scrollbar.height * view.contentHeight
}
}
}
}
}


注意,代码并不完善,这只是个例子,楼主需要看懂后自己做出调整。

读书人网 >QT开发

热点推荐