QT之滑动切换UI框架

这篇具有很好参考价值的文章主要介绍了QT之滑动切换UI框架。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

简介

使用QT制作一个UI图片切换框架。
思路:主要通过移动像素坐标差值来判断方向,左上角坐标为(0,0),右加左减,松开减去按压时的横坐标大于0则右移,否则左移。

代码展示

#define X_Threshold_Direction          4       //X方向移动量
#define Y_Threshold_Direction          40      //Y方向移动量

添加点击事件

this->installEventFilter(this);     //设置点击事件

点击事件实现

bool MainWindow::eventFilter(QObject *watch, QEvent *evn)
{
    static int press_x_value;     //点击时屏幕的横坐标
    static int press_y_value;     //点击时屏幕的纵坐标
    static int relea_x_value;     //松开时屏幕的横坐标
    static int relea_y_value;     //松开时屏幕的纵坐标

    QMouseEvent *event = static_cast<QMouseEvent *>(evn);
    //获取点击鼠标(手指)时的坐标
    if (event->type() == QEvent::MouseButtonPress)
    {
        press_x_value = event->globalX();
        press_y_value = event->globalY();
    }
    //获取松开鼠标(手指)时的坐标
    if(event->type() == QEvent::MouseButtonRelease)
    {
        relea_x_value = event->globalX();
        relea_y_value = event->globalY();
    }
    //对鼠标(手指)滑动的方向进行判断(右滑)
    if((relea_x_value - press_x_value) > X_Threshold_Direction && event->type() == QEvent::MouseButtonRelease && qAbs(relea_y_value - press_y_value) < Y_Threshold_Direction)
    {
        if (index == 4)
        {
            index = 1;
        }
        else
        {
            index++;
        }
        this->setStyleSheet(QString("border-image: url(:/image/%1.jpg);").arg(index));        //切换图片
        qDebug() << "right move";
    }
    //对鼠标(手指)滑动的方向进行判断(左滑)
    if((press_x_value - relea_x_value) > X_Threshold_Direction && event->type() == QEvent::MouseButtonRelease && qAbs(relea_y_value - press_y_value) < Y_Threshold_Direction)
    {
        if(index == 1)
        {
            index = 4;
        }
        else
        {
            index--;
        }
        this->setStyleSheet(QString("border-image: url(:/image/%1.jpg);").arg(index));        //切换图片
        qDebug() << "left move";
    }

    return QWidget::eventFilter(watch, evn);
}

效果如下

video文章来源地址https://www.toymoban.com/news/detail-561178.html

到了这里,关于QT之滑动切换UI框架的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • QT桌面(实现界面的滑动切换)

    在ARM Linux中使用QT如何实现滑动翻页切换界面的效果呢?在ARM中是没有自带的鼠标的,那么我们如何实现滑动翻页呢?经过测试发现在ARM中运行QT程序也是可以通过重写鼠标事件来捕获触屏动作的,在ARM中滑动屏幕被定义成了鼠标左键事件,那么这样就有思路了, 重写鼠标事

    2024年02月06日
    浏览(30)
  • 【QT开发(5)】0919-QT里面新增ui类,新增使用opencv读取图片的普通类,在ui类中显示图片

    1、Qt Creator快速入门_第三版__霍亚飞编著 2、《Qt+OpenCV显示图片(Mat转QImage然后显示在QLabel上)》 https://gitee.com/hiyanyx/qt5.14-cpp_-empty_-project/tree/Study2023-section5/ git分支“Study2023-section5” 新增ui类 新增使用opencv读取图片的普通类 为了更加方便,可在QT 中添加普通类,这样会自动生

    2024年02月07日
    浏览(33)
  • 【QT开发专题-天气预报】16.更新 UI 界面

    本专栏将会在未来 4 个月内,完成以下几个 Qt 项目: 《天气预报》 《文本编辑器》 《俄罗斯方块》 《绘图板》 《网络聊天室》 《串口助手》 完成时间预计在 2022-12-31 ,文章数目在 50 篇左右,更新完毕之后,价格恢复到 ¥299 专栏优势: 每个项目都是从零新建工程开始

    2023年04月08日
    浏览(53)
  • QT QPluginLoader 插件开发 ui界面打包dll

     将项目模块化,每一个模块单独开发,模块的组成形成最终的主程序, 点击左侧按钮就会弹出对应的插件应用,每一个子窗口都是单独的dll 插件, 灵活,升级,下载,卸载。 效果:     打开QT Creator 新建插件开发项目  下一步后选择 Qt Plugin 开发 添加依赖库,在.pro里  

    2024年02月11日
    浏览(35)
  • QGIS开发五:VS使用QT插件创建UI界面

    前面我们说了在创建项目时创建的是一个空项目,即不使用 Qt 提供的综合开发套件 Qt Creator,也不使用 Qt Visual Studio Tools 这类工具。 但是后面发现,如果我想要有更加满意的界面布局,还是要自己写一个UI文件,如果不使用QT插件,在VS中导入自己的UI文件编译起来不是那么容

    2024年02月13日
    浏览(44)
  • QT学习开发笔记(项目实战之智能家居物联 UI 界面开发 )

    项目路径为 4/01_smarthome/01_smarthome/01_smarthome.pro,先看项目界面。项目界面如 下,采用暗黑主题设计,结合黄色作为亮色,让用户一目了然。界面笔者从一些智能家居界面 中找到灵感的,编写设计完成的效果不错!请自行查阅源码,掌握了本教程前面第七章的内容, 就可以理

    2024年02月16日
    浏览(40)
  • 【Qt】使用Qt designer(Qt设计师)以及uic工具将ui文件转换到C++代码进行界面开发

    【Qt】编写第一个Qt程序,使用Cmake编译并运行 Qt Designer是一个用于创建Qt应用程序用户界面的图形化界面设计器。它是Python GUI开发的一个重要工具,可以帮助用户快速创建具有丰富功能的用户界面。 打开终端输入以下代码 点击创建 拖一些组件进来,点击保存 得到一个后缀为

    2024年02月16日
    浏览(39)
  • QGIS二次开发六:VS不借助QT插件创建UI界面

    上一篇博客我们说了在VS中如何使用QT插件来创建UI界面,但是我们二次开发QGIS的第一篇博客就说了,最好使用OSGeo4W中自动下载的QT进行QGIS二次开发,这样兼容性是最好的,那么该如何在VS中不使用外部安装的QT以及QT的VS插件情况下进行UI界面的创建和使用呢? 如果你仔细看完

    2024年02月13日
    浏览(29)
  • 12-2_Qt 5.9 C++开发指南_自定义Qt Designer 插件(UI 设计器自定义界面组件的 Widget 插件,直接安装到 UI设计器组件面板里,如同 Qt 自带的界面设计组件一样)

    上篇使用提升法(promotion)来创建自定义组件,本篇为 UI 设计器设计自定义界面组件的 Widget 插件,直接安装到 UI设计器的组件面板里,如同 Qt 自带的界面设计组件一样使用,在设计时就能看到组件的实际显示效果,只是编译和运行时需要使用到插件的动态链接库 (Windows 平台上

    2024年02月05日
    浏览(37)
  • vs+qt开发中,报错找不到ui_QtWidgetsApplication1.h文件

    添加包含目录和库目录以后如果还是不行,我自己发现了把Qt project Settings里show in build log改成是就好了。 但是这样以后每次修改ui的时候需要打开属性把Qt project Settings里show in build log改成否然后应用一下再改成是,你添加的控件又可以识别到了。

    2024年01月18日
    浏览(54)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包