Google VR SDK 支持daydream和Cardboard。

环境搭建

android studio 环境，2.2.2或者更高
android sdk版本在25以上
gradle 23.0.1或者更高
物理设备4.4以上

下载demo：

git clone https://github.com/googlevr/gvr-android-sdk.git

这个工程中有几个官方的例子，其中simplepanowidget就是全景图的例子。

在Android Studio中开始项目

在build.gradle文件中添加jcenter()，这样Gradle可以找到AAR文件。例如：

allprojects {repositories { // For GVR components, the official source of the .aars is JCenter.jcenter()     } }

2.添加依赖

dependencies {compile 'com.google.vr:sdk-audio:1.10.0'compile 'com.google.vr:sdk-base:1.10.0' }

1.10.0只是当前版本，后续可以修改。如果不想引用链接，可以直接在导入arr包，这个包在项目的library文件夹下。

VR view 示例代码

支持平台：Android、IOS、WEB
图像规格

VR查看图像可以保存为PNG，JPEG或GIF。Google建议使用JPEG改进压缩。
为了获得最大的兼容性和性能，图像尺寸应该是2的倍数（例如，2048或4096）。
单个图像应为2：1纵横比（例如4096×2048）。
立体图像应为1：1纵横比（例如4096×4096）。

视频规格

VR view视频应该被存储为H264编码的mp4文件。
单个视频应是2：1纵横比。
立体视频应是1：1纵横比。
一些较旧的设备不能解码的视频最大不能超过超过1080（1920×1080）。最大的兼容性和质量是头等大事，Google建议用户同时提供平面视觉1920x1080的视频和2048×2048处以上的立体视频。

代码分析

注意点

VrPanoramaView//Google提供给我们现实全景图片的View
Options//VrPanoramaView 所需的设置
VrPanoramaEventListener//为 VrPanoramaView 设置监听
loadImageFromBitmap//加载图片的主要方法

AndroidManifest文件

     android:launchMode="singleTask"

布局文件

<com.google.vr.sdk.widgets.pano.VrPanoramaViewandroid:id="@+id/pano_view"android:layout_width="match_parent"android:layout_height="250dip"android:layout_margin="5dip"android:scrollbars="@null"/>

Activity

public class SimpleVrPanoramaActivity extends Activity {private static final String TAG = "VrPanorama";private VrPanoramaView panoWidgetView;//上面说的Google提供给我们现实全景图片的Viewprivate String fileUri = "first.jpg";//assets文件夹下的文件名private Options panoOptions = new Options();//VrPanoramaView需要的设置private ImageLoaderTask backgroundImageLoaderTask;//异步加载图片@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.main_layout);//布局上面贴了panoWidgetView = (VrPanoramaView) findViewById(R.id.pano_view);//初始化VrPanoramaViewpanoWidgetView.setEventListener(new ActivityEventListener());//为VrPanoramaView添加监听//如果有任务在执行则停止它if (backgroundImageLoaderTask != null) {backgroundImageLoaderTask.cancel(true);}//设置inputType 为TYPE_STEREO_OVER_UNDER. 在后面会介绍TYPE_STEREO_OVER_UNDER的，暂时当做一个图片的显示类型就行panoOptions.inputType = Options.TYPE_STEREO_OVER_UNDER;//创建一个任务backgroundImageLoaderTask = new ImageLoaderTask();//执行任务。将图片名（根据项目实际情况传吧）和设置传入backgroundImageLoaderTask.execute(Pair.create(fileUri, panoOptions));}//异步任务class ImageLoaderTask extends AsyncTask<Pair<String, Options>, Void, Boolean> {@Overrideprotected Boolean doInBackground(Pair<String, Options>... fileInformation) {//真正写项目根据情况添加条件判断吧InputStream istr = null;try {istr = getAssets().open(fileInformation[0].first);//获取图片的输入流} catch (IOException e) {Log.e(TAG, "Could not decode default bitmap: " + e);return false;}Bitmap bitmap = BitmapFactory.decodeStream(istr);//创建bitmappanoWidgetView.loadImageFromBitmap(bitmap, fileInformation[0].second);//参数一为图片的bitmap，参数二为 VrPanoramaView 所需要的设置try {istr.close();//关闭InputStream} catch (IOException e) {Log.e(TAG, "Could not close input stream: " + e);}return true;}}private class ActivityEventListener extends VrPanoramaEventListener {@Overridepublic void onLoadSuccess() {//图片加载成功Log.e(TAG, "onLoadSuccess");}@Overridepublic void onLoadError(String errorMessage) {//图片加载失败Log.e(TAG, "Error loading pano: " + errorMessage);}@Overridepublic void onClick() {//当我们点击了VrPanoramaView 时候出发super.onClick();Log.e(TAG, "onClick");}@Overridepublic void onDisplayModeChanged(int newDisplayMode) {//改变显示模式时候出发（全屏模式和纸板模式）super.onDisplayModeChanged(newDisplayMode);Log.e(TAG, "onDisplayModeChanged");}}@Overrideprotected void onPause() {panoWidgetView.pauseRendering();//暂停3D渲染和跟踪super.onPause();}@Overrideprotected void onResume() {super.onResume();panoWidgetView.resumeRendering();//恢复3D渲染和跟踪}@Overrideprotected void onDestroy() {panoWidgetView.shutdown();//关闭渲染下并释放相关的内存if (backgroundImageLoaderTask != null) {backgroundImageLoaderTask.cancel(true);//停止异步任务}super.onDestroy();}
}

VrPanoramaView方法

显示模式默认情况下都是显示的有三个值
  1. embedded vr视图显示d为非全屏，嵌入客户端布局–1
  2. fullscreen_mono vr视图全屏显示为一个窗口–2
  3. fullscreen_stereo 以立体声模式全屏显示，每只眼睛有一个窗口–3 
panoWidgetView.setDisplayMode(3);
 是否显示全屏幕按钮
panoWidgetView.setFullscreenButtonEnabled(false);
是否显示信息按钮 panoWidgetView.setInfoButtonEnabled(false); 显示或隐藏按钮转换到立体声模式 panoWidgetView.setStereoModeButtonEnabled(false);
触摸平移是否启动 panoWidgetView.setTouchTrackingEnabled(false);
 显示或隐藏用于提示用户将手机放入GVR查看器的过渡视图 panoWidgetView.setTransitionViewEnabled(false);

options


panoOptions.inputType = Options.TYPE_STEREO_OVER_UNDER;

那么为什么要这样设置呢？先看官方对Options中标签的介绍：

public static final int TYPE_MONO = 1;图像被预期以覆盖沿着其水平轴360度，而垂直范围是根据图像的宽高比来计算。例如，如果一个1000x250像素的图像，给出所述全景将覆盖360x90度与垂直范围是-45至+45度。  public static final int TYPE_STEREO_OVER_UNDER = 2;包含两个大小相等的投影 全景图垂直叠加。顶部图像被显示给左眼、底部图像被显示给右眼。//看下图你就懂了图像将覆盖沿水平轴360度，而垂直范围是根据图像的宽高比来计算。例如，如果一个1000x500像素的图像中给出（即1000x250像素每个眼睛），全景将覆盖360x90度与垂直范围是-45至+45度。

要显示的图片是下图这样的，所以就要设置为 ‘TYPE_STEREO_OVER_UNDER’

那么什么样的图片设置为 ‘TYPE_MONO’ 呢？

TYPE_STEREO_OVER_UNDER类型的图片每次切换模式时候图片中间都会有一条垂直于水平线的分割线（很浅很浅然后逐渐消失），TYPE_MONO 就没有。

Options类中的代码也十分简单

public static class Options {private static final int TYPE_START_MARKER = 0;//起始标记public static final int TYPE_MONO = 1;public static final int TYPE_STEREO_OVER_UNDER = 2;private static final int TYPE_END_MARKER = 3;//结束标记public int inputType = 1;//默认为一public Options() {}void validate() {if(this.inputType <= 0 || this.inputType >= 3) {//标记错误处理String var10000 = VrPanoramaView.TAG;int var1 = this.inputType;Log.e(var10000, (new StringBuilder(38)).append("Invalid Options.inputType: ").append(var1).toString());this.inputType = 1;}}}

调皮的你如果在loadImageFromBitmap（bitmap，options）方法中将options不小心设置为 null 了，也没关系。我在源码中我发现下面的代码，感觉挺温馨的

public void loadImageFromBitmap(Bitmap bitmap, VrPanoramaView.Options options) {//有木有那里暖暖的 ^_^if(options == null) {options = new VrPanoramaView.Options();} else {options.validate();}//重点不在这里 可以无视它this.renderer.loadImageFromBitmap(bitmap, options, this.eventListener);}

总结

导入google的库\
在相应的布局文件中引入控件 com.google.vr.sdk.widgets.pano.VrPanoramaView
初始化控件
为VrPanoramaView设置options
找到图片的Bitmap
调用VrPanoramaView
loadImageFromBitmap方法
在onPause、onResume、onDestroy中做出相应处理

参考：
http://www.qingpingshan.com/rjbc/az/119129.html。
制作VR全景图播放器：（Google VR for Android）

https://developers.google.com/vr/android/samples/vrview

官方文档

Google VR Views实战（VR全景图播放器）相关推荐

Android实战 - 音心播放器（通知实现音乐的播放/暂停/下一曲控制）
1.背景通知 -> Service : 上一篇的MusicService 中提高了通知是Service的前台显示,这篇将介绍通知(MusicNotification).通知在这里有四个作用: ...
360player全景图播放器-附源码
开发了一个全景图播放器,自带全景展示.背景音乐.重力感应等功能,不用写代码,通过配置文件就可以展示全景图片. 360plyaer使用说明 1.360player是基于浏览器的全景图播放器,浏览器需要支 ...
最新AndroidStudio项目实战开发安卓播放器(手机影音)
AndroidStudio项目实战开发安卓播放器(手机影音) 下载地址:百度网盘
360player免费全景图播放器更新-附开发教程-20200101
介绍全景图查看器360player,是基于浏览器的全景图查看工具,可以很容易地部署到网站上,然后以自己网站的地址分享自己的全景图,无需借助第三方平台. 更新 20200101更新由于Chrome ...
使用google开源框架Exoplayer开发自定义播放器
http://ju.outofmemory.cn/entry/143633 背景: 移动端播放视频的需求如日中天, 最近特此使用google的开源框架Exoplayer来开发Android端的视频播放 ...
使用android studio时酷狗音乐,17 Android Studio开发实战：音乐播放器——浪花音乐...
手机上的多媒体内容讲究声情并茂.悦目且悦耳,这样才能让用户的感官得到最大享受.影视播放器由于存在视频自身的画面,反而限制了开发者的施展空间:而音乐播放器允许定制播放画面,开发者有足够空间施展拳脚.本节 ...
Vue实战：音乐播放器（一）页面效果
先看一下效果图首页歌单详情页歌手列表歌手详情页排行页面榜单的详情页(排序样式) 搜索页面搜索结果播放器内核歌词自动滚动播放列表用户中心转载于:https://www.cnblo ...
一步一步实战HTML音乐播放器
在这里我用HTML5从头开始一步一步来制作一个简约的音乐播放器,大家可以参考一下,接下来正式开始. 音乐播放器效果播放器分析这里将播放器分两块来做: 视图层(html + css) 逻辑层 ( j ...
vue + element UI【实战】音乐播放器/语音条（内含音频的加载、控制，事件监听，信息获取，手机网页阴影的去除等技巧）
相关技巧,详见注释 <template><div class="container"><h2>{{ mu ...

Google VR Views实战（VR全景图播放器）

环境搭建

在Android Studio中开始项目

VR view 示例代码

代码分析

总结

Google VR Views实战（VR全景图播放器）相关推荐

最新文章

热门文章