首页 > 其他分享 >鸿蒙Next模糊接口梳理

鸿蒙Next模糊接口梳理

时间:2024-11-17 22:20:07浏览次数:1  
标签:鸿蒙 auto 模糊 接口 Next 取色 API 参数

foregroundBlurStyle和backgroundBlurStyle

foregroundBlurStyle(value: BlurStyle, options?: ForegroundBlurStyleOptions)

backgroundBlurStyle(value: BlurStyle, options?: BackgroundBlurStyleOptions)

第一个参数都是模糊材质,用的是鸿蒙系统定制好的一套模糊参数,封装了模糊半径、蒙版颜色、饱和度、亮度四个参数(官方文档上说还封装了一个蒙版透明度参数,但从ArkUIRS的代码上来看其实只有这四个)。

第二个参数虽然类型不一样,一个前景一个背景,但都是继承自BlurStyleOptions,且目前都是只继承了,没有新增/修改任何属性,应该是为了方便后续新增一些差异化的参数而留的。

BlurStyleOptions的参数列表如下:

名称 参数类型 必填 描述
colorMode ThemeColorMode 模糊效果使用的深浅色模式。默认值:ThemeColorMode.SYSTEM
元服务API: 从API version 11开始,该接口支持在元服务中使用。
adaptiveColor AdaptiveColor 模糊效果使用的取色模式。默认值:AdaptiveColor.DEFAULT
元服务API: 从API version 11开始,该接口支持在元服务中使用。
blurOptions11+ BlurOptions 灰阶模糊参数。默认值:grayScale: [0,0]
元服务API: 从API version 12开始,该接口支持在元服务中使用。
scale12+ number 模糊效果程度。默认值:1.0取值范围:[0.0, 1.0]
元服务API: 从API version 12开始,该接口支持在元服务中使用。

具体实现细节:

  • colorMode配合BlurStyle决定一套基础模糊参数——模糊半径、蒙版颜色、饱和度、亮度;
  • 通过scale间接修改上述决定好的基础模糊参数,4种参数每种都会受到影响;
  • 如果colorMode != ThemeColorMode::SYSTEM,则灰阶不生效;
  • adaptiveColor决定是否使用取色模糊,AdaptiveColor.DEFAULT则不使用,直接取基础参数中的蒙版颜色;AdaptiveColor.AVERAGE则是启用取色模糊,将取色区域的颜色平均值作为蒙版颜色,更耗时。
std::shared_ptr<Rosen::RSFilter> CreateRSMaterialFilter(
    const BlurStyleOption& blurStyleOption, PipelineContext* pipeline)
{
    auto blurStyleTheme = pipeline->GetTheme<BlurStyleTheme>();
    if (!blurStyleTheme) {
        LOGW("cannot find theme of blurStyle, create blurStyle failed");
        return nullptr;
    }
    ThemeColorMode colorMode = blurStyleOption.colorMode;
    if (blurStyleOption.colorMode == ThemeColorMode::SYSTEM) {
        colorMode = GetResourceColorMode(pipeline) == ColorMode::DARK ? ThemeColorMode::DARK : ThemeColorMode::LIGHT;
    }
    auto blurParam = blurStyleTheme->GetBlurParameter(blurStyleOption.blurStyle, colorMode);
    CHECK_NULL_RETURN(blurParam, nullptr);
    auto ratio = blurStyleOption.scale;
    auto maskColor = blurParam->maskColor.BlendOpacity(ratio);
    auto radiusPx = blurParam->radius * pipeline->GetDipScale();
#ifndef USE_ROSEN_DRAWING
    auto radiusBlur = SkiaDecorationPainter::ConvertRadiusToSigma(radiusPx) * ratio;
#else
    auto radiusBlur = DrawingDecorationPainter::ConvertRadiusToSigma(radiusPx) * ratio;
#endif
    auto saturation = (blurParam->saturation - 1) * ratio + 1.0;
    auto brightness = (blurParam->brightness - 1) * ratio + 1.0;
    return Rosen::RSFilter::CreateMaterialFilter(radiusBlur, saturation, brightness, maskColor.GetValue(),
        static_cast<Rosen::BLUR_COLOR_MODE>(blurStyleOption.adaptiveColor));
}

