3D空间版UI的使用
1. 控件的使用:
1.1 VRTextView 的使用。
代码使用如下:接口调用视需求而定,不一定全部都调用。
VRTextView start = new VRTextView(this);
start.setWidthAndHeight(6,6);
start.addTranslateAnimation3D(new MathC.Vector(0,-20,-60),new MathC.Vector(0,5,-60),500);
start.setAnimationRepeatMode(Animation.RepeatMode.NONE);
start.setTexture(R.drawable.start);
start.setTransparent(ANode.TRANSPARENT_STATE.SEMI_TRANSPARENT);
start.setLookAtListener(mOnLookAtListener);
start.setRotate(0,-30,0);
start.onLayout(-6,0);
start.setClipp(15,-3);
start.registerView();
start.playAnimation(0);
- 首先创建一个VRTextView 对象。
- 调用setWidthAndHeight(float width,float height)来设置该控件的宽高。
@param width and height 设置宽高 - 调用setTexture(int texture)来给控件设置纹理(也就是图片)。
@param texture 设置纹理的参数,是int类型 - addTranslateAnimation3D(new MathC.Vector(0,-20,-60),new MathC.Vector(0,5,-60),500)、setAnimationRepeatMode(Animation.RepeatMode.NONE)以及.playAnimation(0)的配套使用。
@param fromPoint toPoint 设置位移动画的起始点以及终点
@param time 设置动画的总时长
@param Animation.RepeatMode 设置动画播放的类型,(这个接口参数,可以直接点进去查看类型,我代码中有注释的)
说明:首先添加动画,然后设置动画的参数,然后就可以指定播放那个动画,目前SDK中只能对位移动画
可以添加多个一致类型的动画,其他类型的都不能添加多个动画。这点希望一定要注意。
比如说VRLayout也是同样的道理,希望能够注意这一点,不要在这个地方出错,也可以继续优化,
参考我写的位移动画的添加多个动画的代码,扩展性还是挺高的。 - 调用setLookAtListener(mOnLookAtListener)来设置监听事件。
@param ANode.OnLookAtListener 设置监听的类型 - 调用onLayout(float left,float top)来设置子控件相对与父控件的的位置,如果是单个的ui那么不要使用这个接口。
@param left 子控件相对与父布局的左上角坐标点的距离(水平距离)
@param top 子控件相对于父布局的左上角坐标点的距离(垂直距离) - 调用setRotate(0,-30,0)接口来进行旋转的设置。(绕y轴顺时针旋转30度)
@param rotateX 这个是绕x旋转的角度,示范旋转案例 :setRotate(30,0,0),单纯的绕x轴旋转。
@param rotateY 这个是绕y轴旋转的角度 ,示范旋转案例:setRotate(0,30,0),单纯的绕y轴旋转
@param rotateZ 这个是绕z周旋转的角度,示范旋转案例:setRotate(0,0,30),单纯的绕z轴旋转
说明:正值是逆时针旋转,负值是顺时针旋转,可以绕多个轴同时旋转例如:setRotate(30,30,0) - 调用setClipp(float maxY,float minY)设置Y轴上的剪裁的空间,在这个空间中显示像素,超过这个区间则舍弃会绘制。
@param maxY 在y轴上的最大的值,小于这个值则显示像素,超过这个值则不绘制像素。
@param minY 在y轴上的最小的值,小于这个值则舍弃像素,大于这个值则绘制像素。 - 调用setTransparent(ANode.TRANSPARENT_STATE.SEMI_TRANSPARENT)接口来进行混合的设置,
@param SEMI_TRANSPARENT 是半透明设置
@param TRANSPARENT 不透明设置
@param OPACUE 透明设置 - 调用registerView()这个接口,将创建的控件添加进渲染层。
1.2 VRLayout 的使用。
代码清单(有父布局与子布局):
VRTextView[] textViews = new VRTextView[6];
VRLayout listView = new VRLayout(30,40, VRUIViewGroup.ViewType.ListView,this);
listView.setPosition(70,45,-60);
listView.setRotate(0,-30,0);
listView.setTexture(R.drawable.zx);
for(int i = 0;i<6;i++){
textViews[i] = new VRTextView(this);
textViews[i].setWidthAndHeight(25,8);
textViews[i].setTexture(R.drawable.bb);
textViews[i].onLayout(2.5f,10*(i-1)+4);
textViews[i].setClipp(60,32);
textViews[i].setLookAtListener(mOnLookAtListener);
listView.addView(textViews[i]);
}
listView.registerView();
-
创建VRLayout时,传递参数ListView,则创建ListView布局,并且指定宽高。
@param width 指定控件布局的宽。 @param height 指定控件布局的高。 @param ViewType 指定控件的布局类型 说明:现在空间的布局类型都是自定义布局,也就是说通过Onlayout这个接口来指定子控件 相对父控件的位置。但是ListView只能在一行只能是一个子控件其他布局类型可以有多个子控件。
调用listView.addView(textViews[i])接口,将子控件添加进父布局中。
说明:注意这个接口只能是将子布局添加进父布局的时候才能够使用的,单个布局不要使用这个接口,没有意义。父布局可以隐藏也可以显示,如果想让父布局显示那么就调用setTransparent(ANode.TRANSPARENT),
接口在介绍VRTextView的时候介绍过这个接口参数中的含义,可以查看一下,这里不做介绍了。
1.3 VRUIProgressBar 的使用。
代码清单:
VRUIProgressBar vruiProgressBar = new VRUIProgressBar(this,R.drawable.aa);
vruiProgressBar.setWidthAndHeight(90,6);
vruiProgressBar.setTransparent(ANode.TRANSPARENT_STATE.TRANSPARENT);
vruiProgressBar.setLookAtListener(mOnLookAtListener);
vruiProgressBar.onLayout(4,6);
vruiProgressBar.setInterX(0.0f);
vruiProgressBar.setClipp(15,-3);
vruiProgressBar.registerView();
- setInterX(0.0f)这个接口是来设置进度条的显示的进度比例,其参数值是0-1。水平的是setInterX,
如果进度条是垂直的,那么设置的是setInterY接口(进度条类型包括两种:水平、垂直)。
@param radio 该参数区间是0 - 1,类型是float,如果视频播放了一,那么设置为0.5,初始值得0.0。 - 其他的接口都在上面介绍过,请查阅上面的API来进行使用,这里不在赘述。
2. UI控件的整体的接口作用的介绍。
VRUIView类中的接口介绍
- updataTexture(int texture) 该接口可以动态的更新每个布局控件的纹理。
@param texture 该参数提供了两种类型,一种是int类型,一种是Bitmap类型,视需求而定。 - setPosition(float x, float y, float z) 设置控件的初始位置,注意一点,该接口只能在初始化的时候可以调用,
而在动画中,调用该接口是没有效果跟意义的。
@param x y z 三个参数是在x轴y轴z周上的位置,然后就可以确定三维空间上的唯一一个点。 - setRotate(float x, float y, float z) 设置控件的初始旋转角度,注意一点,该接口同样是只能在初始化的时候
可以调用。
@param x y z 三个参数是分别绕x轴y轴z轴旋转的角度。 - setAnimationListener(IAnimationListener iAnimationListener) 该接口使用可以在编辑页面中可以实现
new IAnimationListener(){
@Override
public void onAnimationEnd(Animation animation) {
}
@Override
public void onAnimationRepeat(Animation animation) { }
@Override
public void onAnimationStart(Animation animation) { }
@Override
public void onAnimationUpdate(Animation animation, double interpolatedTime) { }
};
@param 这个是动画的监听实现的方法,onAnimationEnd(Animation animation)该方法是在动画结束后回调的方法。
@param onAnimationRepeat(Animation animation) 是动画重复播放完一次回调的方法。
@param onAnimationStart(Animation animation) 动画开始播放时的回调方法。
@param onAnimationUpdate(Animation animation, double interpolatedTime) 在播放动画期间一直回调的方法,期间会传递回来时间。 - addRotatePointAnimation3D(MathC.Vector fromAngle, MathC.Vector toAngle, MathC.Vector rotatePoint, long time)是添加绕某点旋转的动画接口参数。
@param fromAngle 起始的旋转角度
@param toAngle 终止的旋转角度。
@param rotatePoint 围绕某点旋转的旋转点。
@param time 动画播放的总时间。
说明:这个动画只能是单个ui的时候可以设置这种动画,但是如果是有父布局的话,
那么这个动画是有bug的,在矩阵库与四元数库还没有真正应用到这个SDK库中的时候,
这个只要包含旋转功能的且是有父布局的,那么都不行使用,只能是单个ui使用才可以。 - addRotateSelfAnimation3D(MathC.Vector fromAngle, MathC.Vector toAngle, long time)是给单个ui添加绕自身旋转的动画
@param fromAngle 起始的旋转角度
@param toAngle 终止的旋转角度。 - addBezierAnimation3D(MathC.Vector bizerConP1, MathC.Vector bizerConP2, MathC.Vector toPoint, long time)添加贝塞尔曲线,这个是可以个单个ui或者给有哦子视图的Layout添加动画的。
@param bizerConP1 贝塞尔曲线的第一个控制点。
@param bizerConP2 贝塞尔曲线的第二个控制点。
@param toPoint 贝塞尔曲线的目标点。
说明:贝塞尔曲线是从空间初始的默认的位置到达规定的目标点,中间有两个控制点,这样曲线计算出来是平滑的。
VRLayout中的接口介绍
- updataViewGroupPosition(MathC.Vector parentPosition, MathC.Vector parentRotate)该接口接受的是父布局的位置以及旋转的参数,然后子控件会跟随父布局进行变换(可以实时的进行更新位置)。
@param parentPosition 这个参数接受父布局的位置,不能接受子控件的位置,然后接受父布局的位置,会更新子控件的位置的。
@param parentRotate 这个参数接受父布局的旋转参数,如果父布局没有旋转,那么其中的x y z设置为0就可以。 - lookOff(ANode sprite) 响应监听事件。lookActive(ANode sprite)同理。
@param sprite接受矩形的类型为ANode。
说明:
——在整个ui空间中的数组中,记住最重要的一点,如果是有父子布局的,那么数组中第一个是父布局的ANode对象,后面是自控件的ANode对象。一定要注意这一点,并且其中测绘计量子控件等一些算法已经成熟,可以在其中扩展。
——这里只是介绍了最常用的接口,这些接口可以组装出来最常用的一些特效,如果看不懂API那么可以直接看源代码,这样对于使用更有帮助。