安卓学习笔记之制作ViewPager欢迎界面
2016-07-06 22:12
507 查看
实现步骤
编写布局文件编写ViewPAger适配器类
初始化ViewPage,设置适配器和滑动监听
初始化ViewPager数据源与页面矩形指示
对ViewPager的页面滑动事件做处理,达到矩形指示跟随手的滑动而滑动
实现跳转到主页
具体代码
布局文件
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v4.view.ViewPager android:id="@+id/vp" android:layout_width="match_parent" android:layout_height="wrap_content" /> <!-- 页面指示器 --> <RelativeLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true"> <LinearLayout android:id="@+id/ll_rect" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" android:paddingBottom="10dp"/> <ImageView android:id="@+id/iv_greenRect" android:layout_width="wrap_content" android:layo android:src="@drawable/rect_green"/> </RelativeLayout> </RelativeLayout>
编写ViewPAger适配器类ViewPagewAdapter类
package com.yu.viewpager02; import android.support.v4.view.PagerAdapter; import android.view.View; import android.view.ViewGroup; import java.util.List; /** * Created by pecu on 2016/07/06. */ public class ViewPagewAdapter<T> extends PagerAdapter { List<T> datas; public ViewPagewAdapter(List<T> datas) { this.datas = datas; } @Override public int getCount() { return datas.size(); } @Override public boolean isViewFromObject(View view, Object object) { return view == object; } @Override public Object instantiateItem(ViewGroup container, int position) { container.addView((View) datas.get(position)); return datas.get(position); } @Override public void destroyItem(ViewGroup container, int position, Object object) { // super.destroyItem(container, position, object); container.removeView((View) datas.get(position)); } }
GuideActivity 类
初始化ViewPage,设置适配器和滑动监听初始化ViewPager数据源与页面矩形指示
对ViewPager的页面滑动事件做处理,达到矩形指示跟随手的滑动而滑动
实现跳转到主页
package com.yu.viewpager02; import android.app.Activity; import android.content.Intent; import android.os.Bundle; import android.support.v4.view.ViewPager; import android.view.View; import android.view.ViewGroup; import android.view.ViewTreeObserver; import android.widget.Button; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.RelativeLayout; import java.util.ArrayList; import java.util.List; public class Guide extends Activity implements ViewPager.OnPageChangeListener { ViewPager vp; int images[] = new int[]{R.mipmap.guide1, R.mipmap.guide2, R.mipmap.guide3}; List<View> views; LinearLayout ll_rect; // 灰色矩形容器 ImageView greenRect; // 绿色矩形 int rectMargin; // 矩形间隔 Button btn_enter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initView(); initrect(); vp = (ViewPager) findViewById(R.id.vp); vp.setAdapter(new ViewPagewAdapter<View>(views)); vp.addOnPageChangeListener(this); } // 初始化用于显示到屏幕的视图 private void initView() { views = new ArrayList<View>(); for (int i = 0; i < images.length; i++) { ImageView iv = new ImageView(Guide.this); iv.setImageResource(images[i]); views.add(iv); } btn_enter = (Button) findViewById(R.id.btn_enter); btn_enter.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { startActivity(new Intent(Guide.this,MainActivity.class));//跳转到主页 finish(); } }); } // 初始化矩形 private void initrect() { ll_rect = (LinearLayout) findViewById(R.id.ll_rect); for (int i = 0; i < images.length; i++) { ImageView iv = new ImageView(Guide.this); iv.setImageResource(R.drawable.rect_grey); LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, -2); if (i > 0) params.leftMargin = 10; // 设置点的间距 iv.setLayoutParams(params); final int finalI = i; iv.setOnClickListener(new View.OnClickListener() { // 设置监听事件 @Override public void onClick(View v) { vp.setCurrentItem(finalI); // 跳转到指定页 } }); ll_rect.addView(iv); } greenRect = (ImageView) findViewById(R.id.iv_greenRect); // 设置视图树的监听 当所有view初始化完毕时调用 用于测量两个矩形的中心的距离 greenRect.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { @Override public void onGlobalLayout() { greenRect.getViewTreeObserver().removeOnGlobalLayoutListener(this); // 两点间距 rectMargin = ll_rect.getChildAt(1).getLeft() - ll_rect.getChildAt(0).getLeft(); } }); } /** * 页面滑动时调用 * * @param position * @param positionOffset 参数在[0,1)范围 , 表示已滑动偏移比例 * @param positionOffsetPixels 滑动偏移量 */ @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { // System.out.println("positionOffset:"+positionOffset+",positionOffsetPixels:"+positionOffsetPixels); int leftMargin = (int) (position * rectMargin + positionOffset * rectMargin); RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) greenRect.getLayoutParams(); params.leftMargin = leftMargin; greenRect.setLayoutParams(params); } // 页面选中时调用 @Override public void onPageSelected(int position) { if (position == images.length - 1) btn_enter.setVisibility(View.VISIBLE); else btn_enter.setVisibility(View.GONE); } // 页面状态在变时调用 @Override public void onPageScrollStateChanged(int state) { } }
用于绘制矩形的shape
<!-- 当前页矩形 --> <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <size android:height="5dp" android:width="20dp"/> <solid android:color="#0f9"/> </shape> ---------- <?xml version="1.0" encoding="utf-8"?> <!-- 非选中 --> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <size android:height="4dp" android:width="20dp"/> <solid android:color="#666"/> </shape>
效果图
相关文章推荐
- Linux下的C语言开发(Makefile编写)
- 始于《Android群英传》止于源码 1 之 Android控件架构
- ARM寄存器和处理器模式
- python mock基本使用
- 《机器学习》周志华 习题答案9.4
- linux执行sh脚本文件命令
- 顺序容器的功能对比
- 使用console调试JavaScript(一)
- iOS可变参数函数的编写
- ADS下的分散加载文件应用实例
- linux下的C语言开发(gdb调试)
- 【Arduino官方教程】数字处理示例(三):按键防抖
- logstash实现日志文件同步到elasticsearch深入详解
- 盒子嵌套
- linux下安装ffmpeg
- KindEditor编辑器关闭过滤html,js,css标题方法
- POJ 3784 Running Median
- ARM 必须知道的知识
- MyEclipse破解失败的解决办法 ---谷营中西
- JVM内存区域