有兴趣的开发人员能够參阅连接http://doc.qt.io/qt-5/qtgraphicaleffects-qmlmodule.html来深度学习Qt对Graphics方面的处理。

在今天的这篇文章中。我们来使用OpacityMask做一个小小的样例来抛砖引玉看看Qt对我们的图像的处理。

详细的样例在Qt的官方站点上能够看到。因为一些原因,在官方站点上下载的例程中的文件并不能被使用,须要做一些的处理才干够。

以下,我们直接来把我们的样例展示给大家:

  1. import QtQuick 2.0
  2. import Ubuntu.Components 1.1
  3. import QtGraphicalEffects 1.0
  4.  
  5. /*!
  6. \brief MainView with a Label and Button elements.
  7. */
  8.  
  9. MainView {
  10. // objectName for functional testing purposes (autopilot-qt5)
  11. objectName: "mainView"
  12.  
  13. // Note! applicationName needs to match the "name" field of the click manifest
  14. applicationName: "mask.liu-xiao-guo"
  15.  
  16. /*
  17. This property enables the application to change orientation
  18. when the device is rotated. The default is false.
  19. */
  20. //automaticOrientation: true
  21.  
  22. // Removes the old toolbar and enables new features of the new header.
  23. useDeprecatedToolbar: false
  24.  
  25. width: units.gu(60)
  26. height: units.gu(85)
  27.  
  28. Page {
  29. title: i18n.tr("mask")
  30.  
  31. Flickable {
  32. anchors.fill: parent
  33. contentHeight: mypics.childrenRect.height
  34.  
  35. Item {
  36. id: mypics
  37. width: parent.width
  38. height: units.gu(80)
  39.  
  40. Image {
  41. id: bug
  42. height: parent.height/2
  43. width: height
  44. source: "images/bug.png"
  45. sourceSize: Qt.size(parent.width, parent.height)
  46. smooth: true
  47. visible: false
  48. }
  49.  
  50. Image {
  51. id: bug1
  52. height: parent.height/2
  53. width: height
  54. source: "images/bug.png"
  55. anchors.top: bug.bottom
  56. anchors.topMargin: units.gu(1)
  57. sourceSize: Qt.size(parent.width, parent.height)
  58. smooth: true
  59. visible: false
  60. }
  61.  
  62. Rectangle {
  63. id: mask
  64. anchors.margins: 10
  65. width: 65
  66. height: 65
  67. color: "black"
  68. radius: width/2
  69. clip: true
  70. visible: false
  71. }
  72.  
  73. Image {
  74. id: mask1
  75. height: units.gu(40)
  76. width: height
  77. source: "images/bufferfly.png"
  78. sourceSize: Qt.size(parent.width, parent.height)
  79. smooth: true
  80. visible: false
  81. }
  82.  
  83. OpacityMask {
  84. anchors.fill: bug
  85. source: bug
  86. maskSource: mask
  87. }
  88.  
  89. OpacityMask {
  90. anchors.fill: bug1
  91. source: bug
  92. maskSource: mask1
  93. }
  94. }
  95. }
  96. }
  97. }

在这里。我们使用了Image来展示图片,可是。他们并非可见的(visible = false)。我们能够通过一个掩膜mask,在mask上值为非透明的地方能够显示出图像。

能够通过OpacityMask来使得它们能够显示。

我们的mask图片bufferfly.png例如以下:

bug.png的原图为:

执行我们的例程,效果图例如以下:

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" width="200" height="300" alt="">  

源代码在: https://github.com/liu-xiao-guo/mask

