android 3d产品展示 源代码,Android TV开发:实现3D仿Gallery效果的实例代码

本文讲述了Android TV开发:实现3D仿Gallery效果的实例代码。分享给大家供大家参考,具体如下:

1.实现效果:

滚动翻页+ 页面点击+页码指示器+焦点控制

2.实现这个效果之前必须要了解

Android高级图片滚动控件实现3D版图片轮播器这篇文章,我是基于他的代码进行修改的,主要为了移植到电视上做了按键事件和焦点控制。

3.具体代码:

public class Image3DSwitchView extends LinearLayout {

private int currentPage =0;//定义当前第几页

/**

* 图片左右两边的空白间距

*/

public static final int IMAGE_PADDING = 5;

private static final int TOUCH_STATE_REST = 0;

private static final int TOUCH_STATE_SCROLLING = 1;

/**

* 滚动到下一张图片的速度

*/

private static final int SNAP_VELOCITY = 600;

/**

* 表示滚动到下一张图片这个动作

*/

private static final int SCROLL_NEXT = 0;

/**

* 表示滚动到上一张图片这个动作

*/

private static final int SCROLL_PREVIOUS = 1;

/**

* 表示滚动回原图片这个动作

*/

private static final int SCROLL_BACK = 2;

private static Handler handler = new Handler();

/**

* 控件宽度

*/

public static int mWidth;

private VelocityTracker mVelocityTracker;//主要用跟踪触摸屏事件(flinging事件和其他gestures手势事件)的速率

private Scroller mScroller;

/**

* 图片滚动监听器,当图片发生滚动时回调这个接口

*/

private OnImageSwitchListener mListener;

/**

* 记录当前的触摸状态

*/

private int mTouchState = TOUCH_STATE_REST;

/**

* 记录被判定为滚动运动的最小滚动值

*/

private int mTouchSlop;

/**

* 记录控件高度

*/

private int mHeight;

/**

* 记录每张图片的宽度

*/

private int mImageWidth;

/**

* 记录图片的总数量

*/

private int mCount;

/**

* 记录当前显示图片的坐标

*/

private int mCurrentImage;

/**

* 记录上次触摸的横坐标值

*/

private float mLastMotionX;

/**

* 是否强制重新布局

*/

private boolean forceToRelayout;

private int[] mItems;

public Image3DSwitchView(Context context, AttributeSet attrs) {

super(context, attrs);

mTouchSlop = ViewConfiguration.get(getContext()).getScaledTouchSlop();

mScroller = new Scroller(context);

//设置可以获得焦点

setFocusable(true);

}

@Override

protected void onLayout(boolean changed, int l, int t, int r, int b) {

if (changed || forceToRelayout) {

mCount = getChildCount();

// 图片数量必须大于5,不然无法正常显示

if (mCount < 5) {

return;

}

mWidth = getMeasuredWidth();

mHeight = getMeasuredHeight();

// 每张图片的宽度设定为控件宽度的百分之六十

mImageWidth = (int) (mWidth * 0.6);

if (mCurrentImage >= 0 && mCurrentImage < mCount) {

mScroller.abortAnimation();

setScrollX(0);

int left = -mImageWidth * 2 + (mWidth - mImageWidth) / 2;

// 分别获取每个位置上应该显示的图片下标

int[] items = {getIndexForItem(1), getIndexForItem(2),

getIndexForItem(3), getIndexForItem(4),

getIndexForItem(5)};

mItems = items;

// 通过循环为每张图片设定位置

for (int i = 0; i < items.length; i++) {

Image3DView childView = (Image3DView) getChildAt(items[i]);

childView.layout(left + IMAGE_PADDING, 0, left

+ mImageWidth - IMAGE_PADDING, mHeight);

childView.initImageViewBitmap();

left = left + mImageWidth;

}

refreshImageShowing();

}

forceToRelayout = false;

}

}

public interface OnFocusListener{

void onFocus();

void setValue(String value);

}

private OnFocusListener onFocusListener;

public void setonFocusListener(OnFocusListener onFocusListener){

this.onFocusListener = onFocusListener;

}

@Override

public boolean dispatchKeyEvent(KeyEvent event) {

if (event.getAction() == KeyEvent.ACTION_DOWN){

switch (event.getKeyCode()){

//按下键 响应回调

case KeyEvent.KEYCODE_DPAD_DOWN:

if (onFocusListener != null){onFocusListener.onFocus();}

break;

//按确定键

case KeyEvent.KEYCODE_DPAD_CENTER:

Toast.makeText(getContext(),"点击了图片"+(currentPage%7+1),Toast.LENGTH_SHORT).show();

break;

//右键

case KeyEvent.KEYCODE_DPAD_RIGHT:

scrollToNext();

if (onFocusListener !=null){

onFocusListener.setValue((currentPage%7+1)+"");

}

break;

//左键

case KeyEvent.KEYCODE_DPAD_LEFT:

scrollToPrevious();

if (onFocusListener !=null){

onFocusListener.setValue((currentPage%7+1)+"");

}

break;

}

}

return true;

}

@Override

public boolean onTouchEvent(MotionEvent event) {

if (mScroller.isFinished()) {

if (mVelocityTracker == null) {

mVelocityTracker = VelocityTracker.obtain();

}

mVelocityTracker.addMovement(event);

int action = event.getAction();

float x = event.getX();

switch (action) {

case MotionEvent.ACTION_DOWN:

// 记录按下时的横坐标

mLastMotionX = x;

break;

case MotionEvent.ACTION_MOVE:

int disX = (int) (mLastMotionX - x);

mLastMotionX = x;

scrollBy(disX, 0);

// 当发生移动时刷新图片的显示状态

refreshImageShowing();

break;

case MotionEvent.ACTION_UP:

mVelocityTracker.computeCurrentVelocity(1000);

int velocityX = (int) mVelocityTracker.getXVelocity();

if (shouldScrollToNext(velocityX)) {

// 滚动到下一张图

scrollToNext();

} else if (shouldScrollToPrevious(velocityX)) {

// 滚动到上一张图

scrollToPrevious();

} else {

// 滚动回当前图片

scrollBack();

}

if (mVelocityTracker != null) {

mVelocityTracker.recycle();

mVelocityTracker = null;

}

break;

}

}

return true;

}

/**

* 根据当前的触摸状态来决定是否屏蔽子控件的交互能力。

*/

@Override

public boolean onInterceptTouchEvent(MotionEvent ev) {

int action = ev.getAction();

if ((action == MotionEvent.ACTION_MOVE)

&& (mTouchState != TOUCH_STATE_REST)) {

return true;

}

float x = ev.getX();

switch (action) {

case MotionEvent.ACTION_DOWN:

mLastMotionX = x;

mTouchState = TOUCH_STATE_REST;

break;

case MotionEvent.ACTION_MOVE:

int xDiff = (int) Math.abs(mLastMotionX - x);

if (xDiff > mTouchSlop) {

mTouchState = TOUCH_STATE_SCROLLING;

}

break;

case MotionEvent.ACTION_UP:

default:

mTouchState = TOUCH_STATE_REST;

break;

}

return mTouchState != TOUCH_STATE_REST;

}

@Override

public void computeScroll() {

if (mScroller.computeScrollOffset()) {

scrollTo(mScroller.getCurrX(), mScroller.getCurrY());

refreshImageShowing();

postInvalidate();

}

}

/**

* 设置图片滚动的监听器,每当有图片滚动时会回调此接口。

*

* @param listener 图片滚动监听器

*/

public void setOnImageSwitchListener(OnImageSwitchListener listener) {

mListener = listener;

}

/**

* 设置当前显示图片的下标,注意如果该值小于零或大于等于图片的总数量,图片则无法正常显示。

*

* @param currentImage 图片的下标

*/

public void setCurrentImage(int currentImage) {

mCurrentImage = currentImage;

requestLayout();

}

/**

* 滚动到下一张图片。

*/

public void scrollToNext() {

if (mScroller.isFinished()) {

currentPage++;

int disX = mImageWidth - getScrollX();

checkImageSwitchBorder(SCROLL_NEXT);

if (mListener != null) {

mListener.onImageSwitch(mCurrentImage);

}

beginScroll(getScrollX(), 0, disX, 0, SCROLL_NEXT);

}

}

/**

* 滚动到上一张图片。

*/

public void scrollToPrevious() {

if (mScroller.isFinished()) {

if (currentPage ==0){

currentPage = 7;

}else

currentPage--;

int disX = -mImageWidth - getScrollX();

checkImageSwitchBorder(SCROLL_PREVIOUS);

if (mListener != null) {

mListener.onImageSwitch(mCurrentImage);

}

beginScroll(getScrollX(), 0, disX, 0, SCROLL_PREVIOUS);

}

}

/**

* 滚动回原图片。

*/

public void scrollBack() {

if (mScroller.isFinished()) {

beginScroll(getScrollX(), 0, -getScrollX(), 0, SCROLL_BACK);

}

}

/**

* 回收所有图片对象,释放内存。

*/

public void clear() {

for (int i = 0; i < mCount; i++) {

Image3DView childView = (Image3DView) getChildAt(i);

childView.recycleBitmap();

}

}

/**

* 让控件中的所有图片开始滚动。

*/

private void beginScroll(int startX, int startY, int dx, int dy,

final int action) {

int duration = (int) (700f / mImageWidth * Math.abs(dx));

mScroller.startScroll(startX, startY, dx, dy, duration);

invalidate();

handler.postDelayed(new Runnable() {

@Override

public void run() {

if (action == SCROLL_NEXT || action == SCROLL_PREVIOUS) {

forceToRelayout = true;

requestLayout();

}

}

}, duration);

}

/**

* 根据当前图片的下标和传入的item参数,来判断item位置上应该显示哪张图片。

*

* @param item 取值范围是1-5

* @return 对应item位置上应该显示哪张图片。

*/

private int getIndexForItem(int item) {

int index = -1;

index = mCurrentImage + item - 3;

while (index < 0) {

index = index + mCount;

}

while (index > mCount - 1) {

index = index - mCount;

}

return index;

}

/**

* 刷新所有图片的显示状态,包括当前的旋转角度。

*/

private void refreshImageShowing() {

for (int i = 0; i < mItems.length; i++) {

Image3DView childView = (Image3DView) getChildAt(mItems[i]);

childView.setRotateData(i, getScrollX());

childView.invalidate();

}

}

/**

* 检查图片的边界,防止图片的下标超出规定范围。

*/

private void checkImageSwitchBorder(int action) {

if (action == SCROLL_NEXT && ++mCurrentImage >= mCount) {

mCurrentImage = 0;

} else if (action == SCROLL_PREVIOUS && --mCurrentImage < 0) {

mCurrentImage = mCount - 1;

}

}

/**

* 判断是否应该滚动到下一张图片。

*/

private boolean shouldScrollToNext(int velocityX) {

return velocityX < -SNAP_VELOCITY || getScrollX() > mImageWidth / 2;

}

/**

* 判断是否应该滚动到上一张图片。

*/

private boolean shouldScrollToPrevious(int velocityX) {

return velocityX > SNAP_VELOCITY || getScrollX() < -mImageWidth / 2;

}

/**

* 图片滚动的监听器

*/

public interface OnImageSwitchListener {

/**

* 当图片滚动时会回调此方法

*

* @param currentImage 当前图片的坐标

*/

void onImageSwitch(int currentImage);

}

}