backgroundBlurStyle特有的一些逻辑判断:

  • 会跟另一个模糊接口SetBackgroundEffect冲突,同时调用的话,二者只会生效一个;
  • 如果是对窗口设置,则在一定条件下将会不生效。
bool RosenRenderContext::UpdateBlurBackgroundColor(const std::optional<BlurStyleOption>& bgBlurStyle)
{
    if (!bgBlurStyle.has_value()) {
        return false;
    }
    bool blurEnable =
        bgBlurStyle->policy == BlurStyleActivePolicy::ALWAYS_ACTIVE ||  //设置为一直激活
        (bgBlurStyle->policy == BlurStyleActivePolicy::FOLLOWS_WINDOW_ACTIVE_STATE && bgBlurStyle->isWindowFocused);    //设置为需要激活但窗口失焦
    if (bgBlurStyle->isValidColor) {
        if (blurEnable) {
            rsNode_->SetBackgroundColor(GetBackgroundColor().value_or(Color::TRANSPARENT).GetValue());
        } else {
            rsNode_->SetBackgroundColor(bgBlurStyle->inactiveColor.GetValue());
        }
    }
    // 返回false不生效
    return blurEnable;
}

综上可以看出,这两个接口本质是对BlurStyle进行一个扩展,让使用者能够基于系统提供的模板做一些额外的调整,不过总体来说自由度还是有些受限。

foregroundEffect和backgroundEffect

foregroundEffect(options: ForegroundEffectOptions)

backgroundEffect(options: BackgroundEffectOptions)

看上去差不多,实际上天差地别,ForegroundEffectOptions只有radius一个参数;而BackgroundEffectOptions的参数列表则丰富得多,故此处只研究backgroundEffect

backgroundEffect的参数列表如下:

名称 类型 必填 说明
radius number 模糊半径,取值范围:[0, +∞),默认为0。
saturation number 饱和度,取值范围:[0, +∞),默认为1。推荐取值范围:[0, 50]。
brightness number 亮度,取值范围:[0, +∞),默认为1。推荐取值范围:[0, 2]。
color ResourceColor 蒙版颜色,默认透明色(0x00000000)。
adaptiveColor AdaptiveColor 背景模糊效果使用的取色模式,默认为DEFAULT。使用AVERAGE时color必须带有透明度,取色模式才生效(即默认颜色的情况下AVERAGE不生效)。
blurOptions BlurOptions 灰阶模糊参数,默认为[0,0]。

结合上面提到的BlurStyle和框架层代码可以看出,目前(API13)鸿蒙系统的模糊效果都是通过模糊半径、饱和度、亮度、蒙版颜色、取色模式、灰阶值这六个参数来决定的——有些接口只能调整一些参数;有些接口能自由调整所有参数;有些接口只能使用系统提供的定制参数。综上,无论哪个模糊接口、调用哪种参数类型,最后的实现其实都是改变这六个参数值。

个人认为效果比较好的一套参数:

          .backgroundEffect({
            radius: 100,
            saturation: 3,
            brightness: 1.2,
            blurOptions: {grayscale: [127,127]}
          })

效果:


标签:鸿蒙,auto,模糊,接口,Next,取色,API,参数
From: https://www.cnblogs.com/olderciyuan/p/18551276

