美顏SDK是什麼?虹圖美顏SDK對接開發指南

TIANzz發表於2023-09-26

美顏SDK,即提供美顏特效功能的SDK開發套件,通俗來講就是直播、短影片中需要給使用者提供美顏、濾鏡、貼紙道具等能力時,自研成本大時間長,就找個第三方開發好的包,也就是美顏SDK,整合進你自己的平臺。叫做美顏SDK的這個包,通常包含了美顏,美型,濾鏡這些基礎功能,也有貼紙道具,美妝,甚至美體等功能,不同廠商提供的功能和效果也各不相同。

 

記錄下本次直播專案整合虹圖美顏SDK的步驟


虹圖美顏SDK提供的功能如下,但是我們只整合了幾種的美膚、美型、風格濾鏡、光影濾鏡幾個功能。

同時實現美顏預覽頁面設定引數,進入直播間直接開播的功能。

 

功能模組

功能描述

人像美顏

美膚(美白、磨皮、紅潤、清晰、亮度、去黑眼圈、去法令紋)

美型(瘦臉、大眼、V臉、窄臉、瘦顴骨、瘦下頜骨、豐太陽穴、小頭、小臉、短臉、下巴、縮人中、髮際線、眼間距、開眼角、長鼻、瘦鼻、嘴型、微笑嘴唇等)

風格濾鏡(提供不少於30款濾鏡)

光影濾鏡功能(提供不少於15款光影濾鏡)

特效濾鏡(畫面炫彩變幻效果,包括靈魂出竅、魔法鏡面、水面效果等效果)

哈哈鏡(多種人臉變形哈哈鏡特效)

美髮功能(多種髮色隨緣切換)

美妝(包含眉毛、腮紅、眼影、眼線、睫毛、口紅、美瞳等美妝特效)

妝容推薦(多種不同風格的妝容搭配一鍵切換)

各類效果結合美妝的組合妝容效果

美體(包含長腿、瘦身兩種特效)

基於全身肢體關鍵點,實現長腿、瘦身效果

道具特效

貼紙+水印

3D 特效

手勢識別

人像摳圖:綠幕摳圖 + AI摳圖

 

 

首先是跑通虹圖的示例工程

 

1.建立應用

登入到使用者中心控制檯,進入左側專案管理>人像人體SDK,單擊建立,在彈出的對話方塊中輸入您的應用名稱和包名,並單擊提交。

 

2.下載 HTEffectDemo 原始碼

在剛剛建立出的應用中,單擊配置進入專案配置頁面,單擊右側文件中心裡的下載即可進入下載頁面。

 

3. 配置 HTEffectDemo 工程檔案

Android

下載完成後,進入 HTEffectDemo 工程,開啟 app 模組的 AndroidManifest 檔案,將 android:label 的值替換為您剛剛建立的應用名稱。

開啟 app 模組中的 build.gradle 檔案,將 applicationId 的值替換為您剛剛建立的包名。

全域性搜尋 initHTEffect 方法,將引數 YOUR_APP_ID 修改為建立應用時生成的APP ID。

 

iOS

下載完成後,開啟 HTEffectDemo 工程,將 Display Name 和 Bundle Identifier 分別替換為您剛剛建立的應用名稱和包名並回車確認。

全域性搜尋 initHTEffect 方法,將引數 YOUR_APP_ID 修改為建立應用時生成的APP ID。

 

4. 編譯執行

Android

使用 AndroidStudio (4.1及以上的版本)編譯執行 HTEffectDemo 工程即可。

 

iOS

使用 Xcode(11.0及以上的版本)開啟原始碼目錄下的 HTEffectDemo.xcworkspace 工程,編譯並執行 HTEffectDemo 工程即可。

 

 

跑通後就可以開始接入自己的工程了

iOS接入

1. 匯入工程

將下載好的 HTEffect.framework 庫檔案和 HTEffect.bundle 資源包放到您的專案資料夾下。

在 Xcode > General 中新增動態庫,確保 Embed 屬性設定為 Embed & Sign。

在 Xcode > Build Settings 中搜尋 bitcode ,將 Enable Bitcode 設定為 No。

在 Xcode > Info 中新增 App Transport Security Settings > Allow Arbitrary Loads 並設定為 YES。

 

2. 使用 HTUI (可選)