public class Image3DView extends ImageView {

/**

* 旋转角度的基准值

*/

private static final float BASE_DEGREE = 50f;

/**

* 旋转深度的基准值

*/

private static final float BASE_DEEP = 150f;

private Camera mCamera;

private Matrix mMaxtrix;

private Bitmap mBitmap;

/**

* 当前图片对应的下标

*/

private int mIndex;

/**

* 在前图片在X轴方向滚动的距离

*/

private int mScrollX;

/**

* Image3DSwitchView控件的宽度

*/

private int mLayoutWidth;

/**

* 当前图片的宽度

*/

private int mWidth;

/**

* 当前旋转的角度

*/

private float mRotateDegree;

/**

* 旋转的中心点

*/

private float mDx;

/**

* 旋转的深度

*/

private float mDeep;

public Image3DView(Context context, AttributeSet attrs) {

super(context, attrs);

mCamera = new Camera();

mMaxtrix = new Matrix();

//设置可获焦 & 可点击

setFocusable(true);

setClickable(true);

}

/**

* 初始化Image3DView所需要的信息,包括图片宽度,截取背景图等。

*/

public void initImageViewBitmap() {

if (mBitmap == null) {

//我们要获取cache首先要通过setDrawingCacheEnable方法开启cache,然后再调用getDrawingCache方法就可以获得view的cache图片了。

setDrawingCacheEnabled(true);

buildDrawingCache();

mBitmap = getDrawingCache();

}

mLayoutWidth = Image3DSwitchView.mWidth;

mWidth = getWidth() + Image3DSwitchView.IMAGE_PADDING * 2;

}

/**

* 设置旋转角度。

*

* @param index 当前图片的下标

* @param scrollX 当前图片在X轴方向滚动的距离

*/

public void setRotateData(int index, int scrollX) {

mIndex = index;

mScrollX = scrollX;

}

/**

* 回收当前的Bitmap对象,以释放内存。

*/

public void recycleBitmap() {

if (mBitmap != null && !mBitmap.isRecycled()) {

mBitmap.recycle();

}

}

@Override

public void setImageResource(int resId) {

super.setImageResource(resId);

mBitmap = null;

initImageViewBitmap();

}

@Override

public void setImageBitmap(Bitmap bm) {

super.setImageBitmap(bm);

mBitmap = null;

initImageViewBitmap();

}

@Override

public void setImageDrawable(Drawable drawable) {

super.setImageDrawable(drawable);

mBitmap = null;

initImageViewBitmap();

}

@Override

public void setImageURI(Uri uri) {

super.setImageURI(uri);

mBitmap = null;

initImageViewBitmap();

}

@Override

protected void onDraw(Canvas canvas) {

if (mBitmap == null) {

// 如果Bitmap对象还不存在,先使用父类的onDraw方法进行绘制

super.onDraw(canvas);

} else {

if (isImageVisible()) {

// 绘图时需要注意,只有当图片可见的时候才进行绘制,这样可以节省运算效率

computeRotateData();

mCamera.save();

mCamera.translate(0.0f, 0.0f, mDeep);

mCamera.rotateY(mRotateDegree);

mCamera.getMatrix(mMaxtrix);

mCamera.restore();

mMaxtrix.preTranslate(-mDx, -getHeight() / 2);

mMaxtrix.postTranslate(mDx, getHeight() / 2);

canvas.drawBitmap(mBitmap, mMaxtrix, null);

}

}

}

/**

* 在这里计算所有旋转所需要的数据。

*/

private void computeRotateData() {

float degreePerPix = BASE_DEGREE / mWidth;

float deepPerPix = BASE_DEEP / ((mLayoutWidth - mWidth) / 2);

switch (mIndex) {

case 0:

mDx = mWidth;

mRotateDegree = 360f - (2 * mWidth + mScrollX) * degreePerPix;

if (mScrollX < -mWidth) {

mDeep = 0;

} else {

mDeep = (mWidth + mScrollX) * deepPerPix;

}

break;

case 1:

if (mScrollX > 0) {

mDx = mWidth;

mRotateDegree = (360f - BASE_DEGREE) - mScrollX * degreePerPix;

mDeep = mScrollX * deepPerPix;

} else {

if (mScrollX < -mWidth) {

mDx = -Image3DSwitchView.IMAGE_PADDING * 2;

mRotateDegree = (-mScrollX - mWidth) * degreePerPix;

} else {

mDx = mWidth;

mRotateDegree = 360f - (mWidth + mScrollX) * degreePerPix;

}

mDeep = 0;

}

break;

case 2:

if (mScrollX > 0) {

mDx = mWidth;

mRotateDegree = 360f - mScrollX * degreePerPix;

mDeep = 0;

if (mScrollX > mWidth) {

mDeep = (mScrollX - mWidth) * deepPerPix;

}

} else {

mDx = -Image3DSwitchView.IMAGE_PADDING * 2;

mRotateDegree = -mScrollX * degreePerPix;

mDeep = 0;

if (mScrollX < -mWidth) {

mDeep = -(mWidth + mScrollX) * deepPerPix;

}

}

break;

case 3:

if (mScrollX < 0) {

mDx = -Image3DSwitchView.IMAGE_PADDING * 2;

mRotateDegree = BASE_DEGREE - mScrollX * degreePerPix;

mDeep = -mScrollX * deepPerPix;

} else {

if (mScrollX > mWidth) {

mDx = mWidth;

mRotateDegree = 360f - (mScrollX - mWidth) * degreePerPix;

} else {

mDx = -Image3DSwitchView.IMAGE_PADDING * 2;

mRotateDegree = BASE_DEGREE - mScrollX * degreePerPix;

}

mDeep = 0;

}

break;

case 4:

mDx = -Image3DSwitchView.IMAGE_PADDING * 2;

mRotateDegree = (2 * mWidth - mScrollX) * degreePerPix;

if (mScrollX > mWidth) {

mDeep = 0;

} else {

mDeep = (mWidth - mScrollX) * deepPerPix;

}

break;

}

}

/**

* 判断当前图片是否可见。

*

* @return 当前图片可见返回true,不可见返回false。

*/

private boolean isImageVisible() {

boolean isVisible = false;

switch (mIndex) {

case 0:

if (mScrollX < (mLayoutWidth - mWidth) / 2 - mWidth) {

isVisible = true;

} else {

isVisible = false;

}

break;

case 1:

if (mScrollX > (mLayoutWidth - mWidth) / 2) {

isVisible = false;

} else {

isVisible = true;

}

break;

case 2:

if (mScrollX > mLayoutWidth / 2 + mWidth / 2

|| mScrollX < -mLayoutWidth / 2 - mWidth / 2) {

isVisible = false;

} else {

isVisible = true;

}

break;

case 3:

if (mScrollX < -(mLayoutWidth - mWidth) / 2) {

isVisible = false;

} else {

isVisible = true;

}

break;

case 4:

if (mScrollX > mWidth - (mLayoutWidth - mWidth) / 2) {

isVisible = true;

} else {

isVisible = false;

}

break;

}

return isVisible;

}

}

