使用ViewPager模拟实现应用程序启动界面(一)

           经常在开发应用程序的时候,软件启动有启用动画界面,一般使用图片来进行界面该版本最新更新等等内容,今天来使用ViewPager来模拟实现这功能,也希望对大家有个小小的参考作用,在以后的项目中能够使用到。

       首先准备工作,若干张需要进行显示的图片和底部用到的小圆圈

        项目结构图如下:

       

        2:运行效果图



         大致效果如上,具体编码实现:

    布局文件是android.support.v4.view.ViewPager和底部五个小圆圈main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    >

    <android.support.v4.view.ViewPager
        android:id="@+id/myViewpager"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        />
    
    <LinearLayout 
        android:id="@+id/linearlayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        >
        <ImageView 
            android:id="@+id/img1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/point_selector"
            android:padding="17dip"/>
        <ImageView 
            android:id="@+id/img2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/point_selector"
            android:padding="17dip"/>
        <ImageView 
            android:id="@+id/img3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/point_selector"
            android:padding="17dip"/>
        <ImageView 
            android:id="@+id/img4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/point_selector"
            android:padding="17dip"/>
         <ImageView 
            android:id="@+id/img5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/point_selector"
            android:padding="17dip"/>
        
    </LinearLayout>

</RelativeLayout>


 ViewPageAdapter.java ViewPager页面的适配器

/**
 * 自定义ViewPager适配器
 * @author jiangqingqing
 *
 */
public class MyViewPagerAdapter extends PagerAdapter {

	private List<View> mLists;
	public MyViewPagerAdapter(List<View> pLists)
	{
		this.mLists=pLists;
	}
	@Override
	public int getCount() {
		// TODO Auto-generated method stub
		return mLists.size();
	}

	@Override
	public boolean isViewFromObject(View arg0, Object arg1) {
		// TODO Auto-generated method stub
		return arg0==arg1;
	}

	@Override
	public void destroyItem(View container, int position, Object object) {
		((ViewPager)container).removeView(mLists.get(position));
	}

	@Override
	public Object instantiateItem(View container, int position) {
		((ViewPager)container).addView(mLists.get(position));
		return mLists.get(position);
	}
MainActicvity.java

/**
 * 使用ViePager简单模拟 应用的启动动画界面
 * @author jiangqingqing
 *
 */
public class MainActivity extends Activity {

	private ViewPager mViewPager;
	private MyViewPagerAdapter mAdapter;
	private LinearLayout mLinearLayout;
	private List<View> mLists = new ArrayList<View>();
	private Integer[] img_ids = new Integer[] { R.drawable.guide_01,
			R.drawable.guide_02, R.drawable.guide_03, R.drawable.guide_04,
			R.drawable.guide_05 };
	private ImageView[] points = new ImageView[img_ids.length];

	private int current=0;//默认在第一页 
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
		mViewPager = (ViewPager) this.findViewById(R.id.myViewpager);
		mLinearLayout = (LinearLayout) this.findViewById(R.id.linearlayout);

		//把需要显示的图片加入到ViewPager页面集合中
		for (int i = 0; i < img_ids.length; i++) {
			ImageView iv = new ImageView(this);
			iv.setLayoutParams(new LinearLayout.LayoutParams(
					LinearLayout.LayoutParams.FILL_PARENT,
					LinearLayout.LayoutParams.FILL_PARENT));
			iv.setImageResource(img_ids[i]);
			mLists.add(iv);
		}
		
		mAdapter=new MyViewPagerAdapter(mLists);
		mViewPager.setAdapter(mAdapter);
		
		//为ViewPager选项卡添加  切换时候的监听
		mViewPager.setOnPageChangeListener(new MyOnPagerChangeListener());
		//初始化下面的小圆点
		initPoints();	
	}
 
	  //初始化下面的小圆点
      private void initPoints()
      {
    	  for(int i=0;i<img_ids.length;i++)
    	  {
    		  points[i]=(ImageView)mLinearLayout.getChildAt(i);
    		  points[i].setImageResource(R.drawable.point_normal);
    		  
    	  }
    	  current=0;//默认在第一页
    	  points[current].setImageResource(R.drawable.point_select);//此刻处于第一页,把第一页的小圆圈设置为unenabled
      }
	   
	   class MyOnPagerChangeListener implements OnPageChangeListener
	   {
		@Override
		public void onPageScrollStateChanged(int arg0) {
						
		}
		@Override
		public void onPageScrolled(int arg0, float arg1, int arg2) {
				
		}
		@Override
		public void onPageSelected(int arg0) {
			
			points[arg0].setImageResource(R.drawable.point_select);
			points[current].setImageResource(R.drawable.point_normal);
			current=arg0;
		}
		   
	   }

    这个Demo例子比较简单,但是可以实现我们需要的效果。详细代码在下面的链接,有兴趣的可以下载下来跑一下

   http://download.csdn.net/detail/jiangqq781931404/5776739

   

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值