HTUI 是開源的,可根據專案需求選用。 使用 HTUI 方法如下: 將 HTUI 資料夾新增到您的專案資料夾中,匯入 HTUIManager.h 並設定 HTUIManagerDelegate。

[[HTUIManager shareManager] loadToWindowDelegate:self];

 

3. 整合開發

3.1 初始化

HTEffect 的初始化函式呼叫一次即可生效。但由於 app 在第一次安裝的時候需要獲取網路許可權,此時呼叫初始化是無法成功的,所以推薦您在 AppDelegate 中呼叫 initHTEffect 並設定 HTEffectDelegate 回撥,待進入影片頁面時判斷初始化狀態,若失敗可再執行初始化方法,避免出現第一次安裝時初始化失敗。

 

 // 線上鑑權初始化方法

 [[HTEffect shareInstance] initHTEffect:@"YOUR_APP_ID" withDelegate:self];

// 離線鑑權初始化方法

[[HTEffect shareInstance] initHTEffect:@"YOUR_APP_ID"];

提示

注:專案執行後在控制檯搜尋 InitInfo,可檢視具體的版本資訊和初始化狀態。

 

3.2 新增 HTUI (可選)

如果需要使用 HTUI,您可以在 viewDidLoad 中新增以下方法:

 [[HTUIManager shareManager] loadToWindowDelegate:self];

 [self.view addSubview:[HTUIManager shareManager].defaultButton];

 

3.3 渲染步驟

定義一個 BOOL 變數 isRenderInit ,用來標誌渲染器的初始化狀態。根據獲取到的影片格式,採用對應的方法進行渲染:

 

Texture 紋理

首先呼叫 initTextureRenderer 初始化紋理渲染器,再呼叫渲染方法 processTexture。

/**

* 初始化紋理渲染器

*

* @param width    影像寬度

* @param height   影像高度

* @param rotation 影像是否需要旋轉,不需旋轉為CLOCKWISE_0

* @param isMirror 影像是否存在映象

* @param maxFaces 人臉檢測數目上限設定,推薦取值範圍為1~5

*

* @return 返回初始化結果,成功返回true,失敗返回false

*/

- (BOOL)initTextureRenderer:(int)width height:(int)height rotation:(HTRotationEnum)rotation isMirror:(BOOL)isMirror maxFaces:(int)maxFaces;

* 處理紋理資料輸入

*

* @param textureId 紋理ID

*/

 

- (GLuint)processTexture:(GLuint)textureId;

 

* 使用示例

*/

if (!_isRenderInit) {

[[HTEffect shareInstance] releaseTextureRenderer];

_isRenderInit = [[HTEffect shareInstance] initTextureRenderer:width height:height rotation:rotation isMirror:isMirror maxFaces:maxFaces];

}

[[HTEffect shareInstance] processTexture:textureId];

 

CVPixelBufferRef 影片幀

首先呼叫 initBufferRenderer 初始化buffer渲染器,再呼叫渲染方法 processBuffer。

 

 

/**

* 初始化buffer渲染器

*

* @param format 影像格式

* @param width    影像寬度

* @param height   影像高度

* @param rotation 影像是否需要旋轉,不需旋轉為CLOCKWISE_0

* @param isMirror 影像是否存在映象

* @param maxFaces 人臉檢測數目上限設定,推薦取值範圍為1~5

*

* @return 返回初始化結果,成功返回true,失敗返回false

*/

- (BOOL)initBufferRenderer:(HTFormatEnum)format width:(int)width height:(int)height rotation:(HTRotationEnum)rotation isMirror:(BOOL)isMirror maxFaces:(int)maxFaces;

* 處理buffer資料輸入

*

* @param buffer 影片幀資料

*/

- (void)processBuffer:(unsigned char *)buffer;

 

* 使用示例

*/

CVPixelBufferLockBaseAddress(pixelBuffer, 0);

unsigned char *buffer = (unsigned char *) CVPixelBufferGetBaseAddressOfPlane(pixelBuffer, 0);

 

if (!_isRenderInit) {

 [[HTEffect shareInstance] releaseBufferRenderer];

 _isRenderInit = [[HTEffect shareInstance] initBufferRenderer:format width:width height:height rotation:rotation isMirror:isMirror maxFaces:maxFaces];

}