public class MainActivity extends AppCompatActivity {

private Button btn;

private Image3DSwitchView image3DSwitchView;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

btn = (Button) findViewById(R.id.btn);

image3DSwitchView = (Image3DSwitchView) findViewById(R.id.image_switch_view);

btn.setOnKeyListener(new View.OnKeyListener() {

@Override

public boolean onKey(View v, int keyCode, KeyEvent event) {

if (keyCode == KeyEvent.KEYCODE_DPAD_UP && event.getAction()== KeyEvent.ACTION_DOWN)

image3DSwitchView.requestFocus();

return true;

}

});

//设置监听,并实现接口

image3DSwitchView.setonFocusListener(new Image3DSwitchView.OnFocusListener() {

@Override

public void onFocus() {

btn.requestFocus();

}

@Override

public void setValue(String value) {

btn.setText(value+"/7");

}

});

}

}

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="#000000">

android:layout_marginTop="100dp"

android:id="@+id/image_switch_view"

android:layout_width="wrap_content"

android:layout_height="470dp" >

android:id="@+id/image1"

android:focusable="true"

android:focusableInTouchMode="true"

android:clickable="true"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:scaleType="fitXY"

android:src="@drawable/image1" />

android:id="@+id/image2"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:scaleType="fitXY"

android:src="@drawable/image2" />

