10.qml使用 shadereffect 实现高斯模糊

目录

  • 高斯模糊
    • sigma获取
    • 加权均值获取
  • 高斯二维公式实现
  • 高斯一维公式实现
  • 使用
  • 总结

高斯模糊

高斯模糊应用领域我就不过多讲解,想了解自己去了解
高斯模糊有
一维公式
在这里插入图片描述

二维公式
在这里插入图片描述

当然我们图像是二维的
但是实际上二维公式用于计算那是消耗大量的算力的,所以往往
通过执行水平方向的一维 跟 垂直方向上的一维公式进行处理的

废话不多说,qml怎么实现搞图像处理效果呢?
import QtGraphicalEffects 1.15
直接使用官方提供的GaussianBlur就可以了, 但是本章不是将怎么用这个
而是怎么用shadereffect 实现 自己的MGaussianBlur.qml

通过设置其属性
source要处理的对象,radius模糊半径

sigma获取

 sigma = (radius * 2 + 1)  *0.5

加权均值获取

[(模糊半径*2 + 1)上的每个像素  *  各自权重)]  的  累加值  / 总权重值

高斯二维公式实现

MGaussianBlur.qml

import QtQuick 2.12
import QtQuick.Window 2.12

Item {
    id: control

    property int radius: 2
    property var source
    property color color: "#00ff00"
    property bool cache: true //缓存
    property bool alphaOnly: false //只用透明度, 则color生效
    property bool surround: true //环绕对象

    // 缓存输入对象
    ShaderEffectSource {
        id: proxySource
        sourceItem: control.source
        hideSource: false
        smooth: true
        visible: false
        sourceRect: surround? Qt.rect(-control.radius,
                                      -control.radius,
                                      parent.width + 2* control.radius,
                                      parent.height+ 2* control.radius):
                              Qt.rect(0, 0, 0, 0)
    }


    // 缓存模糊后对象
    ShaderEffectSource{
        anchors.fill: blur
        sourceItem: blur
        hideSource: visible
        smooth: true
        visible: cache
    }

    ShaderEffect{
        id: blur
        x: surround? -control.radius: 0
        y: surround? -control.radius: 0
        width: surround? parent.width + 2*control.radius: parent.width
        height: surround? parent.height + 2*control.radius: parent.height

        property Item source: proxySource
        property real qt_Radius: control.radius //扩散半径
        property real qt_sigma: (2.0 * control.radius + 1.0) * 0.5
        property vector2d qt_Size : Qt.vector2d(width,height);
        property real qt_pi: Math.PI
        property bool qt_AlphaOnly: control.alphaOnly
        property vector4d qt_Color: Qt.vector4d(control.color.r,
                                                control.color.g,
                                                control.color.b,
                                                control.color.a)

        fragmentShader: "
            #define pow2(x) (x * x)
            varying vec2 qt_TexCoord0;
            uniform sampler2D source;
            uniform float qt_Radius;
            uniform float qt_sigma;
            uniform float qt_pi;
            uniform vec2 qt_Size;
            uniform vec4 qt_Color;
            uniform bool qt_AlphaOnly;

            float gaussian(vec2 i) {
                return 1.0 / (qt_pi * pow2(qt_sigma)) * exp(-((pow2(i.x) + pow2(i.y)) / (2.0 * pow2(qt_sigma))));
            }
            void main() {
                vec4 color;
                float total = 0.0;
                float weight;
                vec2 offset;
                vec2 scale = vec2(1.0) / qt_Size;
                vec2 texCoord = qt_TexCoord0;
                for (float x = -qt_Radius; x <= qt_Radius; x++) {
                    for (float y = -qt_Radius; y <= qt_Radius; y++) {
                        offset = vec2(x,y);
                        weight = gaussian(offset);
                        color += texture2D(source, texCoord + offset * scale) * weight;
                        total += weight;
                    }
                }
                color = color / total;
                if(qt_AlphaOnly && color != vec4(0.0)){
                    gl_FragColor = vec4(qt_Color.rgb,color.a);
                }else{
                    gl_FragColor = color;
                }

            }
                "
    }



}

高斯一维公式实现

在这里插入图片描述

import QtQuick 2.12
import QtQuick.Window 2.12

