a {
anchors.fill: parent;
onClicked: {
wrapper.ListView.view.currentIndex = index;
blender.mode = name;
}
}
}
highlight: Rectangle {
width: parent.width;
color: "lightblue";
}
model: modesModel;
}
}
Image {
id: bug;
anchors.top: blendLabel.bottom;
anchors.topMargin: 10;
anchors.left: blendModes.right;
anchors.leftMargin: 10;
source: "bug.jpg";
sourceSize: Qt.size(300, 300);
smooth: true;
visible: false;
}
Image {
id: bufferFly;
source: "butterfly.png";
sourceSize: Qt.size(300, 300);
smooth: true;
visible: false;
}
Blend {
id: blender;
source: bug;
anchors.fill: bug;
foregroundSource: bufferFly;
mode: "subtract";
}
ListModel {
id: modesModel;
ListElement {
name: "subtract";
}
ListElement {
name: "normal";
}
ListElement {
name: "addition";
}
ListElement {
name: "average";
}
ListElement {
name: "colorBurn";
}
ListElement {
name: "color";
}
ListElement {
name: "colorDodge";
}
ListElement {
name: "darken";
}
ListElement {
name: "darkerColor";
}
ListElement {
name: "difference";
}
ListElement {
name: "divide";
}
ListElement {
name: "exclusion";
}
ListElement {
name: "hardLight";
}
ListElement {
name: "hue";
}
ListElement {
name: "lighten";
}
ListElement {
name: "lighterColor";
}
ListElement {
name: "lightness";
}
ListElement {
name: "multiply";
}
ListElement {
name: "negation";
}
ListElement {
name: "saturation";
}
ListElement {
name: "screen";
}
ListElement {
name: "softLight";
}
}
}
简单的分析一下代码。
返回
图 1 右上角有一个 “Back” 按钮，点击后会发射一个 back() 信号。 back 信号用来通知我们在“Qt Quick里的图形效果（1）”中提到的 main.qml ：用户要从当前示例返回了。 main.qml 收到 back 信号时，会销毁动态创建的示例组件。
以后我们看到 ColorExample 等等针对某类效果设计的示例，都使用同一种策略。
混合
混合模式列表使用 ListView 的展示，ListElement 只有一个角色――name，它的值就是混合模式的名字。当用户点击列表中的某个条目时， delegate 的 MouseArea 的 onClicked 信号处理器改变 Blend 元素的 mode 属性。
好了，这次就到这里，每种混合模式效果如何，还请运行示例实际看一下。下次我们会介绍颜色（Color）效果。
博客之星评选，点击投我一票，谢谢。投过了也可以点哦，每天都可以投投一票。
--------
回顾一下我的Qt Quick系列文章：
Qt Quick 简介QML 语言基础Qt Quick 之 Hello World 图文详解Qt Quick 简单教程Qt Quick 事件处理之信号与槽Qt Quick事件处理之鼠标、键盘、定时器Qt Quick 事件处理之捏拉缩放与旋转
Qt Quick 组件与对象动态创建详解
Qt Quick 布局介绍Qt Quick 之 QML 与 C++ 混合编程详解Qt Quick 图像处理实例之美图秀秀（附源码
下载）Qt Quick 之 PathView 详解Qt Quick实例之挖头像Qt Quick综合实例之文件查看器Qt Quick调试之显示代码行号Qt Quick实现的涂鸦程序Qt Quick播放GIF动画Qt Quick 中的 drag and drop（拖放）Qt Quick里的AnimatedSprite的用法Qt Quick里的粒子
系统Qt Quick实现的疯狂算数游戏Qt Quick里的图形效果（Graphical Effects）