android:id="@+id/image3"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:scaleType="fitXY"

android:src="@drawable/image3" />

android:id="@+id/image4"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:scaleType="fitXY"

android:src="@drawable/image4" />

android:id="@+id/image5"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:scaleType="fitXY"

android:src="@drawable/image5" />

android:id="@+id/image6"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:scaleType="fitXY"

android:src="@drawable/image6" />

android:id="@+id/image7"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:scaleType="fitXY"

android:src="@drawable/image7" />

android:id="@+id/btn"

android:text="1/7"

android:textSize="32dp"

android:textColor="#ffffff"

android:layout_below="@+id/image_switch_view"

android:background="@drawable/button_style"

android:layout_width="match_parent"

android:layout_height="100dp" />

4.自己的成长点:

①响应遥控器按键事件:重写Image3DSwitchView类的dispatchKeyEvent()函数

@Override

public boolean dispatchKeyEvent(KeyEvent event) {

if (event.getAction() == KeyEvent.ACTION_DOWN){

switch (event.getKeyCode()){

//按下键 响应回调

case KeyEvent.KEYCODE_DPAD_DOWN:

if (onFocusListener != null){onFocusListener.onFocus();}

break;

//按确定键

case KeyEvent.KEYCODE_DPAD_CENTER:

Toast.makeText(getContext(),"点击了图片"+(currentPage%7+1),Toast.LENGTH_SHORT).show();

break;

//右键

case KeyEvent.KEYCODE_DPAD_RIGHT:

scrollToNext();

if (onFocusListener !=null){

onFocusListener.setValue((currentPage%7+1)+"");

}

break;

//左键

case KeyEvent.KEYCODE_DPAD_LEFT:

scrollToPrevious();

if (onFocusListener !=null){

onFocusListener.setValue((currentPage%7+1)+"");

}

break;

}

}

return true;

}

