表情包鬥圖，作為人生新晉一大樂事，已經是廣大網友每天必經的聊天互動環節。什麼捧腹大笑、滿腹槽點、徹底無語……這些萬千語言無法貼切描述的情緒細節，總能被一張看似平平無奇的表情包完美形容，可謂一圖勝千言，四兩撥千斤！

如今，在表情包鬥圖進入白熱化階段，人們對錶情包的定製化需求日益增多，人人是表情包的搬運工，人人也是潛力熱圖的創造者！賦予個人製作個性化表情包的能力很有必要。使用**機器學習的影像分割功能**，輕鬆分割複雜圖片背景，讓表情包製作簡單而高效，讓我們來看看如何將一張圖片變成傳情達意的表情包吧！

# 開發準備
Maven倉和SDK的配置步驟可以參考開發者網站中的應用開發介紹

https://developer.huawei.com/consumer/cn/doc/development/HMSCore-Guides-V5/seg-sdk-0000001050038094-V5?ha_source=hms1?ha_source=hms1

## 配置整合的SDK包
影像分割提供了兩種SDK整合方式，一種是預先將分割演算法包預先整合在應用中，另一種是在應用安裝執行後，再將所需的演算法包下載到應用中，可以根據應用的使用場景和所需效果進行選擇。
本文是使用了Full SDK的整合方案，在應用的build.gradle檔案中，dependencies內新增影像分割的SDK依賴
```
implementation 'com.huawei.hms:ml-computer-vision-segmentation:2.2.0.300'
implementation 'com.huawei.hms:ml-computer-vision-image-segmentation-body-model:2.2.0.300'
```

## 配置AndroidManifest.xml 
開啟main資料夾中的AndroidManifest.xml檔案，可以根據場景和使用需要，配置讀取和寫入手機儲存的許可權，在<application>前新增
```
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"></uses-permission>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"></uses-permission>
```
在<application>內新增如下語句，當應用安裝後，會自動更新最新的機器學習模型到裝置
```
<meta-data android:name="com.huawei.hms.ml.DEPENDENCY" android:value="imagesuperresolution"></meta-data>
```

# 開發步驟

## 配置儲存許可權申請
手機的儲存許可權，除了在Manifest中宣告，還需要在Activity中進行動態申請。
在MainActivity的onCreate()方法中，呼叫requestPermission方法，對WRITE_EXTERNAL_STORAGE和READ_EXTERNAL_STORAGE許可權進行申請
```
protected void onCreate(Bundle savedInstanceState) {
    ……
    requestPermission(Manifest.permission.READ_EXTERNAL_STORAGE);
    requestPermission(Manifest.permission.WRITE_EXTERNAL_STORAGE);
……
}
```
requestPermission方法的實現如下，首先對許可權進行判斷，如果未獲取許可權，則進行申請，如果已經獲取了，則返回

```
private void requestPermission(String permisssions) {
    if (Build.VERSION.SDK_INT < Build.VERSION_CODES.M) {
        return;
    }
		    if (ContextCompat.checkSelfPermission(this, permisssions)
            != PackageManager.PERMISSION_GRANTED) {
        ActivityCompat.requestPermissions(this, new String[]{permisssions}, REQUEST_CODE);
    } else {
        return;
    }
}
```
## 讀取相簿中的圖片
我們先從相簿中選取要進行表情包製作的圖片，在xml檔案中建立一個按鈕chooseImg，點選後呼叫selectLocalImage方法

