简介

华为全景服务(HUAWEI Panorama Kit)是华为为开发者提供的全景图片浏览服务。您可以通过SDK集成华为全景服务,在Android手机上快速将二维的平面图模拟成真实的三维空间,给用户带来沉浸感与真实感。

您将建立什么

在这个Codelab中,你将使用已经创建好的Demo Project实现对华为全景开放服务的API调用,通过Demo Project你可以体验到:

您将会学到什么

硬件要求

软件要求

全景SDK为纯端侧能力,无须接入华为AGC即可调用。

下载示例代码

源码下载

构建工程

步骤1: 打开Android Studio。
步骤2: 选择"File" -> "Open",选择示例代码解压缩后的路径。

步骤3: 点击"ok"按钮。
步骤4: 查看仓库路径、依赖包、权限、混淆脚本的配置。Demo中已配置好,但后续您自己的工程中,需参考并修改。

在项目级build.gradle文件中配置了仓库路径

buildscript { repositories { ... maven { url 'http://developer.huawei.com/repo/' } } ... } allprojects { repositories { ... maven { url 'http://developer.huawei.com/repo/' } } } ...

在应用级build.gradle文件中配置了依赖包,如下

dependencies { ... implementation 'com.huawei.hms:panorama:4.0.1.300' ... }

在Manifest中配置了读写外部存储的权限(在Android 6.0及以上的版本,还需要您动态申请该权限),如下

... <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> ...

配置混淆脚本,在app/proguard-rules.pro文件中配置了如下两行

-ignorewarnings -keepattributes *Annotation* -keepattributes Exceptions -keepattributes InnerClasses -keepattributes Signature -keepattributes SourceFile,LineNumberTable -keep class com.hianalytics.android.**{*;} -keep class com.huawei.updatesdk.**{*;} -keep class com.huawei.hms.**{*;}

测试验证

导入完成后,点击图标 ,运行Android Studio工程打包生成APK,并安装在测试手机上,运行效果如下图所示:

三个按钮分别代表三种调用方式,点击其中的一个可看到全景图浏览的效果:

初级演练(应用外全景展示)

您可以修改Demo中的图片Uri来指定其他任意图片,例如:

final Uri uri = Uri.parse("android.resource://" + getPackageName() + "/" + R.raw.pano2);

如果您需要浏览环形全景图,可以通过API指定类型IMAGE_TYPE_RING来浏览:

Panorama.getInstance().loadImageInfoWithPermission(getApplicationContext(), uri, PanoramaInterface.IMAGE_TYPE_RING).setResultCallback(new ResultCallbackImpl());

高级演练(应用内全景展示)

如果您想要更灵活的使用全景服务,需要调用全景SDK的LocalInterface,可参考LocalInterfaceActivity中的实现代码。

步骤1 新建一个Layout

Layout用于放置全景显示的View,左下角放置一个ImageButton,显示切换控制方式的图标。

步骤2 获取LocalInterface对象

mLocalInterface = Panorama.getInstance().getLocalInstance(this);

步骤3 初始化并设置图片Uri和图片类型

mLocalInterface.init(); mLocalInterface.setImage(uri, PanoramaInterface.IMAGE_TYPE_SPHERICAL);

步骤4 获取View并加入之前新建的Layout中

RelativeLayout layout = findViewById(R.id.relativeLayout); View view = mLocalInterface.getView(); layout.addView(view);

监听Button的事件用来切换控制方式

mImageButton = findViewById(R.id.changeButton); mImageButton.bringToFront(); mImageButton.setOnClickListener(this); @Override public void onClick(View v) { if (v.getId() == R.id.changeButton) { if (mChangeButtonCompass) { mImageButton.setImageDrawable(getResources().getDrawable(R.drawable.ic_touch)); mChangeButtonCompass = false; mLocalInterface.setControlMode(PanoramaInterface.CONTROL_TYPE_TOUCH); } else { mImageButton.setImageDrawable(getResources().getDrawable(R.drawable.ic_compass)); mChangeButtonCompass = true; mLocalInterface.setControlMode(PanoramaInterface.CONTROL_TYPE_POSE); } } }

步骤5 将View的触摸事件传给SDK

view.setOnTouchListener(this); @Override public boolean onTouch(View v, MotionEvent event) { if (mLocalInterface != null) { mLocalInterface.updateTouchEvent(event); } return true; }

步骤6 点击图标 ,运行Android Studio工程打包生成APK,并安装在测试手机上,点击localInterface即可看到效果:

—-结束

如果您想要在运行过程中加载其他的全景图片,可以调用setImage接口指定不同的全景图:

@Override public void onClick(View v) { if (v.getId() == R.id.changeButton) { if (mChangeButtonCompass) { mChangeButtonCompass = false; Uri uri = Uri.parse("android.resource://" + getPackageName() + "/" + R.raw.pano); mLocalInterface.setImage(uri, PanoramaInterface.IMAGE_TYPE_SPHERICAL); } else { mChangeButtonCompass = true; Uri uri = Uri.parse("android.resource://" + getPackageName() + "/" + R.raw.pano2); mLocalInterface.setImage(uri, PanoramaInterface.IMAGE_TYPE_SPHERICAL); } } }

干得好,您已经成功完成了Codelab并学到了:

您可以阅读下面链接,了解更多相关的信息。
开发指南

API文档

FAQ

已复制代码