# 前言
我們在生活中美化圖片的方法很多，貼紙花字是其中一種美化功能。Image Kit的貼紙花字可任意新增、拖動、縮放，且可以自定義花字的文字內容，為你的圖片增添新活力。

# 應用場景
貼紙花字大多數可用於修圖軟體裡，你可選擇與圖片風格相搭配的貼紙花字，且型別豐富多樣。

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20201119102056465.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20201119102113441.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

# 開發實戰
下面給大家介紹怎麼整合Image kit的貼紙花字能力：

開發準備
貼紙花字服務的所有介面的實現都是基於[StickerLayout](https://developer.huawei.com/consumer/cn/doc/development/HMSCore-References-V5/stickerlayout-0000001054117849-V5)，是一個自定義View，import的包名為com.huawei.hms.image.vision.sticker.StickerLayout，直接可以整合在layout的XML中。

**步驟1：** 獲取到[StickerLayout](https://developer.huawei.com/consumer/cn/doc/development/HMSCore-References-V5/stickerlayout-0000001054117849-V5)物件。
透過findViewById獲取到[StickerLayout](https://developer.huawei.com/consumer/cn/doc/development/HMSCore-References-V5/stickerlayout-0000001054117849-V5)物件後，可以呼叫具體的邏輯方法。

```java
StickerLayout mStickerLayout =   findViewById(R.id.sticker_container);
```

**步驟2：** 提供資原始檔。

貼紙定義規範，參見[貼紙設計指導及規範](https://developer.huawei.com/consumer/cn/doc/development/HMSCore-Guides/sticks-0000001058566694)。
花字定義規範，參見[花字設計指導及規範](https://developer.huawei.com/consumer/cn/doc/development/HMSCore-Guides/art_fonts-0000001057636407)。

**步驟3：** 新增貼紙花字。
呼叫[addSticker](https://developer.huawei.com/consumer/cn/doc/development/HMSCore-References-V5/stickerlayout-0000001054117849-V5#ZH-CN_TOPIC_0000001054117849__section166631215172212)介面，新增貼紙花字，傳入資原始檔路徑和檔名，如果返回碼為0，則為新增成功，貼紙花字總數最多可以新增50個。

```java
int   resultCode = mStickerLayout.addSticker(rootPath,   fileName);
```

請求介面引數描述：
| 引數列表 | 型別 | M/O（必選/可選） | 說明 |
|--|--|--|--|
| rootPath | String | M | 資原始檔根目錄。 |
| fileName | String | M  | 如果是貼紙，需要指定的檔名，其他可以傳null。|

程式碼示例：

```java
addSticker(rootPath + "貼紙1", "sticker_10_editable.png");
addSticker(rootPath + "花字4", null);
```

**步驟4：** 更新花字的文字。

開發者可以對花字文字進行編輯，透過回撥方法[setStickerLayoutListener](https://developer.huawei.com/consumer/cn/doc/development/HMSCore-References-V5/stickerlayout-0000001054117849-V5#ZH-CN_TOPIC_0000001054117849__section158298571178)(new [StickerLayout.StickerLayoutListener](https://developer.huawei.com/consumer/cn/doc/HMSCore-References-V5/stickerlayoutlistener-0000001054836478-V5)()）

獲取花字文字編輯物件textEditInfo，textEditInfo 呼叫setText，進行文字編輯，最後mStickerLayout呼叫[updateStickerText](https://developer.huawei.com/consumer/cn/doc/HMSCore-References-V5/stickerlayout-0000001054117849-V5#ZH-CN_TOPIC_0000001054117849__section179751901584)方法進行更新。

```java
//獲取TextEditInfo物件

mStickerLayout.setStickerLayoutListener(new   StickerLayout.StickerLayoutListener() {

@Override  
    public void   onStickerLayoutClick() {

}

@Override
    public void   onStickerTouch(int index) {

}

@Override  
    public void   onTextEdit(TextEditInfo textEditInfo) {
          StickerActivity.this.textEditInfo = textEditInfo;   
    }

@Override
    public void   needDisallowInterceptTouchEvent(boolean isNeed) {

}
});

//更新花字文字為"花字測試"字樣
textEditInfo.setText("花字測試");
mStickerLayout.updateStickerText(textEditInfo);
```

# DEMO效果

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20201119175155233.gif#pic_center)

---
原文連結：[https://developer.huawei.com/consumer/cn/forum/topic/0204403856067210183?fid=18](https://developer.huawei.com/consumer/cn/forum/topic/0204403856067210183?fid=18)

原作者：胡椒

整合華為Image Kit美化功能為你的圖片增添新元素

相關文章

整合華為Image Kit美化功能 為你的圖片增添新元素

相關文章

整合華為Image Kit美化功能為你的圖片增添新元素