您的位置:首页 > 移动开发 > Android开发

android开发之自定义ViewGroup实现竖向引导界面

2015-03-12 09:33 806 查看
一般进入APP都有欢迎界面,基本都是水平滚动的,今天和大家分享一个垂直滚动的例子,但是该项目只能跑在Android 3.0及以上的移动设备上。

1、先来看看效果把:



2、核心代码–自定义ViewGroup

/**
* Created by Zane on 2015/3/11.
*/

public class VerticalLinearLayout extends ViewGroup
{
/**
* 屏幕的高度
*/
private int mScreenHeight;
/**
* 手指按下时的getScrollY
*/
private int mScrollStart;
/**
* 手指抬起时的getScrollY
*/
private int mScrollEnd;
/**
* 记录移动时的Y
*/
private int mLastY;
/**
* 滚动的辅助类
*/
private Scroller mScroller;
/**
* 是否正在滚动
*/
private boolean isScrolling;
/**
* 加速度检测
*/
private VelocityTracker mVelocityTracker;
/**
* 记录当前页
*/
private int currentPage = 0;

private OnPageChangeListener mOnPageChangeListener;

public VerticalLinearLayout(Context context, AttributeSet attrs)
{
super(context, attrs);

/**
* 获得屏幕的高度
*/
WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
DisplayMetrics outMetrics = new DisplayMetrics();
wm.getDefaultDisplay().getMetrics(outMetrics);
mScreenHeight = outMetrics.heightPixels;
// 初始化
mScroller = new Scroller(context);
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int count = getChildCount();
for (int i = 0; i < count; ++i)
{
View childView = getChildAt(i);
measureChild(childView, widthMeasureSpec,mScreenHeight);
}
}

@Override
protected void onLayout(boolean changed, int l, int t, int r, int b)
{
if (changed)
{
int childCount = getChildCount();
// 设置主布局的高度
MarginLayoutParams lp = (MarginLayoutParams) getLayoutParams();
lp.height = mScreenHeight * childCount;
setLayoutParams(lp);

for (int i = 0; i < childCount; i++)
{
View child = getChildAt(i);
if (child.getVisibility() != View.GONE)
{
child.layout(l, i * mScreenHeight, r, (i+1) * mScreenHeight);// 调用每个自布局的layout
}
}

}

}

@Override
public boolean onTouchEvent(MotionEvent event)
{
// 如果当前正在滚动,调用父类的onTouchEvent
if (isScrolling)
return super.onTouchEvent(event);

int action = event.getAction();
int y = (int) event.getY();

obtainVelocity(event);
switch (action)
{
case MotionEvent.ACTION_DOWN:

mScrollStart = getScrollY();
mLastY = y;
break;
case MotionEvent.ACTION_MOVE:

if (!mScroller.isFinished())
{
mScroller.abortAnimation();
}

int dy = mLastY - y;
// 边界值检查
int scrollY = getScrollY();
// 已经到达顶端,下拉多少,就往上滚动多少
if (dy < 0 && scrollY + dy < 0)
{
dy = -scrollY;
}
// 已经到达底部,上拉多少,就往下滚动多少
if (dy > 0 && scrollY + dy > getHeight() - mScreenHeight)
{
dy = getHeight() - mScreenHeight - scrollY;
}

scrollBy(0, dy);
mLastY = y;
break;
case MotionEvent.ACTION_UP:

mScrollEnd = getScrollY();

int dScrollY = mScrollEnd - mScrollStart;

if (wantScrollToNext())// 往上滑动
{
if (shouldScrollToNext())
{
mScroller.startScroll(0, getScrollY(), 0, mScreenHeight - dScrollY);

} else
{
mScroller.startScroll(0, getScrollY(), 0, -dScrollY);
}

}

if (wantScrollToPre())// 往下滑动
{
if (shouldScrollToPre())
{
mScroller.startScroll(0, getScrollY(), 0, -mScreenHeight - dScrollY);

} else
{
mScroller.startScroll(0, getScrollY(), 0, -dScrollY);
}
}
isScrolling = true;
postInvalidate();
recycleVelocity();
break;
}

return true;
}

/**
* 根据滚动距离判断是否能够滚动到下一页
*
* @return
*/
private boolean shouldScrollToNext()
{
return mScrollEnd - mScrollStart > mScreenHeight / 2 || Math.abs(getVelocity()) > 600;
}

/**
* 根据用户滑动,判断用户的意图是否是滚动到下一页
*
* @return
*/
private boolean wantScrollToNext()
{
return mScrollEnd > mScrollStart;
}

/**
* 根据滚动距离判断是否能够滚动到上一页
*
* @return
*/
private boolean shouldScrollToPre()
{
return -mScrollEnd + mScrollStart > mScreenHeight / 2 || Math.abs(getVelocity()) > 600;
}

/**
* 根据用户滑动,判断用户的意图是否是滚动到上一页
*
* @return
*/
private boolean wantScrollToPre()
{
return mScrollEnd < mScrollStart;
}

@Override
public void computeScroll()
{
super.computeScroll();
if (mScroller.computeScrollOffset())
{
scrollTo(0, mScroller.getCurrY());
postInvalidate();
} else
{

int position = getScrollY() / mScreenHeight;

Log.e("xxx", position + "," + currentPage);
if (position != currentPage)
{
if (mOnPageChangeListener != null)
{
currentPage = position;
mOnPageChangeListener.onPageChange(currentPage);
}
}

isScrolling = false;
}

}

/**
* 获取y方向的加速度
*
* @return
*/
private int getVelocity()
{
mVelocityTracker.computeCurrentVelocity(1000);
return (int) mVelocityTracker.getYVelocity();
}

/**
* 释放资源
*/
private void recycleVelocity()
{
if (mVelocityTracker != null)
{
mVelocityTracker.recycle();
mVelocityTracker = null;
}
}

/**
* 初始化加速度检测器
*
* @param event
*/
private void obtainVelocity(MotionEvent event)
{
if (mVelocityTracker == null)
{
mVelocityTracker = VelocityTracker.obtain();
}
mVelocityTracker.addMovement(event);
}

/**
* 设置回调接口
*
* @param onPageChangeListener
*/
public void setOnPageChangeListener(OnPageChangeListener onPageChangeListener)
{
mOnPageChangeListener = onPageChangeListener;
}

/**
* 回调接口
*
* @author zhy
*
*/
public interface OnPageChangeListener
{
void onPageChange(int currentPage);
}
}


3、再来一个布局文件:

<com.zanelove.VerticalLinearLayoutDemo.VerticalLinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/id_main_ly"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#fff" >

<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/guide_1"/>

<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/guide_2"/>

<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/guide_3"/>

<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/guide_4"/>

</com.zanelove.VerticalLinearLayoutDemo.VerticalLinearLayout>


4、最终逻辑代码–MyActivity

public class MyActivity extends Activity {
private VerticalLinearLayout mVertical_LL;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

mVertical_LL = (VerticalLinearLayout) findViewById(R.id.id_main_ly);
mVertical_LL.setOnPageChangeListener(new VerticalLinearLayout.OnPageChangeListener() {
@Override
public void onPageChange(int currentPage) {
Toast.makeText(MyActivity.this,"第"+currentPage+"页",Toast.LENGTH_SHORT).show();
}
});
}
}


在此希望大家,跟我一起解决两个问题:

1、解决版本兼容问题,使得2.3及以上的版本都能运行成功!

2、仔细的大神们也许看出来了,那就是图片显示超出了屏幕范围,一部分图片最下边看不到,如何解决?

望大家积极进言献策!谢谢!

免责声明:转载http://blog.csdn.net/lmj623565791/article/details/23692439

示例代码戳Here
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息