Item {
    id: control

    property int radius: 2
    property var source
    property color color: "#00ff00"
    property bool cache: true //缓存
    property bool alphaOnly: false //只用透明度, 则color生效
    property bool surround: true //环绕对象


    // 缓存输入对象
    ShaderEffectSource {
        id: proxySource
        sourceItem: control.source
        hideSource: false
        smooth: true
        visible: false
        sourceRect: surround? Qt.rect(-control.radius,
                                      -control.radius,
                                      parent.width + 2* control.radius,
                                      parent.height+ 2* control.radius):
                              Qt.rect(0, 0, 0, 0)
    }

    // 缓存模糊后对象
    ShaderEffectSource{
        anchors.fill: vertical_Blur
        sourceItem: vertical_Blur
        hideSource: visible
        smooth: true
        visible: cache
    }

    ShaderEffect{
        id: horizontal_Blur
        x: surround? -control.radius: 0
        y: surround? -control.radius: 0
        width: surround? parent.width + 2*control.radius: parent.width
        height: surround? parent.height + 2*control.radius: parent.height

        property Item source: proxySource
        property real qt_Radius: control.radius //扩散半径
        property real qt_sigma: (2.0 * control.radius + 1.0) * 0.5
        property vector2d qt_Size : Qt.vector2d(width,height);
        property real qt_pi: Math.PI
        property bool qt_AlphaOnly: control.alphaOnly
        property vector2d qt_Direction: Qt.vector2d(1.0,0.0)
        property vector4d qt_Color: Qt.vector4d(control.color.r,
                                                control.color.g,
                                                control.color.b,
                                                control.color.a)

        layer.enabled: true
        layer.smooth: true
        visible: false
        blending: false

        fragmentShader: "
            #define pow2(x) (x * x)
            varying vec2 qt_TexCoord0;
            uniform sampler2D source;
            uniform float qt_Radius;
            uniform float qt_sigma;
            uniform float qt_pi;
            uniform vec2 qt_Size;
            uniform vec4 qt_Color;
            uniform bool qt_AlphaOnly;
            uniform vec2 qt_Direction;

            float gaussian(float i) {
                return 1.0 / sqrt(qt_pi * pow2(qt_sigma)) * exp(-pow2(i) / (2.0 * pow2(qt_sigma)));
            }

            void main() {
                vec4 color;
                float total = 0.0;
                float weight;
                float offset;
                vec2 scale = vec2(1.0) / qt_Size;
                vec2 texCoord = qt_TexCoord0;

                weight = gaussian(0.0);
                color += texture2D(source, texCoord) * weight;
                total += weight;

                for (float x = 1.0; x <= qt_Radius; ++x) {
                    offset = x;
                    weight = gaussian(offset);
                    color += texture2D(source, texCoord + offset * scale * qt_Direction ) * weight;
                    color += texture2D(source, texCoord - offset * scale * qt_Direction ) * weight;
                    total += weight * 2.0;
                }
                color = color / total;
                gl_FragColor = color;

            }
                "
    }

    ShaderEffect{
        id: vertical_Blur
        x: surround? -control.radius: 0
        y: surround? -control.radius: 0
        width: surround? parent.width + 2*control.radius: parent.width
        height: surround? parent.height + 2*control.radius: parent.height

        property Item source: horizontal_Blur
        property real qt_Radius: control.radius //扩散半径
        property real qt_sigma: (2.0 * control.radius + 1.0) * 0.5
        property vector2d qt_Size : Qt.vector2d(width,height);
        property real qt_pi: Math.PI
        property bool qt_AlphaOnly: control.alphaOnly
        property vector2d qt_Direction: Qt.vector2d(0.0,1.0)
        property vector4d qt_Color: Qt.vector4d(control.color.r,
                                                control.color.g,
                                                control.color.b,
                                                control.color.a)

        fragmentShader: "
            #define pow2(x) (x * x)
            varying vec2 qt_TexCoord0;
            uniform sampler2D source;
            uniform float qt_Radius;
            uniform float qt_sigma;
            uniform float qt_pi;
            uniform vec2 qt_Size;
            uniform vec4 qt_Color;
            uniform bool qt_AlphaOnly;
            uniform vec2 qt_Direction;

            float gaussian(float i) {
                return 1.0 / sqrt(qt_pi * pow2(qt_sigma)) * exp(-pow2(i) / (2.0 * pow2(qt_sigma)));
            }

            void main() {
                vec4 color;
                float total = 0.0;
                float weight;
                float offset;
                vec2 scale = vec2(1.0) / qt_Size;
                vec2 texCoord = qt_TexCoord0;

                weight = gaussian(0.0);
                color += texture2D(source, texCoord) * weight;
                total += weight;

                for (float x = 1.0; x <= qt_Radius; ++x) {
                    offset = x;
                    weight = gaussian(offset);
                    color += texture2D(source, texCoord + offset * scale * qt_Direction ) * weight;
                    color += texture2D(source, texCoord - offset * scale * qt_Direction ) * weight;
                    total += weight * 2.0;
                }
                color = color / total;
                if(qt_AlphaOnly && color != vec4(0.0)){
                    gl_FragColor = vec4(qt_Color.rgb,color.a) * qt_Color.a;
                }else{
                    gl_FragColor = color;
                }

            }
                "
    }



}