利用QtGraphicalEffects来使得自己的图像显示更加生动的更多相关文章

  1. UFLDL教程之(三)PCA and Whitening exercise

    Exercise:PCA and Whitening 第0步:数据准备 UFLDL下载的文件中,包含数据集IMAGES_RAW,它是一个512*512*10的矩阵,也就是10幅512*512的图像 ( ...

  2. Java应用发布后,需要关注的7个性能指标

    在某个重大发布之后,都需要记录相应的指标,本文介绍了最重要的几个 Java 性能指标,包括响应时间和平均负载等.为理解应用程序在生产环境中如何运行,就需要遵循一些 Java 性能指标. 在以前,当软件 ...

  3. Java 应用发布后,需要关注的7个性能指标

    在某个重大发布之后,都需要记录相应的指标,本文介绍了最重要的几个 Java 性能指标,包括响应时间和平均负载等.为理解应用程序在生产环境中如何运行,就需要遵循一些 Java 性能指标. 在以前,当软件 ...

  4. 各团队对《t铁大导航》评价及我组回复

    组名 对我们组的建议 我组回复 (1)跑男 你们的导航前期要做到什么样的程度呢?其实我一直是很期待你们完成时我能够用你们的导航来感受一下咱们铁大校园风情.你们用了数据结构算法来找最短路径,那你们能不能 ...

  5. 利用预渲染加速iOS设备的图像显示

    最近在做一个UITableView的例子,发现滚动时的性能还不错.但来回滚动时,第一次显示的图像不如再次显示的图像流畅,出现前会有稍许的停顿感.于是我猜想显示过的图像肯定是被缓存起来了,查了下文档后发 ...

  6. 深入GDI图像显示

    摘  要:本文首先给出了一种结合了DIB和DDB两种位图优点的图像显示方法,其次对GDI函数的高级应用,如透明位图显示.图像旋转显示.图像镜像显示进行了研究. 关键词:GDI图像显示,特殊GDI函数的 ...

  7. 基于FPGA的OLED真彩色动态图像显示的实现

    源:基于FPGA的OLED真彩色动态图像显示的实现 作为第3代显示器,有机电致发光器件(Organic Light Emitting Diode,OLED)由于其主动发光.响应快.高亮度.全视角.直流 ...

  8. C#图像显示实现拖拽、锚点缩放功能【转】

    1.图像拖拽 核心步骤: ①新建Point类型全局变量mouseDownPoint,记录拖拽过程中鼠标位置: ②MouseDown事件记录Cursor位置: ③MouseMove事件计算移动矢量,并更 ...

  9. c# 利用AForge和百度AI开发实时人脸识别

    baiduAIFaceIdentify项目是C#语言,集成百度AI的SDK利用AForge开发的实时人脸识别的小demo,里边包含了人脸检测识别,人脸注册,人脸登录等功能 人脸实时检测识别功能 思路是 ...

随机推荐

  1. js判断是否包含指定字符串

      CreateTime--2017年2月28日09:37:06Author:Marydonjs判断是否包含指定字符串 var inputValue = "thunder://piaohua ...

  2. DBCP(一)数据源配置文件

    DBCP是Apache开发的数据源API,使用的话需要导入dbcp jar包.collections jar包.pool jar包. 其数据源匹配的配置文件格式如下:   #连接设置 driverCl ...

  3. MySQL 添加外键约束,不检查现有数据

    这可能是MySQL在InnoDB中设置了foreign key关联,造成无法更新或删除数据.可以通过设置FOREIGN_KEY_CHECKS变量来避免这种情况. SET FOREIGN_KEY_CHE ...

  4. Redis总结(七)Redis运维常用命令(转载)

    redis 服务器端命令 redis 127.0.0.1:6380> time  ,显示服务器时间 , 时间戳(秒), 微秒数 1) "1375270361" 2) &quo ...

  5. HDU 4280Island Transport(网络流之最大流)

    题目地址:pid=4280">http://acm.hdu.edu.cn/showproblem.php? pid=4280 这个题是一个纯最大流模板题..就是用来卡时间的.. 还好我 ...

  6. XMLDocument转为String 摘录

    public static string FormatXmlString(string xmlString) { XmlDocument document = new XmlDocument(); d ...

  7. js 根据title从下级往上级查找

    var menuData = [{ name: 'manage', title: '测试1', icon: 'home', }, { title: '测试2', name: 'car-parent', ...

  8. mac 系统使用macaca inspector 获取iphone真机应用元素

    1.安装brew 软件包管理工具:/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/inst ...

  9. 0070 过滤器调用Spring的bean操作数据库

    假设有这样的需求:将用户每次请求的ip.时间.请求.user-agent存入数据库,很明显可以用过滤器实现,在过滤器中获取到这些数据调用mybatis的mapper存入数据库,但问题来了:mybati ...

  10. python判断一个对象是否可迭代

    如何判断一个对象是可迭代对象? 方法是通过collections模块的Iterable类型判断: >>> from collections import Iterable >& ...