码迷,mamicode.com
首页 > 移动开发 > 详细

android--多View切换viewpager

时间:2014-09-24 22:04:27      阅读:385      评论:0      收藏:0      [点我收藏+]

标签:des   android   style   blog   http   color   io   os   java   

网上看到viewpager的多view动画切换,模仿制作了一个  学习到了。

先看效果图:

bubuko.com,布布扣     bubuko.com,布布扣

先看主类的layout

bubuko.com,布布扣
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:background="#222222" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView 
            android:id="@+id/textView1"
            android:layout_weight="1"
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:background="#999999"
            android:gravity="center"
            android:text="页面1"
            android:textColor="#222222"
            />
        <TextView 
            android:id="@+id/textView2"
            android:layout_weight="1"
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:background="#999999"
            android:gravity="center"
            android:text="页面2"
            android:textColor="#222222"
            />
        <TextView
            android:id="@+id/textView3"
            android:layout_weight="1"
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:background="#999999"
            android:gravity="center"
            android:text="页面3"
            android:textColor="#222222"
            />
    </LinearLayout>
    <ImageView 
        android:id="@+id/cursor"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:scaleType="matrix"
        android:src="@drawable/cursor"
        android:background="#222222"/>
    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        />
    
</LinearLayout>
bubuko.com,布布扣

 

viewPager需要一个pagerAdapter的子类

bubuko.com,布布扣
package com.example.myview;

import java.util.List;
import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.support.v4.view.ViewPager;

public class MyAdapter extends PagerAdapter{

    List<View> viewLists;
    
    public MyAdapter(List<View> lists)
    {
        viewLists = lists;
    }

    @Override
    public int getCount() {                                                                 //获得size
        // TODO Auto-generated method stub
        return viewLists.size();
    }

    @Override
    public boolean isViewFromObject(View arg0, Object arg1) {                         
        // TODO Auto-generated method stub
        return arg0 == arg1;
    }
    
    @Override
    public void destroyItem(View view, int position, Object object)                       //销毁Item
    {
        ((ViewPager) view).removeView(viewLists.get(position));
    }
    
    @Override
    public Object instantiateItem(View view, int position)                                //实例化Item
    {
        ((ViewPager) view).addView(viewLists.get(position), 0);
        return viewLists.get(position);
    }
    
}
bubuko.com,布布扣

最后Main类

bubuko.com,布布扣
package com.example.myview;

import java.util.List;
import java.util.ArrayList;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.widget.TextView;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.util.DisplayMetrics;
import android.graphics.Matrix;
import android.widget.ImageView;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;

public class MainActivity extends Activity {

    private ViewPager viewPager;
    private ImageView imageView;
    private List<View> lists = new ArrayList<View>();
    private MyAdapter myAdapter;
    private Bitmap cursor;
    private int offSet;
    private int currentItem;
    private Matrix matrix = new Matrix();
    private int bmWidth;
    private Animation animation;
    private TextView textView1;
    private TextView textView2;
    private TextView textView3;
    
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        imageView = (ImageView) findViewById (R.id.cursor);
        textView1 = (TextView) findViewById (R.id.textView1);
        textView2 = (TextView) findViewById (R.id.textView2);
        textView3 = (TextView) findViewById (R.id.textView3);
        
        lists.add(getLayoutInflater().inflate(R.layout.layout1, null));
        lists.add(getLayoutInflater().inflate(R.layout.layout2, null));
        lists.add(getLayoutInflater().inflate(R.layout.layout3, null));
        
        initeCursor();
        
        myAdapter = new MyAdapter(lists);
        
        viewPager = (ViewPager) findViewById (R.id.viewPager);
        viewPager.setAdapter(myAdapter);
        viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            
            @Override
            public void onPageSelected(int arg0) {                                 //当滑动式,顶部的imageView是通过animation缓慢的滑动
                // TODO Auto-generated method stub
                switch (arg0)
                {
                case 0:
                    if (currentItem == 1)
                    {
                        animation = new TranslateAnimation(
                                offSet * 2 + bmWidth, 0 , 0, 0);
                    }
                    else if(currentItem == 2)
                    {
                        animation = new TranslateAnimation(
                                offSet * 4 + 2 * bmWidth, 0, 0, 0);
                    }
                    break;
                case 1:
                    if (currentItem == 0)
                    {
                        animation = new TranslateAnimation(
                                0, offSet * 2 + bmWidth, 0, 0);
                    }
                    else if (currentItem == 2)
                    {
                        animation = new TranslateAnimation(
                                4 * offSet + 2 * bmWidth, offSet * 2 + bmWidth, 0, 0);
                    }
                    break;
                case 2:
                    if (currentItem == 0)
                    {
                        animation = new TranslateAnimation(
                                0, 4 * offSet + 2 * bmWidth, 0, 0);
                    }
                    else if (currentItem == 1)
                    {
                        animation = new TranslateAnimation(
                                offSet * 2 + bmWidth, 4 * offSet + 2 * bmWidth, 0, 0);
                    }
                }
                currentItem = arg0;
                
                animation.setDuration(500);
                animation.setFillAfter(true);
                imageView.startAnimation(animation);
                
            }
            
            @Override
            public void onPageScrolled(int arg0, float arg1, int arg2) {
                // TODO Auto-generated method stub
                
            }
            
            @Override
            public void onPageScrollStateChanged(int arg0) {
                // TODO Auto-generated method stub
                
            }
        });
        
        textView1.setOnClickListener(new View.OnClickListener() {
            
            @Override
            public void onClick(View arg0) {
                // TODO Auto-generated method stub
                viewPager.setCurrentItem(0);
            }
        });
        
        textView2.setOnClickListener(new View.OnClickListener() {
            
            @Override
            public void onClick(View arg0) {
                // TODO Auto-generated method stub
                viewPager.setCurrentItem(1);
            }
        });
        
        textView3.setOnClickListener(new View.OnClickListener() {
            
            @Override
            public void onClick(View arg0) {
                // TODO Auto-generated method stub
                viewPager.setCurrentItem(2);
            }
        });
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.activity_main, menu);
        return true;
    }
    
    private void initeCursor()
    {
        cursor = BitmapFactory.decodeResource(getResources(), R.drawable.cursor);
        bmWidth = cursor.getWidth();
        
        DisplayMetrics dm;
        dm = getResources().getDisplayMetrics();
        
        offSet = (dm.widthPixels - 3 * bmWidth) / 6;
        matrix.setTranslate(offSet, 0);
        imageView.setImageMatrix(matrix);                                             //需要iamgeView的scaleType为matrix
        currentItem = 0;
    }
}
bubuko.com,布布扣

类外还有3个layout:layout1,layout2, layout3是最简单,就是定义了不同的背景颜色,这里不给出。

android--多View切换viewpager

标签:des   android   style   blog   http   color   io   os   java   

原文地址:http://www.cnblogs.com/xgjblog/p/3991345.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!