使用

import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Window 2.12

Window {
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")
    Column{

        spacing: 10

        Row{
            SpinBox{
                onValueModified: {
                    blur.radius = value
                }
            }
        }

        Row{
            Image {
                id: img
                width: 100
                height: 100
                source: "qrc:/firefox-logo.svg"

            }
            MGaussianBlur{
                id: blur
                width: 100
                height: 100
                source: img
                radius: 4
                //alphaOnly: true
            }
        }

    }


}

总结

复杂我的代码,电脑应该是正常使用的,但是qt使用的场景是多变的
所以,如果有遇到不同硬件渲染引擎的问题的可以分析到这里

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/936808.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

从 CephFS 到 JuiceFS:同程旅游亿级文件存储平台构建之路

随着公司业务的快速发展&#xff0c;同程旅行的非结构化的数据突破 10 亿&#xff0c;在 2022 年&#xff0c;同程首先完成了对象存储服务的建设。当时&#xff0c;分布式文件系统方面&#xff0c;同程使用的是 CephFS&#xff0c;随着数据量的持续增长&#xff0c;CephFS 的高…

相机测距原理

基础概念的回顾 焦距的定义 焦距是指透镜或镜头的光学中心&#xff08;通常是透镜的几何中心&#xff09;到其焦点的距离。 焦点是光线的交点&#xff0c;它指的是透镜或镜头聚焦所有入射光线后汇聚的位置。焦点的位置与透镜的曲率和光线的入射角度相关。就是说所有光线经过…

AOF和RDB【Redis持久化篇】

文章目录 1.什么是持久化&#xff1f;2.RDB3.AOF 1.什么是持久化&#xff1f; Redis是跑在内存里的&#xff0c;当程序重启或者服务器崩溃&#xff0c;数据就会丢失&#xff0c;如果业务场景希望重启之后数据还在&#xff0c;就需要持久化&#xff0c;即把数据保存到可永久保存…

2024-12-14 学习人工智能的Day35 卷积神经网络.阶段项目

卷积神经网络项目实现 关于项目实现的文档说明书&#xff0c;三个要素&#xff1a;数据、模型、训练 1、项目简介。 1.1 项目名称 ​ 基于CNN实现扑克牌花色的小颗粒度分类 1.2 项目简介 ​ 该项目旨在通过卷积神经网络&#xff08;CNN&#xff09;实现扑克的小颗粒度分类…

【鸿蒙实战开发】数据的下拉刷新与上拉加载

本章介绍 本章主要介绍 ArkUI 开发中最常用的场景下拉刷新, 上拉加载&#xff0c;在本章中介绍的内容在实际开发过程当中会高频的使用,所以同学们要牢记本章的内容。下面就让我们开始今天的讲解吧&#xff01; List 组件 在 ArkUI 中List容器组件也可以实现数据滚动的效果&a…

MR30分布式 IO 模块:硅晶行业电池片导片机的智能 “心脏”

硅晶产业作为全球能源和电子领域的基石&#xff0c;其生产规模庞大且工艺复杂。从硅料的提纯、拉晶&#xff0c;到硅片的切割、电池片的制造&#xff0c;每一个环节都要求高精度与高稳定性。在电池片生产环节&#xff0c;导片机承担着硅片传输与定位的重要任务&#xff0c;其运…

MAC虚拟机上安装WDA环境

MAC虚拟机上安装WDA环境 一、MAC虚拟机切换root权限二、macOS上安装xcode若你的macOS系统可以在appstore下载安装若你安装的macOS系统版本太低&#xff0c;无法在appstore上安装xcode 三、macOS上安装WebDriverAgent四、使用xcode配置WDA安装到手机上高版本系统支持 一、MAC虚拟…

个人ffmpeg笔记(一)

环境安装 QT环境安装 运行qt…run安装 下载地址&#xff1a;https://download.qt.io/archive/qt/ 下载地址&#xff1a;https://download.qt.io/archive/qt/5.12/5.12.10/ sudo apt install --reinstall libxcb-xinerama0 解决xcb问题 Ubuntu16.04打开Qt显示/home/user/.co…

【网络】传输层协议UDP/TCP网络层IP数据链路层MACNAT详解