[[HTEffect shareInstance] processBuffer:buffer];

 

CVPixelBufferUnlockBaseAddress(pixelBuffer, 0);

 

 

3.4 銷燬

結束渲染時,需根據影片格式,呼叫對應的釋放方法,通常寫在 dealloc 方法裡:

 

/**

* 銷燬紋理渲染資源

*/

[[HTEffect shareInstance] releaseTextureRenderer];

 

/**

* 銷燬buffer渲染資源

*/

[[HTEffect shareInstance] releaseBufferRenderer];

#3.5 資原始檔

HTEffect 所有資源均支援放在使用者自己的伺服器,可使用以下方法進行設定:

 

 

/**

* 設定素材網路路徑

* 將素材儲存在自定義的網路儲存中的情況下,設定網路路徑

*

* @param url 素材網路路徑

*/

[[HTEffect shareInstance] setResourceUrl:url];

#3.6 人臉檢測功能

HTEffect 支援人臉檢測功能,可透過以下方法返回人臉數量:

 

 

int faceNumber = [[HTEffect shareInstance] isTracking];

 

 

 

安卓接入

1. 匯入工程

將 HTEffect.aar 檔案複製到 app 模組中的 libs 資料夾下,並在 app 模組的 build.gradle 檔案的 dependencies 中,增加如下依賴:

dependencies {

 implementation files('libs/HTEffect.aar')

}

將 jniLibs 資料夾中,各個 ABI 對應的 libHTEffect.so 檔案,複製到對應目錄中。

將 assets 資原始檔複製到專案的對應目錄中。

 

2. 使用 HTUI (可選)

HTUI 是開源的,可根據專案需求選用。 使用 HTUI 方法如下:

依賴我們的 htui 工程,使用我們提供的開源 UI 庫,將 htui 資料夾複製到工程根目錄下,在工程根目錄的 settings.gradle 檔案中,增加如下程式碼:

include(":htui")

在 app 模組中的 build.gradle 檔案的 dependencies 中,增加如下程式碼:

implementation project(':htui')

 

3. 整合開發

3.1 初始化

HTEffect 初始化函式程式中呼叫一次即可生效,建議您在 Application 建立的時候呼叫;如果渲染功能使用不頻繁,也可以在使用的時候呼叫,介面如下:

 

 

    // 線上鑑權初始化方法

     HTEffect.shareInstance().initHTEffect(context, "YOUR_APP_ID", new InitCallback() {

        @Override public void onInitSuccess() {}

        @Override public void onInitFailure() {}

    });

 // 離線鑑權初始化方法

  HTEffect.shareInstance().initHTEffect(context,"YOUR_APP_ID");

提示

注:專案執行後在控制檯搜尋 InitInfo,可檢視具體的版本資訊和初始化狀態。

 

3.2 新增 HTUI (可選)

設定使用 htui 的 Activity 繼承或間接繼承 FragmentActivity,例如:

public class CameraActivity extends FragmentActivity {

 //...

}

如果需要使用 htui,請呼叫 addcontentView 實現UI的新增,程式碼如下:

 

   addContentView(

 new HTPanelLayout(this).init(getSupportFragmentManager()),

 new FrameLayout.LayoutParams(

  ViewGroup.LayoutParams.MATCH_PARENT,

  ViewGroup.LayoutParams.MATCH_PARENT));

 

3.3 渲染步驟

定義布林變數 isRenderInit ,用來標誌渲染方法是否初始化完成,然後根據得到的影片幀格式的不同,使用對應的方法進行渲染:

 

GL_TEXTURE_EXTERNAL_OES 紋理格式,首先呼叫渲染初始化方法 initTextureOESRenderer,當返回 true 時初始化完成;然後呼叫渲染方法 processTextureOES,返回值為 GL_TEXTURE_EXTERNAL_OES 型別的紋理:

 

 /**

      * 紋理渲染初始化

      *

      * @param width    紋理寬度

      * @param height   紋理高度

      * @param rotation 紋理是否需要旋轉,不需旋轉為CLOCKWISE_0

      * @param isMirror 紋理是否存在映象

      * @param maxFaces 人臉檢測數目上限設定,推薦取值範圍為1~5

      */

 

 public boolean initTextureOESRenderer(int width, int height, HTRotationEnum rotation, boolean isMirror, int maxFaces) ;

 

   /**

      * 渲染

      *

      * @param textureOES   紋理id

      */

   public int processTextureOES(int textureOES);

 

   /**

      * 使用方法

      */

   if (!isRenderInit) {

        isRenderInit = HTEffect.shareInstance().initTextureOESRenderer(width, height, rotation, isMirror, maxFaces);

      }

      int textureId = HTEffect.shareInstance().processTextureOES(textureOES);

