## 前言
AR放置類APP已經廣泛應用於各行各業中，如家居行業使用者可以用AR體驗傢俱擺放效果；在零售行業消費者可以用AR提前試穿鞋服；在教育行業學生可以利用AR探索物體的虛擬3D模型，瞭解各種物體的內部構造。

那麼如何才能快速開發一款AR放置APP呢？整合HUAWEI Scene Kit, 只需要8步就能實現。ARView是Scene Kit 中面向AR的場景化API，透過整合AR Engine的平面檢測能力，結合圖形引擎服務自身渲染引擎的圖形能力，為開發者提供了在一般AR場景中載入、渲染3D素材的能力。

## ARView功能簡介    
1. AR場景中載入、渲染3D素材。

2. 可開關的平面輔助選取功能，螢幕中支援顯示一個白色平面點陣的方式，輔助選取平面。

3. 在平面放置素材後，可點選選取該素材物體。當物體處於紅色被選取狀態後，可進行移動、縮放、旋轉。

## AR放置應用開發
在使用ARView之前需要在Android工程中整合Scene Kit SDK，操作可以參見整合Scene Kit SDK

ARView繼承自Android GLSurfaceView，並重寫了相關生命週期方法，方便開發者呼叫。**總共只需要8步即可實現完整的ARView應用。**

**Step1. 建立一個ARViewActivity，使其繼承自Activity。新增一個Button按鈕用於載入素材**

```java
public class ARViewActivity extends Activity {
    private ARView mARView;
    private Button mButton;
    private boolean isLoadResource = false;
}
```
**Step2. 將ARView新增到Layout佈局中**

```java
<com.huawei.hms.scene.sdk.arview android:id="@+id/ar_view" android:layout_width="match_parent" android:layout_height="match_parent">
</com.huawei.hms.scene.sdk.arview>
```

【說明】ARView為保證效果暫不支援轉屏與分屏操作，需要在Android Manifest檔案中進行配置：

```java
android:screenOrientation="portrait"
android:resizeableActivity="false"
```

**Step3. 重寫onCreate方法，並獲取ARView**

```java
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_ar_view);
    mARView = findViewById(R.id.ar_view);
    mButton = findViewById(R.id.button);
}
```
**Step4. 可在onCreate方法中使用一個Switch按鈕控制輔助顯示平面是否開啟。**

```java
Switch mSwitch = findViewById(R.id.show_plane_view);
mSwitch.setChecked(true);
mSwitch.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
    @Override
    public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
        mARView.enablePlaneDisplay(isChecked);
    }
});
```
【說明】Switch按鈕使用前請在Layout中新增。

```java
<switch android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/show_plane_view" android:layout_alignparenttop="true" android:layout_margintop="15dp" android:layout_alignparentend="true" android:layout_marginend="15dp" android:layout_gravity="end" android:text="@string/show_plane" android:theme="@style/AppTheme" tools:ignore="RelativeOverlap"></switch>
```
**Step5. 增加按鈕回撥方法。首次點選按鈕載入素材，再次點選按鈕清除素材。**

```java
public void onBtnClearResourceClicked(View view) {
    if (!isLoadResource) {
        mARView.loadAsset("ARView/scene.gltf");
        isLoadResource = true;
        mButton.setText(R.string.btn_text_clear_resource);
    } else {
        mARView.clearResource();
        mARView.loadAsset("");
        isLoadResource = false;
        mButton.setText(R.string.btn_text_load);
    }
}
```
【說明】onBtnSceneKitDemoClicked方法需在Button的佈局屬性onClick中註冊。

**Step6. 重寫onPause方法，並呼叫ARView的onPause方法。**

```java
**@Override
protected void onPause() {
    super.onPause();
    mARView.onPause();
}**
```
**Step7. 重寫onResume方法，並呼叫ARView的onResume方法。**

```java
@Override
protected void onResume() {
    super.onResume();
    mARView.onResume();
}
```
**Step8. 重寫onDestroy方法，並呼叫ARView的destroy方法。**

```java
@Override
protected void onDestroy() {
    super.onDestroy();
    mARView.destroy();
}
```
**Step9. 載入完素材後，可透過setInitialPose設定3D素材初始的縮放係數與旋轉角度。【可選】**

```java
float[] scale = new float[] { 0.1f, 0.1f, 0.1f };
float[] rotation = new float[] { 0.707f, 0.0f, -0.707f, 0.0f };
mARView.setInitialPose(scale, rotation);
```
## 效果展示
按照以上8個步驟呼叫HUAWEI Scene Kit ARView介面，我們即可實現一個簡單的AR放置應用。
![](https://oscimg.oschina.net/oscnet/up-a99812a05f22ff269efdc0c05b36fc7cad4.gif)

如果你對實現方式感興趣，可以檢視Github原始碼：[https://github.com/HMS-Core/hms-scene-demo](https://github.com/HMS-Core/hms-scene-demo)

基於Scene Kit ARView的能力不僅僅可以用來開發AR放置應用，還可以幫助開發者實現很多有趣的功能， 例如：AR遊戲、虛擬展廳、AR導航等。

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

華為Scene Kit官網：[https://developer.huawei.com/consumer/cn/hms/huawei-scenekit/](https://developer.huawei.com/consumer/cn/hms/huawei-scenekit/)

獲取開發指導文件：[https://developer.huawei.com/consumer/cn/doc/development/HMSCore-Guides/dev-process-0000001054326746](https://developer.huawei.com/consumer/cn/doc/development/HMSCore-Guides/dev-process-0000001054326746)

參與開發者討論請到Reddit社群：[https://www.reddit.com/r/HMSCore/](https://www.reddit.com/r/HMSCore/)

下載demo和示例程式碼請到Github：[https://github.com/HMS-Core/hms-scene-demo](https://github.com/HMS-Core/hms-scene-demo)

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

---
原文連結：[https://developer.huawei.com/consumer/cn/forum/topicview?tid=0202382479977390326&fid=18](https://developer.huawei.com/consumer/cn/forum/topicview?tid=0202382479977390326&fid=18)
作者：胡椒

如何用華為Scene Kit 8步實現AR放置應用

相關文章