主页&#xff1a;醋溜马桶圈-CSDN博客 专栏&#xff1a;计算机网络原理_醋溜马桶圈的博客-CSDN博客 gitee&#xff1a;mnxcc (mnxcc) - Gitee.com 目录 1.传输层协议 UDP 1.1 传输层 1.2 端口号 1.3 UDP 协议 1.3.1 UDP 协议端格式 1.3.2 UDP 的特点 1.3.3 面向数据报 1…

WordPress插件 Download-block-plugin下载按钮图标美化

WordPress插件 Download-block-plugin下载按钮图标美化

分布式 漏桶算法 总结

前言 相关系列 《分布式 & 目录》《分布式 & 漏桶算法 & 总结》《分布式 & 漏桶算法 & 问题》 概述 简介 LBA Leaky Bucket Algorithm 漏桶算法是一种流行于网络通信领域的流量控制/频率限制算法。漏桶算法的核心原理是通过一个概念上的“漏桶”来…

04面向对象篇(D4_OOT(D1_OOT - 面向对象测试))

目录 一、 面向对象影响测试 1. 封装性影响测试 2. 继承性影响测试 3. 多态性影响测试 二、 面向对象测试模型 三、 面向对象分析测试 1. 对象测试 2. 结构测试 3. 主题测试 4. 属性和实例关联测试 5. 服务和消息关联测试 四、面向对象设计测试 1. 对认定类测试 …

群控系统服务端开发模式-应用开发-前端操作记录功能展示

一、创建操作记录展示视图 在根目录下src文件夹下views文件夹下permission文件夹下创建token文件夹&#xff0c;在token文件夹下&#xff0c;新建index.vue文件&#xff0c;代码如下&#xff1a; <template><div class"app-container"><div class&qu…

【AIGC】如何高效使用ChatGPT挖掘AI最大潜能?26个Prompt提问秘诀帮你提升300%效率的!

还记得第一次使用ChatGPT时&#xff0c;那种既兴奋又困惑的心情吗&#xff1f;我是从一个对AI一知半解的普通用户&#xff0c;逐步成长为现在的“ChatGPT大神”。这一过程并非一蹴而就&#xff0c;而是通过不断的探索和实践&#xff0c;掌握了一系列高效使用的技巧。今天&#…

电容Q值、损耗角、应用

电容发热的主要原因&#xff1a;纹波电压 当电容两端施加纹波电压时&#xff0c;电容承受的是变化的电压&#xff0c;由于电容内部存在寄生电阻&#xff08;ESR&#xff09;和寄生电感&#xff08;ESL&#xff09;.因此电容会有能量损耗&#xff0c;从而产生热量&#xff0c;这…

适配器模式的理解和实践

在软件开发中&#xff0c;我们经常遇到需要将一个类的接口转换成客户端所期望的另一种接口的情况。这种接口不匹配问题会导致类之间的不兼容&#xff0c;使得原本可以协同工作的两个类无法在一起工作。为了解决这一问题&#xff0c;适配器模式&#xff08;Adapter Pattern&…

大数据分析案例-基于梯度提升决策树回归算法构建医疗保险费用预测模型

&#x1f935;‍♂️ 个人主页&#xff1a;艾派森的个人主页 ✍&#x1f3fb;作者简介&#xff1a;Python学习者 &#x1f40b; 希望大家多多支持&#xff0c;我们一起进步&#xff01;&#x1f604; 如果文章对你有帮助的话&#xff0c; 欢迎评论 &#x1f4ac;点赞&#x1f4…

轩凯生物被警示,财务内控不规范,华泰证券又被处罚

作者&#xff1a;Tracy 来源&#xff1a;IPO魔女 11月21日&#xff0c;南京轩凯生物科技股份有限公司&#xff08;简称“轩凯生物”&#xff09;被交易所下达书面警示的自律监管函。同时其保荐机构华泰联合证券和会计师事务所天衡&#xff0c;均受到监管处罚。这是今年来&…

IoTDB 常见问题 QA 第二期

关于 IoTDB 的 Q&A IoTDB Q&A 第二期来啦~我们将定期汇总社区讨论频繁的问题&#xff0c;并展开进行详细回答&#xff0c;通过积累常见问题“小百科”&#xff0c;方便大家使用 IoTDB。 Q1&#xff1a;集群扩容方法 问题 问题1&#xff1a;当 IoTDB 集群的存储占用达到…

RT-DETR融合[CVPR2024]Starnet中的star block特征提取模块

RT-DETR使用教程&#xff1a; RT-DETR使用教程 RT-DETR改进汇总贴&#xff1a;RT-DETR更新汇总贴 《Rewrite the Stars》 一、 模块介绍 论文链接&#xff1a;https://arxiv.org/abs/2403.19967 代码链接&#xff1a;https://github.com/ma-xu/Rewrite-the-Stars/tree/main 论…