簡介

華為HMS ML Kit提供拍照購服務，使用者通過拍攝商品圖片，在預先建立的商品圖片庫中線上檢索同款或相似商品，返回相似商品ID和相關資訊。

應用場景

1. 使用攝像頭裝置從開發的購物APP當中捕捉產品影象。

2. 在迴圈檢視當中顯示返還的產品列表。

開發準備

1. 推薦使用Java JDK 1.8或者更高版本。

2. 推薦使用Android Studio。

3. 搭載HMS Core4.0.0.300 或者更高版本的華為安卓裝置。

4. 在開發APP之前，你需要註冊華為開發者，賬號註冊。

5. 整合AppGallery Connect SDK, 請訪問AppGallery Connect 服務入門指南。

開發

1. 在Manage APIs中啟用ML Kit, 可參考開通服務。

2. 在app-level bulid.gradle 中整合以下依賴項。

// Import the product visual search SDK.



 implementation 'com.huawei.hms:ml-computer-vision-cloud:2.0.1.300'

3. 在app.gradle檔案的頂部新增agc外掛。

apply plugin: 'com.huawei.agconnect'

4. 在清單中新增以下許可權。

• 攝像頭許可權android.permission.CAMERA: 從攝像頭中獲取實時影象或視訊。

• 網路連線許可權 android.permission.INTERNET：訪問網際網路上的雲服務。

• 儲存寫許可權android.permission.WRITE_EXTERNAL_STORAGE: 升級演算法版本。

• 儲存讀許可權android.permission.READ_EXTERNAL_STORAGE: 讀取儲存在裝置上的照片。

5. 實時請求相機許可權

private void requestCameraPermission() {
     final String[] permissions = new String[] {Manifest.permission.CAMERA};
 
     if (!ActivityCompat.shouldShowRequestPermissionRationale(this, Manifest.permission.CAMERA)) {
         ActivityCompat.requestPermissions(this, permissions, this.CAMERA_PERMISSION_CODE);
         return;
     }
 }
 

6. 在Application class 中新增以下程式碼

public class MyApplication extends Application {
 
@Override
     public void onCreate() {
         super.onCreate();
         MLApplication.getInstance().setApiKey("API KEY");
     }
 }

可以從AGC或者整合的agconnect-services.json獲得API key。

7. 為拍照購物建立一個分析器。

private void initializeProductVisionSearch() {
         MLRemoteProductVisionSearchAnalyzerSetting settings = new MLRemoteProductVisionSearchAnalyzerSetting.Factory()
 // Set the maximum number of products that can be returned.
                 .setLargestNumOfReturns(16)
                 // Set the product set ID. (Contact [email protected] to obtain the configuration guide.)
 //                .setProductSetId(productSetId)
                 // Set the region.
                 .setRegion(MLRemoteProductVisionSearchAnalyzerSetting.REGION_DR_CHINA)
                 .create();
          analyzer
                 = MLAnalyzerFactory.getInstance().getRemoteProductVisionSearchAnalyzer(settings);
     }

8. 從相機中捕捉影象。

Intent intent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE);
 
 startActivityForResult(intent, REQ_CAMERA_CODE);

9. 一旦影象被捕捉，將執行onActivityResult() method。

@Override
     public void onActivityResult(int requestCode, int resultCode, Intent data) {
         super.onActivityResult(requestCode, resultCode, data);
         Log.d(TAG, "onActivityResult");
         if(requestCode == 101) {
             if (resultCode == RESULT_OK) {
                 Bitmap bitmap = (Bitmap) data.getExtras().get("data");
                 if (bitmap != null) {
 // Create an MLFrame object using the bitmap, which is the image data in bitmap format.
                     MLFrame mlFrame = new MLFrame.Creator().setBitmap(bitmap).create();
                     mlImageDetection(mlFrame);
                 }
  }
 
 }
     }  
     private void mlImageDetection(MLFrame mlFrame) {
     Task> task = analyzer.asyncAnalyseFrame(mlFrame);
     task.addOnSuccessListener(new OnSuccessListener>() {
         public void onSuccess(List products) {
             // Processing logic for detection success.
      displaySuccess(products);
             
   }})
             .addOnFailureListener(new OnFailureListener() {
                 public void onFailure(Exception e) {
                     // Processing logic for detection failure.
                     // Recognition failure.
                     try {
                         MLException mlException = (MLException)e;
                         // Obtain the result code. You can process the result code and customize respective messages displayed to users.
                         int errorCode = mlException.getErrCode();
                         // Obtain the error information. You can quickly locate the fault based on the result code.
                         String errorMessage = mlException.getMessage();
                     } catch (Exception error) {
                         // Handle the conversion error.
                     }
                 }
             });
              } 
 
   private void displaySuccess(List productVisionSearchList) {
         List productImageList = new ArrayList();
         String prodcutType = "";
         for (MLProductVisionSearch productVisionSearch : productVisionSearchList) {
             Log.d(TAG, "type: " + productVisionSearch.getType() );
             prodcutType =  productVisionSearch.getType();
             for (MLVisionSearchProduct product : productVisionSearch.getProductList()) {
                 productImageList.addAll(product.getImageList());
                 Log.d(TAG, "custom content: " + product.getCustomContent() );
             }
         }
         StringBuffer buffer = new StringBuffer();
         for (MLVisionSearchProductImage productImage : productImageList) {
             String str = "ProductID: " + productImage.getProductId() + "
ImageID: " + productImage.getImageId() + "
Possibility: " + productImage.getPossibility();
             buffer.append(str);
             buffer.append("
");
         }
         Log.d(TAG , "display success: " + buffer.toString());
         FragmentTransaction transaction = getFragmentManager().beginTransaction();
         transaction.replace(R.id.main_fragment_container, new SearchResultFragment(productImageList, prodcutType ));
         transaction.commit();
     }

onSuccess()回撥將給我們MLProductVisionSearch.getType()物件列表，可用於獲取每個產品的ID和影象URL。我們還可以使用productVisionSearch.getType()獲取產品型別，gatType()返回可對映的編號。

在撰寫本文時，產品型別是：

10. 我們可以使用以下程式碼實現產品型別對映。

private String getProductType(String type) {
    switch(type) {
        case "0":
            return "Others";
        case "1":
            return "Clothing";
        case "2":
            return "Shoes";
        case "3":
            return "Bags";
        case "4":
            return "Digital & Home appliances";
        case "5":
            return "Household Products";
        case "6":
            return "Toys";
        case "7":
            return "Cosmetics";
        case "8":
            return "Accessories";
        case "9":
            return "Food";
    }
    return  "Others";
}

11. 從MLVisionSearchProductImage獲取產品ID和影象URL。

@Override
public void onBindViewHolder(ViewHolder holder, int position) {
    final MLVisionSearchProductImage mlProductVisionSearch = productVisionSearchList.get(position);
 
    holder.tvTitle.setText(mlProductVisionSearch.getProductId());
    Glide.with(context)
            .load(mlProductVisionSearch.getImageId())
                    .diskCacheStrategy(DiskCacheStrategy.ALL)
                    .into(holder.imageView);
 
}

Demo

欲瞭解更多詳情，請參閱：

華為開發者聯盟官網

獲取開發指導文件

參與開發者討論請到Reddit社群

下載demo和示例程式碼請到Github

解決整合問題請到Stack Overflow

原文連結：
https://developer.huawei.com/consumer/cn/forum/topic/0201434135672410084?fid=18

作者：胡椒