Android 划屏欢迎动画的实现及多实现方式的考虑------ViewPager的实现

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/jspping/article/details/41624443

前面我们用ViewFilpper实现的时候,发现与我们想要效果有些背道而驰,所以接下来我们用ViewPager来实现,其实ViewPager一般

用作菜单导航和图片公告比较多,实现我们今天说的效果可以采用Fragment或者重写一些控件来实现,但是我们今天会用更简单的实

现方式,而且看起来代码也少,很清晰,很容易看懂,我用到了一个List、以及一个数组,分别来对组件进行处理,List<View>里放置

了3个自己写得布局文件,ImageView[]用来加载 List<View>对象,在主布局用一个线性布局来显示当前划屏完毕的view(布局文

件),需要通过实现onPageChangeListerer接口,调用onPageSelectde()函数来完成

主要代码:

package com.example.engineerjspnavigation;
/**
 * Engineer-Jsp.Animation
 * @author Engineer-Jsp
 * @date 2014.11.28
 * ViewPager use
 * */
import java.util.ArrayList;
import java.util.List;

import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.app.Activity;
public class MainActivity extends Activity {
	    private ViewPager viewpager = null;
	    private List<View> list = null;
	    private ImageView[] img = null;
	    @Override
	    protected void onCreate(Bundle savedInstanceState) {
	        super.onCreate(savedInstanceState);
	        requestWindowFeature(Window.FEATURE_NO_TITLE);
	        setContentView(R.layout.activity_main);
	        viewpager = (ViewPager) findViewById(R.id.viewpager);
	        list = new ArrayList<View>();
	        list.add(getLayoutInflater().inflate(R.layout.navigation_one, null));
	        list.add(getLayoutInflater().inflate(R.layout.navigation_two, null));
	        list.add(getLayoutInflater().inflate(R.layout.navigation_three, null));
	 
	        img = new ImageView[list.size()];
	        // 切换屏幕时,下面的进度触点替换
	        LinearLayout layout = (LinearLayout) findViewById(R.id.viewGroup);
	        for (int i = 0; i < list.size(); i++) {
	            img[i] = new ImageView(MainActivity.this);
	            // 第一个view为默认选中
	            if (0 == i) {
	                img[i].setBackgroundResource(R.drawable.selected);
	            } else {
	                img[i].setBackgroundResource(R.drawable.normal);
	            }
	            img[i].setPadding(0, 0, 20, 0);
	            // 显示划动到当前活动的view
	            layout.addView(img[i]);
	        }
	        viewpager.setAdapter(new ViewPagerAdapter(list));
	        viewpager.setOnPageChangeListener(new ViewPagerPageChangeListener());
	    }
	 
	    class ViewPagerAdapter extends PagerAdapter {
	 
	        private List<View> list = null;
	 
	        public ViewPagerAdapter(List<View> list) {
	            this.list = list;
	        }
	 
	        @Override
	        public int getCount() {
	            return list.size();
	        }
	 
	        @Override
	        public Object instantiateItem(ViewGroup container, int position) {
	            container.addView(list.get(position));
	            return list.get(position);
	        }
	 
	        @Override
	        public void destroyItem(ViewGroup container, int position, Object object) {
	            container.removeView(list.get(position));
	        }
	 
	        @Override
	        public boolean isViewFromObject(View arg0, Object arg1) {
	            return arg0 == arg1;
	        }
	 
	    }
	// 内部类
	class ViewPagerPageChangeListener implements OnPageChangeListener {
		 
        /*
         */
        @Override
        public void onPageScrollStateChanged(int state) {
        }
 
        /*
         */
        @Override
        public void onPageScrolled(int page, float positionOffset,
                int positionOffsetPixels) {
        }
 
        @Override
        public void onPageSelected(int page) {
            //更新图标
            for (int i = 0; i < list.size(); i++) {
                if (page == i) {
                    img[i].setBackgroundResource(R.drawable.selected);
                } else {
                    img[i].setBackgroundResource(R.drawable.normal);
                }
            }
        }
    }
}

主布局:

<FrameLayout 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:orientation="vertical"
    tools:context=".MainActivity" >
 
    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/white" >
    </android.support.v4.view.ViewPager>
 
    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >
 
        <LinearLayout
            android:id="@+id/viewGroup"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_marginBottom="50.0dp"
            android:gravity="center"
            android:orientation="horizontal" >
        </LinearLayout>
    </RelativeLayout>
 
</FrameLayout>

加载的3个布局文件,代码都一致


我就贴一个就是了,你们在复制2个测试就OK了

<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:id="@+id/navigation_1"
    android:background="@drawable/icon_one">
</LinearLayout>

其中涉及到的素材我会等会上传,并且把地址贴出来,素材都是我PS的,自己亲手做的,等会儿贴地址上来,就几个图片,和加工的3张背景图片,进度触点素材等,不大,压缩之后744kb

PS纯手工制作素材,下载地址:http://download.csdn.net/detail/jspping/8210539


由于CSDN不能上传视频,演示效果只能以图片形势取代了。。。


第一个布局:


第二个布局:


第三个布局:



OK,素材地址和代码都已经奉献完毕,这篇博客就讲完了,谢谢~


阅读更多
想对作者说点什么?

博主推荐

换一批

没有更多推荐了,返回首页