You need to enable JavaScript to run this app.
导航
美颜美型保存参数示例
最近更新时间:2025.03.18 12:29:31首次发布时间:2025.03.18 12:29:31
我的收藏
有用
有用
无用
无用
简介

本地参数保存功能致力于提升用户体验,满足部分客户的要求,如记录用户上次进入实时预览时设置的参数。
该文档仅根据sample示例代码编写,为实现层代码,仅供参考。
从版本V4.4.0开始,sample提供美颜美型保存参数示例。

目标
  • 该功能用于记录用户在某个模块选中的某些参数,以便用户再次进该模块时 直接显示出之前的效果。
  • 比如: 用户进入美颜美型模块,选中了滤镜为“ 柔白”的效果后,用户返回首页,再次进入实时预览就有“柔白”的效果。
  • 再如: 用户在美颜美型模块进入图片预览模式,选中了单个或多个美颜效果后,返回实时预览模式,实时预览模式就会有图片预览模式时选中的效果,反之,实时预览选中单个或多个美颜效果后 ,进入图片模式效果一样。
  • 该版本有美颜美型、美颜美型pro、风格装三个模块实现了此功能。
demo示例代码

由于保存参数为实现层逻辑,因此本文档仅对sample中提供的示例代码进行说明。
可参考该示例与项目进行集成。

iOS代码

该部分对iOS sample代码中的保存参数部分代码做出说明。

  • 主要更新的逻辑示例代码在sample中的位置
    Effect/Effect/model/LocalParameterSaving/BESaveLocalParameterManager.h[.m]
    Effect/Effect/model/LocalParameterSaving/BEDocumentSaveManager.h[.m]
  • 主要封装逻辑的代码位置
    Effect/Effect/Effect.m
    Effect/Effect/ui/base/vc/BEEffectVC.m

1.整体流程方案

  • 以模块title为key ,值为大json结构,里面包含小json结构。
  • noFilter : 存储非滤镜数据,单个节点key为 ID&path。
  • filter : 存储滤镜数据。
  • 最终以json字符串的形式 保存在本地 Document。

2.接口说明

全局保存参数功能开启/关闭

代码位置在:Effect/Effect/Effect.m中

#define  BEGLOBISSAVE  1

参数说明
值为默认为1 ,为1时,开启保存功能; 为0时,关闭保存功能。

局部模块保存参数功能开启/关闭

代码位置在:Effect/Effect/model/LocalParameterSaving/BESaveLocalParameterManager.m中

+ (NSArray<NSString *> *)be_SaveModelTitles
{
    static dispatch_once_t onceToken;
    static NSArray *modelTitles;
    dispatch_once(&onceToken, ^{
        modelTitles = @[
            @"feature_beauty"
            ,@"feature_beauty_pro"
            ,@"feature_style_makeup"
        ];
    });
    return modelTitles;
}

参数说明
如果某个模块需要开启本地参数保存功能,必须将该模块的title添加到modelTitles这个数组中,如果某模块不需要此功能,将title从这个数组中移除即可。

获取本地保存的数据

代码位置在:Effect/Effect/ui/base/vc/BEEffectVC.m中

// {zh} /  获取本地保存的数据 {en} /Get locally saved data
// {zh} / @param isFilter 是否要获取滤镜数据 {en} /@param isFilter whether to get filter data
- (id)reloadLocalDataISFilter:(BOOL)isFilter

所需要本地保存的数据

代码位置在:Effect/Effect/ui/base/vc/BEEffectVC.m中

// {zh} / 供子类调用 用于保存本地数据 {en} /For subclasses to call, for saving local data
// {zh} / @param data 所需要保存的数据 {en} /@param data The data to be saved
// {zh} / @param isFilter 是否是滤镜数据 {en} /@param isFilter is filter data
- (void)be_saveLocalParameterWith:(id)data ISFilter:(BOOL)isFilter

更新本地保存的节点强度值

代码位置在:Effect/Effect/ui/base/vc/BEEffectVC.m中

// {zh} / 更新本地保存的某个节点的强度值 {en} /Update the strength value of a locally saved node
// {zh} / @param item 节点 {en} /@param item node
- (void)be_updateNodeIntensityValue:(BEEffectItem *)item

删除本地保存的参数

代码位置在:Effect/Effect/ui/base/vc/BEEffectVC.m中

// {zh} / 删除本地保存的参数 {en} /Delete locally saved parameters
- (void)be_deleteLocalParameter

3.调用示例

以美颜美型模块为例来说明调用以上封装接口的实际实现。
示例代码在sample中的位置:Effect/Effect/ui/effect/vc/BEBeautyEffectVC.m