相关文章

  • jmeter接口测试之SSH Command
    原文地址:https://download.csdn.net/blog/column/8863406/106334136需要提前安装好的工具:按照好jmeter插件:sshprotocolsupport、sshmonsamlerCollector   然而在实际测试中,不能确定我们的的机器能够正常连接。这里就要用到while循环设置重连,如下添加while控......
  • 通过将 USB to TTL 转换器连接到路由器的串口接口,并使用串口终端软件,你可以访问路由器
    USBtoTTL是一种常见的电子接口转换器,它将USB接口转换为TTL(Transistor-TransistorLogic)电平的串行通信接口。TTL电平通常用于嵌入式系统、单片机、开发板等硬件设备之间的通信。具体来说,它是一种USB转串行通信接口的桥接器。什么是USBtoTTL?USB(UniversalSerial......
  • 零基础Java第十五期:抽象类接口(一)
    目录一、抽象类1.1.抽象的概念1.2.抽象类语法 1.3.抽象类的特性 1.4.图形类例子 二、接口2.1.接口的概念2.2.语法规则 2.3.  接口的特性 2.4.接口的使用2.5. 实现多个接口2.6.工作当中常用的接口 一、抽象类1.1.抽象的概念    如果......
  • 如何在原生鸿蒙中进行RN热加载
    一、背景在上一篇博客中,我分享了将RN的bundle包在原生鸿蒙开发中进行使用。但是如果我们在实际的开发过程中,每次修改完代码都需要打包,然后重新运行原生项目的话效率就有点太低了。原生鸿蒙支持RN的热加载,每次改完代码直接ctrl+s即可,改动后的代码会自动同步到手机上。除此之外,还......
  • 抽象类 & 接口比较
    抽象类概述:1.该类的概念是抽象的,如形状,生物这些概念,无法实例化一个对象,所以抽象类是不允许创建对象的;2.对于这种类,这里面的大多数方法如果不通过继承的方式对类里面的方法进行重写的话,是无法执行的,比如一个形状类,既然有形状,就因该有显示名字方法,计算面积方法,在一些特定的坐标系上......
  • 使用 Docker 部署 Next Terminal 轻量级堡垒机
    1)NextTerminal 介绍官网:https://next-terminal.typesafe.cn/GitHub:https://github.com/dushixiang/next-terminal想必经常玩服务器的都了解过 堡垒机,类似于跳板机,但与跳板机的侧重点不同。堡垒机的主要功能是控制和监控对内部网络的远程访问。它提供严格的访问控制、会话审......
  • 行驶证 OCR 识别 API 接口用PHP如何调用
    行驶证OCR识别接口是一种极为强大的工具。其强大之处在于,当用户传入行驶证照片后,它能够以令人惊叹的速度和极高的准确性,快速准确地识别出行驶证上的所有文字信息。识别完成后,它会将这些文字信息以高度结构化的形式进行返回。以下是行驶证OCR识别API接口用PHP如何调用的......
  • 行驶证 OCR 识别 API 接口用C#如何调用
    具体来说,行驶证OCR识别接口具备强大的功能,可以准确识别包括所有人、品牌型号、住址、车牌号、发动机号码、车辆识别代号、注册日期、发证日期等多个至关重要的字段信息。在实际应用中,该接口通过对行驶证照片进行全面而深入的智能分析,能够极为精准地提取出上述的这些信息。并......
  • 评论模块接口文档
    一、新增评论1、基本信息:请求路径:/comment请求方式:PUT接口描述:该接口用于用户对商家进行评论2、请求参数:请求参数格式:application/x-www-form-urlencoded参数名称说明类型是否必须备注store_id商家IDnumber是commentary评论内容String是3、请......
  • HarmonyOS Next 网络加速进阶:优化策略与应用实践
    本文旨在深入探讨华为鸿蒙HarmonyOSNext系统(截止目前API12)的技术细节,基于实际开发实践进行总结。主要作为技术分享与交流载体,难免错漏,欢迎各位同仁提出宝贵意见和问题,以便共同进步。本文为原创内容,任何形式的转载必须注明出处及原作者。一、引言在上一篇博客中,我们已经初步......