[QML开发笔记]-QML滑屏效果

QML的SwipeView滑屏控件、PageIndicator翻页指示器控件的功能介绍和使用方法。同样的功能我通过QWidget也进行了实现，可以参考QWidget实现手机ipad屏幕滑屏效果

效果图：

代码：

main.qml

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12/**
* @FileName      main.qml
* @brief         File Description
* @author        Kongdemin
* @date          2020-04-24
*/Window {visible: truewidth: 640height: 480title: qsTr("QML滑屏效果")SwipeView {id: viewcurrentIndex: 0anchors.fill: parentSwipeViewPage {id: firstPagetext: "FirstPage"color: 'green'}SwipeViewPage {id: secondPagetext: "SecondPage"color: 'pink'}SwipeViewPage {id: thirdPagetext: "ThirdPage"}}PageIndicator {id: indicatorcount: view.countcurrentIndex: view.currentIndexanchors.bottom: view.bottomanchors.horizontalCenter: parent.horizontalCenter}
}

SwipeViewPage.qml

import QtQuick 2.0/**
* @FileName      SwipeViewPage.qml
* @brief         File Description
* @author        Kongdemin
* @date          2020-04-24
*/Rectangle {color: 'purple'property alias text: text.textText {id: textanchors.fill: parenttext: qsTr("text")font.family: "Helvetica"font.pointSize: 24color: "white"horizontalAlignment: Text.AlignHCenterverticalAlignment: Text.AlignVCenter}
}

其他功能使用可以参考帮助文档

[QML开发笔记]-QML滑屏效果相关推荐

[QML开发笔记]-QML绘制仪表盘
[QML开发笔记]-QML绘制仪表盘使用QML绘制仪表盘,主要是因为使用QPainter绘制控件绘制习惯了,使用QML也要绘制一个试试.总体感觉,QML绘制起来还是挺方便的,QML自带的仪表盘控件功 ...
QWidget实现手机ipad屏幕滑屏效果
QWidget实现手机/ipad屏幕滑屏效果通过Qt的QWidget实现手机ipad滑屏效果.最近学习qml时发现,通过qml的swipe组件可以方便实现滑屏效果,目前QWidget依旧是使用重点, ...
qml开发笔记(七)：输入元素鼠标输入MouseArea和键盘输入Keys
若该文为原创文章,未经允许不得转载原博主博客地址:https://blog.csdn.net/qq21497936 原博主博客导航:https://blog.csdn.net/qq21497936/ ...
android左右滑动fragment,Android基于ViewPager+Fragment实现左右滑屏效果的方法
本文实例讲述了Android基于ViewPager+Fragment实现左右滑屏效果的方法.分享给大家供大家参考,具体如下: 1.xml布局模板 android:id="@+id/local ...
html 滑屏效果,HTML5 web app实现手动页面滑屏效果
现在很流行在H5页面滑屏的效果,特别是在微信浏览器窗口中,几乎很多推广的活动是使用到上下滑屏,一开始和前端的同事一起合作写滑屏效果花费了很多的时间,而且写出来的页面在浏览器的兼容上踩了很多坑,于是果断 ...
android滑屏效果,Android使用ViewFlipper和GestrueDetector共同实现滑屏效果实例
本文实例讲述了Android使用ViewFlipper和GestrueDetector共同实现滑屏效果.分享给大家供大家参考,具体如下: 关于GestureDetector的相关知识,前面已经介绍过了 ...
Qt 触屏研究-部分控件实现滑屏效果
上一篇博客是对手势操作的一些研究,这一篇主要是处理在触屏上实现控件类似手机的那种滑动效果.在网上查询资料可知qt有这样的属性. 现在我测试的两个控件是QTableWidget和QTextEdit两个比 ...
android滑屏设计规范,Android使用ViewFlipper和GestrueDetector共同实现滑屏效果实例
本文实例讲述了Android使用ViewFlipper和GestrueDetector共同实现滑屏效果.分享给大家供大家参考,具体如下: 关于GestureDetector的相关知识,前面已经介绍过了 ...
实现手机左右滑屏效果
最近,在做一个手机端的小软件中,用到了一个左右滑屏的效果,通过一个插件Swiper就可以轻松实现. Swiper中文网:http://www.swiper.com.cn/demo/index.html ...

[QML开发笔记]-QML滑屏效果

[QML开发笔记]-QML滑屏效果

[QML开发笔记]-QML滑屏效果相关推荐

最新文章

热门文章