注意:要能响应点击事件的前提必须是控件可以获得焦点,所以在构造函数中加上

setFocusable(true);

②回调机制:类似Android TV开发:使用RecycleView实现横向的Listview并响应点击事件的代码的原理。 越来越发现回调技术的好用:轻松通过接口函数里面的参数把动态变化的变量传递到mainActivity

public interface OnFocusListener{

void onFocus();//处理焦点

void setValue(String value);//处理当前页码

}

private OnFocusListener onFocusListener;

public void setonFocusListener(OnFocusListener onFocusListener){

this.onFocusListener = onFocusListener;

www.jb51.net/article/140153.htm}

@Override

public boolean dispatchKeyEvent(KeyEvent event) {

if (event.getAction() == KeyEvent.ACTION_DOWN){

switch (event.getKeyCode()){

//按下键 响应回调

case KeyEvent.KEYCODE_DPAD_DOWN:

if (onFocusListener != null){onFocusListener.onFocus();}

break;

//按确定键

case KeyEvent.KEYCODE_DPAD_CENTER:

Toast.makeText(getContext(),"点击了图片"+(currentPage%7+1),Toast.LENGTH_SHORT).show();

break;

//右键

case KeyEvent.KEYCODE_DPAD_RIGHT:

scrollToNext();

if (onFocusListener !=null){

onFocusListener.setValue((currentPage%7+1)+"");

}

break;

//左键

case KeyEvent.KEYCODE_DPAD_LEFT:

scrollToPrevious();

if (onFocusListener !=null){

onFocusListener.setValue((currentPage%7+1)+"");

}

break;

}

}

return true;

}

在acitivity中调用

image3DSwitchView.setonFocusListener(new Image3DSwitchView.OnFocusListener() {

@Override

public void onFocus() {

btn.requestFocus();//让Image3DSwitchView控件下的按钮获得焦点

}

@Override

public void setValue(String value) {

btn.setText(value+"/7");//给按钮设置 第几页/共几页

}

});

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值