qt qml scrollbar 移动APP风格的滚动轴
生活随笔
收集整理的這篇文章主要介紹了
qt qml scrollbar 移动APP风格的滚动轴
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
依附于Flickable組件的滾動軸
? ? 自動放置在恰當位置
? ? 拖動時顯示,不動時消失
Lisence: MIT 請保留此聲明
Author: surfsky.cnblogs.com 2014-12
【先看效果】
【下載】
http://download.csdn.net/detail/surfsky/8426563
【核心代碼】
1 ScrollBar { 2 id: root 3 opacity: 0 4 orientation: Qt.Vertical 5 6 // 綁定到Flickable組件 7 property Flickable target : Flickable{} 8 9 // 位置 10 width: orientation==Qt.Vertical ? 10 : target.width-10 11 height: orientation==Qt.Vertical ? target.height-10 : 10 12 anchors.right: orientation==Qt.Vertical ? target.right : undefined 13 anchors.bottom: orientation==Qt.Vertical ? undefined : target.bottom 14 15 // 滾動 16 position: orientation==Qt.Vertical ? target.visibleArea.yPosition : target.visibleArea.xPosition 17 pageSize: orientation==Qt.Vertical ? target.visibleArea.heightRatio : target.visibleArea.widthRatio 18 19 20 // 移動時顯隱滾動軸 21 Connections{ 22 target: root.target 23 onMovingVerticallyChanged: { 24 if (target.movingVertically) 25 fadeIn.start(); 26 else 27 fadeOut.start(); 28 } 29 onMovingHorizontallyChanged: { 30 if (target.movingHorizontally) 31 fadeIn.start(); 32 else 33 fadeOut.start(); 34 } 35 } 36 NumberAnimation { id:fadeIn; target: root; properties: "opacity"; duration: 400; from:0; to:1 } 37 NumberAnimation { id:fadeOut; target: root; properties: "opacity"; duration: 400; from:1; to:0 } 38 }?
【調用示例】
1 FlickableScrollBar { 2 target: view 3 orientation: Qt.Vertical 4 }?
總結
以上是生活随笔為你收集整理的qt qml scrollbar 移动APP风格的滚动轴的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 说说音箱
- 下一篇: Linux进程实践(1) --Linux