```
this.relativeLayoutLoadPhoto = this.findViewById(R.id.chooseImg);

this.relativeLayoutLoadPhoto.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
 MainActivity.this.selectLocalImage(StillCutPhotoActivity.this.REQUEST_CHOOSE_ORIGINPIC);
    }
});

```
selectLocalImage方法的實現如下
```
private void selectLocalImage(int requestCode) {
    Intent intent = new Intent(Intent.ACTION_PICK, null);
    intent.setDataAndType(MediaStore.Images.Media.EXTERNAL_CONTENT_URI, "image/*");
    this.startActivityForResult(intent, requestCode);
}
```
## 進行影像分割製作表情包
再建立一個按鈕cut，點選後呼叫createImageTransactor方法，進行影像分割分析器的建立
```
this.relativeLayoutCut = this.findViewById(R.id.cut);
this.relativeLayoutCut.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        if (MainActivity.this.imageUri == null) {
            Toast.makeText(MainActivity.this.getApplicationContext(), R.string.please_select_picture, Toast.LENGTH_SHORT).show();
        } else {
            MainActivity.this.createImageTransactor();
            Toast.makeText(MainActivity.this.getApplicationContext(), R.string.cut_success, Toast.LENGTH_SHORT).show();
        }
    }
});
```
在createImageTransactor方法中，我們首先建立一個影像分割的分析器，再進行分析器的配置，將其設定為人像分割模式
```
private MLImageSegmentationAnalyzer analyzer;

MLImageSegmentationSetting setting = new MLImageSegmentationSetting.Factory().setAnalyzerType(MLImageSegmentationSetting.BODY_SEG).create();
this.analyzer = MLAnalyzerFactory.getInstance().getImageSegmentationAnalyzer(setting);
```
從相簿中選取的檔案，透過imageUri，將其開啟為Bitmap格式
```
Pair<integer integer=""> targetedSize = this.getTargetSize();
int targetWidth = targetedSize.first;
int targetHeight = targetedSize.second;
this.originBitmap = BitmapUtils.loadFromPath(StillCutPhotoActivity.this, this.imageUri, targetWidth, targetHeight);
```
之後建立MLFrame，呼叫asyncAnalyseFrame進行非同步影像分割處理
```
MLFrame mlFrame = new MLFrame.Creator().setBitmap(this.originBitmap).create();
Task<mlimagesegmentation> task = this.analyzer.asyncAnalyseFrame(mlFrame);
```
影像分割完成後，對返回的結果進行處理，將去除背景後的影像儲存到processedImage中
```
task.addOnSuccessListener(new OnSuccessListener<mlimagesegmentation>() {
    @Override
    public void onSuccess(MLImageSegmentation mlImageSegmentationResults) {
        // Transacting logic for segment success.
        if (mlImageSegmentationResults != null) {
            StillCutPhotoActivity.this.foreground = mlImageSegmentationResults.getForeground();
            StillCutPhotoActivity.this.preview.setImageBitmap(StillCutPhotoActivity.this.foreground);
            StillCutPhotoActivity.this.processedImage = ((BitmapDrawable) ((ImageView) StillCutPhotoActivity.this.preview).getDrawable()).getBitmap();
        } else {
            StillCutPhotoActivity.this.displayFailure();
        }
    }
}).addOnFailureListener(new OnFailureListener() {
    @Override
    public void onFailure(Exception e) {
        // Transacting logic for segment failure.
        StillCutPhotoActivity.this.displayFailure();
        return;
    }
});
```
## 儲存表情包
最後將處理好的影像轉換成png格式，儲存到系統相簿中
```
public void saveToAlbum(Bitmap bitmap){
    File file = null;
    String fileName = System.currentTimeMillis() +".png";
    File root = new File(Environment.getExternalStorageDirectory().getAbsoluteFile(), this.context.getPackageName());
    File dir = new File(root, "image");
    if(dir.mkdirs() || dir.isDirectory()){
        file = new File(dir, fileName);
    }
    FileOutputStream os = null;
    try {
        os = new FileOutputStream(file);
        bitmap.compress(Bitmap.CompressFormat.PNG, 100, os);
        os.flush();

} catch (FileNotFoundException e) {
        Log.e(TAG, e.getMessage());
    } catch (IOException e) {
        Log.e(TAG, e.getMessage());
    }finally {
        try {
            if(os != null) {
                os.close();
            }
        }catch (IOException e){
            Log.e(TAG, e.getMessage());
        }
    }
    if(file == null){
        return;
    }
    if(imageUtilCallBack != null) {
        try {
            imageUtilCallBack.callSavePath(file.getCanonicalPath());
        } catch (IOException e) {
            Log.e(TAG, e.getMessage());
        }
    }
    // Gallery refresh.
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
        String path = null;
        try {
            path = file.getCanonicalPath();
        } catch (IOException e) {
            Log.e(TAG, e.getMessage());
						}
        MediaScannerConnection.scanFile(this.context, new String[]{path}, null,
                new MediaScannerConnection.OnScanCompletedListener() {
                    @Override
                    public void onScanCompleted(String path, Uri uri) {
                        Intent mediaScanIntent = new Intent(Intent.ACTION_MEDIA_SCANNER_SCAN_FILE);
                        mediaScanIntent.setData(uri);
                        ImageUtils.this.context.sendBroadcast(mediaScanIntent);
                    }
                });
    } else {
        String relationDir = file.getParent();
        File file1 = new File(relationDir);
        this.context.sendBroadcast(new Intent(Intent.ACTION_MEDIA_MOUNTED, Uri.fromFile(file1.getAbsoluteFile())));
    }
}
```
# 效果示例

編譯執行後，可以從相簿中選擇想要製作表情包的照片，點選Cut，ML Kit會完成之後的人像識別和影像分割步驟，將雜亂的背景去除，返回人像的圖片，之後點選Save即可將其儲存為沒有背景的表情包。

![](https://oscimg.oschina.net/oscnet/up-48bfc7d6f45875b434a61803b3e5e5ed06f.gif)

儲存後即可將表情包新增到社交軟體中啦，快來試試吧！

**瞭解更多相關內容**
訪問[華為機器學習影像分割服務官網](https://developer.huawei.com/consumer/cn/doc/development/hiai-Guides/image-segmentation-0000001050040109?ha_source=hms1)

獲取[華為機器學習服務開發指導文件](https://developer.huawei.com/consumer/cn/doc/development/HMSCore-Guides/android-sdk-use-0000001062402024?ha_source=hms1)

[華為HMS Core官方論壇](https://developer.huawei.com/consumer/cn/forum/block/hms-core?ha_source=hms1)

華為機器學習開源倉地址：[GitHub](https://github.com/HMS-Core/hms-ml-demo)、[Gitee](https://gitee.com/hms-core/hms-ml-demo)

解決整合問題請到[Stack Overflow](https://stackoverflow.com/questions/tagged/huawei-mobile-services?tab=Newest)

點選關注，第一時間瞭解HMS Core最新技術~</mlimagesegmentation></mlimagesegmentation></integer></application></application>

用影像分割製作專屬表情包？這裡有妙招！

相關文章