杭州华育LOGO

学员作品 学员心得 技术园地 潮人地 Android(安卓)培训 杭州电脑(计算机)培训 杭州网络营销培训 杭州JAVA培训
返回首页

杭州安卓培训名博之Android ViewPager实现应用启动界面

时间:2014-12-03 23:11来源:csdn 作者:laichunlin 点击:
Android应用启动界面可以使用Google提供的ViewPager来实现。ViewPager的使用可以对比ListView的使用,即设计UI、构造数据源、创建适配器,设置适配器。启动页面上显示的一般是版本、宣传等信息,因此不需要构造数据源,只需创建适配器,设置适配器。详细内容

 Android应用启动界面可以使用Google提供的ViewPager来实现。ViewPager的使用可以对比ListView的使用,即设计UI、构造数据源、创建适配器,设置适配器。启动页面上显示的一般是版本、宣传等信息,因此不需要构造数据源,只需创建适配器,设置适配器。详细内容如下:

1、UI设计

    启动页面的设计分为两部分,一部分是宿主页面即ViewPager所在页面,另一部分是滑动页面,首先设计ViewPager的宿主页面activity_main.xml,代码如下:

 

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent"  
  5.     android:orientation="vertical"  
  6.     tools:context=".MainActivity" >  
  7.   
  8.     <android.support.v4.view.ViewPager  
  9.         android:id="@+id/vpage"  
  10.         android:layout_width="fill_parent"  
  11.         android:layout_height="fill_parent"  
  12.         android:layout_above="@+id/ll_dot"/>  
  13.   
  14.     <LinearLayout   
  15.         android:id="@+id/ll_dot"  
  16.         android:layout_width="fill_parent"  
  17.         android:layout_height="wrap_content"  
  18.         android:layout_alignParentBottom="true"  
  19.         android:layout_marginBottom="40dp"  
  20.         android:gravity="center_horizontal"  
  21.         android:orientation="horizontal">  
  22.           
  23.         <ImageView   
  24.             android:id="@+id/iv_01"  
  25.             android:layout_width="14dp"  
  26.             android:layout_height="14dp"  
  27.             android:src="@drawable/blue"/>  
  28.         <ImageView   
  29.             android:id="@+id/iv_02"  
  30.             android:layout_width="14dp"  
  31.             android:layout_height="14dp"  
  32.             android:layout_marginLeft="10dp"  
  33.             android:src="@drawable/gray"/>  
  34.         <ImageView   
  35.             android:id="@+id/iv_03"  
  36.             android:layout_width="14dp"  
  37.             android:layout_height="14dp"  
  38.             android:layout_marginLeft="10dp"  
  39.             android:src="@drawable/gray"/>  
  40.           
  41.     </LinearLayout>  
  42.       
  43. </RelativeLayout>  

 

    该页面为上下布局,上面是一个ViewPager,下面是滑动对应的小圆点,ViewPager中滑动的页面不会太多,可以直接写在xml布局文件中。滑动页面就是一张图片的展示,分为item1.xml、item2.xml、item3.xml,三个页面布局一样,item1.xml的代码如下:

 

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:orientation="vertical" >  
  6.       
  7.     <LinearLayout   
  8.         android:layout_width="fill_parent"  
  9.         android:layout_height="fill_parent"  
  10.         android:layout_marginLeft="6dp"  
  11.         android:layout_marginRight="6dp"  
  12.         android:layout_marginTop="50dp"  
  13.         android:layout_marginBottom="50dp">  
  14.           
  15.         <ImageView   
  16.             android:layout_width="wrap_content"  
  17.             android:layout_height="wrap_content"  
  18.             android:src="@drawable/img1"/>  
  19.     </LinearLayout>  
  20. </LinearLayout>  

 

