zoukankan      html  css  js  c++  java
  • 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      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     }
  • 相关阅读:
    python环境准备(2020-1-13)
    git知识
    toolbar的相关知识
    Android开发极光推送功能实现步骤
    Android开发分享功能实现步骤
    使用tablayout和viewpager实现简单的页面布局
    activity与fragment的交互(一个activity跳转到另一个fragment)
    java中堆区和栈区的区别
    WebView的基本使用
    final的用法
  • 原文地址:https://www.cnblogs.com/surfsky/p/4290753.html
Copyright © 2011-2022 走看看