android仿系统Launcher界面,实现分屏,左右滑动效果(ViewSwitcher)

ViewSwitcher代表了视图切换组件, 本身继承了FrameLayout ,可以将多个View叠在一起 ,每次只显示一个组件.当程序控制从一个View切换到另个View时,ViewSwitcher 支持指定动画效果.

为了给ViewSwitcher 添加多个组件, 一般通过ViewSwitcher 的setFactory 方法为止设置ViewFactory ,并由ViewFactory为之创建View 即可. 

下面通过一个实例来介绍 ViewSwitcher的用法.(仿Android系统Launcher 界面 实现分屏 左右滑动效果)


第一步,新建项目,打开activity_main.xml
<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"
    tools:context="com.example.viewswitchdemo.MainActivity" >
    <ViewSwitcher 
        android:id="@+id/viewSwitcher"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        ></ViewSwitcher>
    
    <!-- 定义滚动到上一屏的按钮 -->  
    <Button  
        android:id="@+id/button_prev"  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:layout_alignParentBottom="true"  
        android:layout_alignParentLeft="true"  
        android:onClick="prev"  
        android:text="P" />  
    <!-- 定义滚动到下一屏的按钮 -->  
    <Button  
        android:id="@+id/button_next"  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:layout_alignParentBottom="true"  
        android:layout_alignParentRight="true"  
        android:onClick="next"  
        android:text="L" />  
</RelativeLayout>
在这个布局中,创建了一个ViewSwitcher,表示这里是可变的View,还有一个往前和往后的按钮

2,新建slidelistview.xml,  这个视图就表示ViewSwitcher中变化的View
<?xml version="1.0" encoding="utf-8"?>  
<GridView  
  xmlns:android="http://schemas.android.com/apk/res/android"  
  android:layout_width="match_parent"  
  android:numColumns="4"  
  android:layout_height="match_parent">  
      
</GridView>  

3,新建item.xml,表示gridView的子视图
<?xml version="1.0" encoding="utf-8"?>  
<!-- 定义一个垂直的LinearLayout,该容器中放置一个ImageView和一个TextView -->  
<LinearLayout  
    xmlns:android="http://schemas.android.com/apk/res/android"  
    android:orientation="vertical"  
    android:layout_width="match_parent"  
    android:layout_height="match_parent"  
    android:gravity="center">  
    <ImageView  
        android:id="@+id/imageview"  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
         />  
    <TextView  
        android:id="@+id/textview"  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:gravity="center"  
         />    
</LinearLayout>   

4,打开MainActivity.java
public class MainActivity extends Activity {
    //每一屛显示的应用数
    public static final int NUMBER_PRE_SCREEN=12;
    //应用程序的内部类
    public static class DataItem{
        //应用名字
        public String dataName;
        //应用程序图片
        public Drawable drawable;
    }
    
    //保存系统应用的集合
    private List<DataItem> items=new ArrayList<MainActivity.DataItem>();
    
    //记录当前正是显示的第几屏应用
    private int screenNo=-1;
    //程序所占的总屏数
    private int screenCount;
    ViewSwitcher switcher;
    LayoutInflater inflater;
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        inflater=LayoutInflater.from(this);
        //模拟40个应用程序
        for (int i = 0; i < 40; i++) {
            String label=""+i;
            Drawable draw=getResources().getDrawable(R.drawable.ic_launcher);
            DataItem item=new DataItem();
            item.dataName=label;
            item.drawable=draw;
            items.add(item);
        }
        // 计算应用程序所占的总屏数。  
        // 如果应用程序的数量能整除NUMBER_PER_SCREEN,除法的结果就是总屏数。  
        // 如果不能整除,总屏数应该是除法的结果再加1。 
        screenCount = items.size() % NUMBER_PRE_SCREEN == 0 ?   
                items.size()/ NUMBER_PRE_SCREEN :  
                items.size() / NUMBER_PRE_SCREEN    + 1;
                
       switcher=(ViewSwitcher) findViewById(R.id.viewSwitcher);
       switcher.setFactory(new ViewFactory() {
        @Override
        public View makeView() {
            return inflater.inflate(R.layout.slidelistview,null);
        }
       });
       
       next(null);
       Button b1=(Button) findViewById(R.id.button_next);
       b1.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View arg0) {
            next(null);
        }
    });
       Button b2=(Button) findViewById(R.id.button_prev);
       b2.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View arg0) {
            pre(null);
        }
    });
       
    }
    
    public void next(View v){
        if(screenNo<screenCount-1){
            screenNo++;
            switcher.setInAnimation(this,android.R.anim.slide_in_left);
            switcher.setOutAnimation(this,android.R.anim.slide_out_right);
            GridView gv=(GridView) switcher.getNextView();
            gv.setAdapter(adapter);
            switcher.showNext();
        }
    }
    
    public void pre(View v){
        if(screenNo>0){
            screenNo--;
            switcher.setInAnimation(this,android.R.anim.slide_in_left);
            switcher.setOutAnimation(this,android.R.anim.slide_out_right);
            GridView gv=(GridView) switcher.getNextView();
            gv.setAdapter(adapter);
            switcher.showPrevious();
        }
    }
    
    private BaseAdapter adapter =new BaseAdapter() {
        
        @Override
        public View getView(int position, View convertView, ViewGroup arg2) {
            View view = convertView;  
            if (convertView == null)  
            {  
                // 加载R.layout.labelicon布局文件  
                view = inflater.inflate(R.layout.itemnull);  
            }  
            // 获取R.layout.labelicon布局文件中的ImageView组件,并为之设置图标  
            ImageView imageView = (ImageView)  
                    view.findViewById(R.id.imageview);
            DataItem it=(DataItem) getItem(position);
            imageView.setImageDrawable(it.drawable);  
            // 获取R.layout.labelicon布局文件中的TextView组件,并为之设置文本  
            TextView textView = (TextView)   
                    view.findViewById(R.id.textview);  
            textView.setText(it.dataName);  
            return view;  
        }
        
        @Override
        public long getItemId(int arg0) {
            return arg0;
        }
        
        @Override
        public Object getItem(int position) {
            return items.get(screenNo * NUMBER_PRE_SCREEN + position);  
        }
        
        @Override
        public int getCount() {
            // 如果已经到了最后一屏,且应用程序的数量不能整除NUMBER_PER_SCREEN  
            if (screenNo == screenCount - 1  
                    && items.size() % NUMBER_PRE_SCREEN != 0)  
            {  
                // 最后一屏显示的程序数为应用程序的数量对NUMBER_PER_SCREEN求余  
                return items.size() % NUMBER_PRE_SCREEN;  
            }  
            // 否则每屏显示的程序数量为NUMBER_PER_SCREEN  
            return NUMBER_PRE_SCREEN;  
        }
    };
    
    
    
} 





posted @ 2014-10-03 20:36  冷冷汤圆  阅读(4202)  评论(0编辑  收藏  举报