标签:
Android App 第一次打开时的引导界面,这个需求是非常多的。在写新项目的时候,刚好要用到,在网上找了一下 demo,没发现非满意的。所以只好自己动手写一个,分享一下,避免以后大家重复造轮子。效果图如下(虽然有点丑)
上面这个就是引导界面 GuideActivity 的界面了,实现思路很简单:主界面用 FrameLayout 布局,后面用 ViewPager 装载图片。下面几个小点指示当前滑动到哪个界面了,因为没现在的控制可用,所以自定义了一个 InidcatorView,布局文件如下
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" > <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="match_parent" /> <cn.guide.IndicatorView android:id="@+id/indicatorView" android:layout_width="match_parent" android:layout_height="45dp" android:layout_marginBottom="30dp" android:layout_gravity="bottom|center_horizontal"/> </FrameLayout>
public class IndicatorView extends View{setIndicatorCount 用来设置总共有多少个点,引导界面要加载多少张图,setIndicatorCount 的参数就设置成多少就可以了。setCurIndicatorIndex 用来设置当前滑动到哪个点上了,顺便刷新界面。因为比较简单,所以就不做太多介绍了
private static final String LOG_TAG = IndicatorView.class.getName();
private int mCurrentIndicatorIndex = 0;
private int mIndicatorCount = 4;
private int mIndicatorDistance = 30; // 圆点之间的距离(圆心距)
private int mStartDotX;
private int mDotY;
private Paint mPaint;
public IndicatorView(Context context) {
super(context, null);
}
public IndicatorView(Context context, AttributeSet attrs){
super(context, attrs);
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaint.setStyle(Paint.Style.FILL);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec){
int viewWidth = MeasureSpec.getSize(widthMeasureSpec);
int viewHeight = MeasureSpec.getSize(heightMeasureSpec);
int drawWidth = (mIndicatorCount + 1) * mIndicatorDistance;
mStartDotX = (viewWidth - drawWidth) / 2;
mDotY = viewHeight / 2;
setMeasuredDimension(viewWidth, viewHeight) ;
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
float currentDotX = mStartDotX;
for(int i = 0; i < mIndicatorCount; i++) {
currentDotX += mIndicatorDistance;
if(i == mCurrentIndicatorIndex) {
mPaint.setColor(0x7fff0000);
} else {
mPaint.setColor(0x7f0000ff);
}
canvas.drawCircle(currentDotX, mDotY, 10, mPaint);
}
}
public void setIndicatorCount(int count) {
mIndicatorCount = count;
}
public void setCurIndicatorIndex(int index) {
mCurrentIndicatorIndex = index;
invalidate();
}
}
标签:
原文地址:http://blog.csdn.net/runninglion/article/details/51334483