GL_TEXTURE_2D 紋理格式,首先呼叫渲染初始化方法 initTextureRenderer,當返回 true 時初始化完成;然後呼叫渲染方法 processTexture,返回值為 GL_TEXTURE_2D 型別的紋理:

 

   /**

      * 紋理渲染初始化

      *

      * @param width    紋理寬度

      * @param height   紋理高度

      * @param rotation 紋理是否需要旋轉,不需旋轉為CLOCKWISE_0

      * @param isMirror 紋理是否存在映象

      * @param maxFaces 人臉檢測數目上限設定,推薦取值範圍為1~5

      */

 

 public boolean initTextureRenderer(int width, int height, HTRotationEnum rotation, boolean isMirror, int maxFaces) ;

 

   /**

      * 渲染

      *

      * @param texture2D   紋理id

      */

   public int processTexture(int texture2D);

 

   /**

      * 使用方法

      */

   if (!isRenderInit) {

        isRenderInit = HTEffect.shareInstance().initTextureRenderer(width, height, rotation, isMirror, maxFaces);

      }

      int textureId = HTEffect.shareInstance().processTexture(texture2D);

byte[] 影片幀,首先呼叫渲染初始化方法 initBufferRenderer ,當返回 true 時初始化完成;然後呼叫渲染方法 processBuffer :

 

/**

  * 初始化buffer渲染器

  *

  * @param format 影像格式

  * @param width    影像寬度

  * @param height   影像高度

  * @param rotation 影像是否需要旋轉,不需旋轉為CLOCKWISE_0

  * @param isMirror 影像是否存在映象

  * @param maxFaces 人臉檢測數目上限設定,推薦取值範圍為1~5

  *

  * @return 返回初始化結果,成功返回true,失敗返回false

  */

public boolean initBufferRenderer(HTFormatEnum format, int width, int height, HTRotationEnum rotation, boolean isMirror, int maxFaces);

 

 

  /**

  * 處理buffer資料輸入

  *

  * @param buffer 影片幀資料

  */

public void processBuffer(byte[] buffer);

 

/**

   * 使用方法

   */

if (!isRenderInit) {

     isRenderInit = HTEffect.shareInstance().initBufferRenderer(format,width, height, rotation, isMirror, maxFaces);

   }

   HTEffect.shareInstance().processBuffer(buffer);

 

3.4 銷燬

結束渲染時,為防止記憶體洩漏的發生,需根據影片幀格式的不同,呼叫對應的 destroy 方法釋放掉資源,呼叫位置通常在 影片幀回撥介面 的銷燬處,或者是 Activity , Fragment 的生命週期結束處,同時將定義的布林變數 isRenderInit 置為 false:

 

/**

   * 使用其中一個

   */

     HTEffect.shareInstance().releaseTextureOESRenderer();

     HTEffect.shareInstance().releaseTextureRenderer();

     HTEffect.shareInstance().releaseBufferRenderer();

 

   /*

   * 將 bool 置為 false

   */

     isRenderInit = false;

 

3.5 資原始檔

HTEffect 所有資源均支援放在使用者自己的伺服器,使用以下方法進行設定:

 

HTEffect.shareInstance().setResourceUrl(String url);

 

3.6 人臉檢測功能

HTEffect支援人臉檢測功能,可透過以下方法返回人臉數量

 

int faceNumber = HTEffect.shareInstance().isTracking();

 

 

總結

總而言之,使用虹圖美顏SDK還是比較簡單方便的,因為已經封裝好很多外層的邏輯了,只需要把button移到我們自己專案要的地方就可以了。也可以實現美顏的預設定頁面,預覽並設定好引數,儲存好後進入房間直接就是儲存過的美顏引數。

 

來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/70033992/viewspace-2986105/,如需轉載,請註明出處,否則將追究法律責任。

相關文章