2、创建适配器

    新建ViewPagerAdapter类继承PagerAdapter,重写destoryItem和instantiateItem,适配器需要传入刚才创建的滑动页面,在此创建了一个viewList私用变量用来保存滑动页面。ViewPagerAdapter.java代码如下:

 

  1. package com.example.myloadview;  
  2.   
  3. import java.util.ArrayList;  
  4.   
  5. import android.os.Parcelable;  
  6. import android.support.v4.view.PagerAdapter;  
  7. import android.support.v4.view.ViewPager;  
  8. import android.view.View;  
  9.   
  10. public class ViewPagerAdapter extends PagerAdapter {  
  11.   
  12.     private ArrayList<View> viewList;  
  13.       
  14.     public ViewPagerAdapter(ArrayList<View> _viewList) {  
  15.         this.viewList=_viewList;  
  16.     }  
  17.       
  18.     @Override  
  19.     public int getCount() {  
  20.         return viewList.size();  
  21.     }  
  22.   
  23.     @Override  
  24.     public boolean isViewFromObject(View arg0, Object arg1) {  
  25.         return arg0==arg1;  
  26.     }  
  27.       
  28.     @Override  
  29.     public void destroyItem(View container, int position, Object object) {  
  30.         ((ViewPager) container).removeView(viewList.get(position));  
  31.     }  
  32.       
  33.     @Override  
  34.     public Object instantiateItem(View container, int position) {  
  35.         ((ViewPager) container).addView(viewList.get(position));  
  36.         return viewList.get(position);  
  37.     }  
  38.       
  39. }  

 

3、设置适配器

    适配器在MainActivity.java中设置。MainActivity.java中要做的是创建滑动视图列表,创建小圆点列表,实例化ViewPager,给ViewPager设置适配器。页面滑动切换时对应的小圆点也需要切换,在此需要给ViewPager注册事件。详细代码如下:

 

  1. @Override  
  2. protected void onCreate(Bundle savedInstanceState) {  
  3.     super.onCreate(savedInstanceState);  
  4.     // 设置无标题窗口  
  5.        requestWindowFeature(Window.FEATURE_NO_TITLE);  
  6.     setContentView(R.layout.activity_main);  
  7.       
  8.     LayoutInflater inflater=getLayoutInflater();  
  9.     views=new ArrayList<View>();  
  10.     views.add(inflater.inflate(R.layout.item1, null));  
  11.     views.add(inflater.inflate(R.layout.item2, null));  
  12.     views.add(inflater.inflate(R.layout.item3, null));  
  13.       
  14.     images=new ArrayList<ImageView>();  
  15.     images.add((ImageView)findViewById(R.id.iv_01));  
  16.     images.add((ImageView)findViewById(R.id.iv_02));  
  17.     images.add((ImageView)findViewById(R.id.iv_03));  
  18.       
  19.     viewPager=(ViewPager)findViewById(R.id.vpage);  
  20.     viewPager.setAdapter(new ViewPagerAdapter(views));  
  21.     viewPager.setOnPageChangeListener(new ViewPagerChangeListener());  
  22. }  

 

ViewPagerChangeListener继承OnPageChangeListener在onPageSelected做小圆点图片的切换,详细代码如下:

  1. class ViewPagerChangeListener implements OnPageChangeListener{  
  2.   
  3.         @Override  
  4.         public void onPageScrollStateChanged(int arg0) {  
  5.             // TODO Auto-generated method stub  
  6.               
  7.         }  
  8.   
  9.         @Override  
  10.         public void onPageScrolled(int arg0, float arg1, int arg2) {  
  11.             // TODO Auto-generated method stub  
  12.               
  13.         }  
  14.   
  15.         @Override  
  16.         public void onPageSelected(int arg0) {  
  17.             for (int i = 0; i < images.size(); i++) {  
  18.                 images.get(i).setImageResource(R.drawable.gray);  
  19.                 if (arg0==i) {  
  20.                     images.get(i).setImageResource(R.drawable.blue);  
  21.                 }  
  22.             }  
  23.         }  
  24.           
  25.     }  

到此一个简单的android应用启动界面就实现了。

Demo源码链接
 

(责任编辑:杭州华育 ;杭州java培训,网络营销培训,杭州计算机培训,it培训,详询客服报名咨询
分享到:
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
提交报名信息

2018年杭州将加大力度经济转型,吸纳更多的技术人才落户杭州,软件人才需求量更是大幅提升,针对目前杭州IT行业人才需求“井喷”现象,华育软件杭州实训基地与杭州155家IT名企合作,建立人才培养与输送关系,启动“Eduask国家高端IT紧缺人才培养工程”。5月针对杭州地区18-28岁大中专生待业青年发放68个技能实训名额(应届大中专毕业生优先),经短期专业岗前实训后推荐进入企业,起薪4500-8000元,五险一金。

姓名: * 性别:
学历: 电话: *
所在地: *
您目前状况:
留言:
*