点击事件中调用保存接口

Image

在强度滑感回调事件中调用更新强度接口

Image

在初始化或重置事件中调用获取本地保存的数据接口

Image

安卓代码

该部分对安卓sample代码中的保存参数部分代码做出说明。

  • 操作本地数据库新增的类
    com.bytedance.labcv.common.database.LocalParamHelper
    com.bytedance.labcv.common.database.LocalParamManager
  • 针对于美颜美型、风格妆的功能,提供直接保存及读取本地数据的接口
    com.bytedance.labcv.effect.manager.LocalParamDataManager

1.整体流程方案

本地建立sqlite数据库, 美颜美型、美颜美型pro、风格妆各建立一张表。
参数数据存储遵循以下原则:

  1. 数据库内每一条记录对应于一次sdk接口的调用
    • sdk设置素材效果的接口共有5种:updateComposerNodeIntensity、updateFilterIntensity、setSticker、setRenderCacheTexture、sendMessage; 以上这5个接口的每一次调用会对应于一条数据库内一条记录的新增、删除、更新
    • 一个美妆Pro素材,会对应于4条数据库中的记录(强度、颜色R、G、B);一个风格妆素材,会对应于2条数据库中的记录(滤镜、补妆)
  2. 数据库只在“恢复重置“操作时会清空表内记录,其他的操作只会新增、更新记录,而不会删除记录。
    • 目标是为了完整保存用户所有累计操作后的状态
  3. 数据库记录的序号顺序表征了用户首次设置某功能的先后顺序
    • 这一点会保证美妆Pro素材在从数据库读取到的记录中,四条记录按照顺序会严格对应到强度、颜色R、G、B四个效果上
  4. 对于连续调节滑杆的场景,只在滑杆最后一次设置值的情况下才将状态写入数据库
  5. 对于功能之间互斥的情况,应由demo代码手动管理数据库不同记录之间的字段之间的互斥状态
  6. demo开启本地存储功能后,预览开启的初始状态、退后台时的状态保存、返回主页后的状态保存、退出应用的状态保存、进入图片模式再返回的状态保存,一概以数据库内记录的状态所为准
  7. demo的运行状态(包括了UI、内存上的存储)应可以与数据库的状态之间实现一一对应,即要求可以可以在数据库内完整的存储好所有必要的demo运行状态,也可以由数据库无歧义的完整恢复出demo的运行状态

2.调用示例

android端sample每次开启功能(预览开启的初始状态、退后台时的状态保存、返回主页后的状态保存、退出应用的状态保存、进入图片模式再返回的状态保存)会从数据库中加载两次数据,第一次会恢复sdk的特效状态,第二次会从数据中恢复出UI状态。数据库的改变分别发生在项目选中、强度/颜色值改变、重置三个时间点。

初始化阶段

BaseEffectActivity初始化阶段恢复sdk的特效状态
Image

开启功能

开启功能时(预览开启的初始状态、退后台时的状态保存、返回主页后的状态保存、退出应用的状态保存、进入图片模式再返回的状态保存)刷新UI状态
EffectFragment的updateLocalParam方法
Image
StyleMakeupFragment的updateLocalParam方法
Image

项目选中、状态更新

EffectFragment类中onFilterSelected、onProgressEnd、onColorSelected、resetToDefault方法;
BeautyFaceFragment类中onItemClick、removeOrAddItem方法;
StyleMakeupFramgent类中onBeautySelect、resetDefault、onProgressEnd方法;
参见以上方法内,LocalParamDataManager.useLocalParamStorage()条件判断下的内容。

3.参数存储字段说明

存储的数据结构如下:

public class LocalParam{
    public String category; //指示素材调用了什么sdk接口来设置效果
    public String path;     //素材路径
    public String key;      //key字段
    public float intensity; //强度值
    public int arg0;        //参数0
    public long arg1;       //参数1
    public long arg2;       //参数2
    public String arg3;     //参数3
    public boolean selected;//是否被选中
    public boolean effect;  //是否生效
}

各种类型的素材共用这一种数据结构,不同类型的素材对应于各个字段的含义见于下表

类型字段组合美化滤镜贴纸消息
Stringcategory"composer_node""filter""sticker""msg"
Stringpath路径路径路径路径
StringkeyKey-RenderKey-
floatintensity强度值强度值--
intarg0单/双向调节--arg0
longarg1选中颜色序号--arg1
longarg2---arg2
Stringarg3---arg3
booleanselected是否选中是否选中是否选中是否选中
booleaneffect是否生效是否生效是否生效是否生效