zoukankan      html  css  js  c++  java
  • Android中启动页ViewPager和ViewFlipper带指示器

     

    目录(?)[+]

     

    首先我们来分析一下,想要实现启动页的功能,大家第一个想到的就是使用ViewPager,使用ViewPager确实是一种比较好的方式,而且思路也是比较清晰的。今天我们就一起来学习一下,使用ViewPager和ViewFlipper实现启动页带小点功能。 
    先展示一下图片,看看是不是你想要的效果。 
    这里写图片描述
    这里写图片描述

    1、ViewPager和ViewFlipper的区别

    ViewFlipper继承ViewAnimator,切换view的时候是有动画效果的,适合做ppt,多界面的程序欢迎引导界面,算是个轻量级的组件,适合展示静态数据,少量数据。

    ViewPager继承ViewGroup。看官网描述,这货和Fragment是好搭档,Fragment有自己的生命周期。也就是说ViewPager更适用复杂的视图切换,而且Viewpager有自己的adapter,这也让其适应复杂对象,实现数据的动态加载。

    2、使用ViewPager来展示mipmap中或者网络中的图片(Volley)

    首先,我们来理一下有几个注意点。 
    ①先在布局文件中,画出简单的布局。 
    ②滑动ViewPager时候,底部的小点也会跟着变化。 
    ③点击小点时,ViewPager也会变化。 
    好了,现在我们来开始写代码,代码中的注释比较详细,大家自己看。 
    1、布局文件中,画出布局。 
    layout中,activity_view_pager_demo.xml文件

    <?xml version="1.0" encoding="utf-8"?>
    <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.llay.admin.mydemo.ViewPagerDemoActivity">
    
    
        <android.support.v4.view.ViewPager
            android:id="@+id/view_pager"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
    
        </android.support.v4.view.ViewPager>
    
    
        <LinearLayout
            android:id="@+id/ll"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="20dp"
            android:orientation="horizontal">
    
            <ImageView
                android:id="@+id/iv1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_margin="5dp"
                android:background="@drawable/point_selector"
                android:clickable="true"
                android:padding="5dp" />
    
            <ImageView
                android:id="@+id/iv2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_margin="5dp"
                android:background="@drawable/point_selector"
                android:clickable="true"
                android:padding="5dp" />
    
            <ImageView
                android:id="@+id/iv3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_margin="5dp"
                android:background="@drawable/point_selector"
                android:clickable="true"
                android:padding="5dp" />
    
            <ImageView
                android:id="@+id/iv4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_margin="5dp"
                android:background="@drawable/point_selector"
                android:clickable="true"
                android:padding="5dp" />
        </LinearLayout>
    </RelativeLayout>
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66

    解释:代码中使用相对布局,这样,下面的指示器就可以显示在ViewPager上面,这样便于效果的实现。我这里下面的指示器是固定写的,根据图片的多少进行添加和删除。 
    最后一个layout文件单独写的: 
    activity_view_pager4.xm

    public class ViewPagerDemoActivity extends Activity implements ViewPager.OnPageChangeListener, View.OnClickListener {
        //设置ViewPager和view视图
        private ViewPager viewPager;
        private int[] imageId = {R.mipmap.launcher_b, R.mipmap.launcher_c, R.mipmap.launcher_b};
        private List<View> viewList;
        private List<ImageUrlBean> imageList;
        private View lastView;
        //设置小圆点
        private ImageView[] points;//存放小圆圈数组
        private int currentIndex = 0;//当前页面,默认首页
        //使用Volley加载网络图片
        private RequestQueue mQueue;
        private ImageLoader mImageLoader;
        ImageLoader.ImageListener imageListener;
    
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            requestWindowFeature(Window.FEATURE_NO_TITLE);
            setContentView(R.layout.activity_view_pager_demo);
            mQueue = Volley.newRequestQueue(this);
    //        initViewPage();
            initNetView();
            initPoints();
        }
    
        //这里是加载mipmap中图片的方式,初始化ViewPager及其图片资源
        private void initViewPage() {
            viewPager = (ViewPager) findViewById(R.id.view_pager);
            viewList = new ArrayList<>();
            //添加对应的view进入集合(数据源)
            for (int i = 0; i < imageId.length; i++) {
                ImageView imageView = new ImageView(this);
                imageView.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
                imageView.setScaleType(ImageView.ScaleType.FIT_XY);//设置缩放样式
                imageView.setImageResource(imageId[i]);
                viewList.add(imageView);
            }
            //另外增加最后一个能点击进入应用的视图
            lastView = View.inflate(this, R.layout.activity_view_pager4, null);
            Button button = (Button) lastView.findViewById(R.id.startbutton);
            viewList.add(lastView);
            //设置最后一个视图上的点击事件
            button.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Toast.makeText(ViewPagerDemoActivity.this, "应用开始!", Toast.LENGTH_SHORT).show();
                }
            });
            //设置viewpager的适配器和数据源
            ViewPagerAdapter viewPagerAdapter = new ViewPagerAdapter(viewList);
            viewPager.setAdapter(viewPagerAdapter);
            viewPager.setOnPageChangeListener(this);
        }
    
    
    //这里是加载网络图片的方式,初始化ViewPager控件及其图片资源
        private void initNetView() {
            viewPager = (ViewPager) findViewById(R.id.view_pager);
            ImageUrlBean imageUrlBean1 = new ImageUrlBean("http://www.qq6300.com/uploads/allimg/130131/1-1301311G339A9.jpg");
            ImageUrlBean imageUrlBean2 = new ImageUrlBean("http://img4.duitang.com/uploads/item/201412/13/20141213114411_QEshv.jpeg");
            ImageUrlBean imageUrlBean3 = new ImageUrlBean("http://pic27.nipic.com/20130329/10041959_102531181000_2.jpg");
            imageList = new ArrayList<>();
            imageList.add(imageUrlBean1);
            imageList.add(imageUrlBean2);
            imageList.add(imageUrlBean3);
            //添加对应的view进入集合(数据源)
            viewList = new ArrayList<>();
            for (int i = 0; i < imageList.size(); i++) {
                ImageView imageView = new ImageView(this);
                imageView.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
                imageView.setScaleType(ImageView.ScaleType.FIT_XY);//设置缩放样式
                mImageLoader = new ImageLoader(mQueue, new ImageLoader.ImageCache() {
                    @Override
                    public Bitmap getBitmap(String s) {
                        return null;
                    }
    
                    @Override
                    public void putBitmap(String s, Bitmap bitmap) {
    
                    }
                });
                imageListener = ImageLoader.getImageListener(imageView, R.mipmap.ic_launcher, R.mipmap.ic_launcher);
                mImageLoader.get(imageList.get(i).getImageUrl(), imageListener);
                viewList.add(imageView);
            }
            //另外增加最后一个能点击进入应用的视图
            lastView = View.inflate(this, R.layout.activity_view_pager4, null);
            Button button = (Button) lastView.findViewById(R.id.startbutton);
            viewList.add(lastView);
            //设置最后一个视图上的点击事件
            button.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Toast.makeText(ViewPagerDemoActivity.this, "应用开始!", Toast.LENGTH_SHORT).show();
                }
            });
            //设置viewpager的适配器和数据源
            ViewPagerAdapter viewPagerAdapter = new ViewPagerAdapter(viewList);
            viewPager.setAdapter(viewPagerAdapter);
            viewPager.setOnPageChangeListener(this);
        }
    
        //初始化下标点
        private void initPoints() {
            LinearLayout linearLayout = (LinearLayout) findViewById(R.id.ll);
            points = new ImageView[4];
            //初始化布局中的小圆点ImageView控件
            for (int i = 0; i < points.length; i++) {
                points[i] = (ImageView) linearLayout.getChildAt(i);//遍历LinearLayout下的所有ImageView子节点
                points[i].setEnabled(true);//设置当前状态为允许点击(可点,灰色)
                points[i].setOnClickListener(this);//设置点击监听
                //额外设置一个标识符,以便点击小圆点时跳转对应页面
                points[i].setTag(i);//标识符与圆点顺序一致
            }
            currentIndex = 0;
            points[currentIndex].setEnabled(false);//设置首页为当前页(不可点,黑色)
        }
    
    
        @Override
        public void onClick(View v) {
            viewPager.setCurrentItem((int) v.getTag());
        }
    
    
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
    
        }
    
        @Override
        public void onPageSelected(int position) {
            //当前页卡被选择时,position为当前页数
            points[position].setEnabled(false);//不可点击
            points[currentIndex].setEnabled(true);//恢复之前页面状态
            currentIndex = position;
        }
    
        @Override
        public void onPageScrollStateChanged(int state) {
    
        }
    }
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • 109
    • 110
    • 111
    • 112
    • 113
    • 114
    • 115
    • 116
    • 117
    • 118
    • 119
    • 120
    • 121
    • 122
    • 123
    • 124
    • 125
    • 126
    • 127
    • 128
    • 129
    • 130
    • 131
    • 132
    • 133
    • 134
    • 135
    • 136
    • 137
    • 138
    • 139
    • 140
    • 141
    • 142
    • 143
    • 144
    • 145
    • 146

    解释:这里有几个地方需要注意的, 
    1、这里添加数据源的方式,有两种方式:mipmap文件中和网络上的图片地址,我想,大家使用启动页功能的时候,一定是想要动态的从网络上获取吧,这样才能够获得最新的数据。 
    2、使用加载网路图片功能,作者使用的是Volley框架,别问我为啥选这个啊,因为其他还没用过,哈哈。 
    3、好了,这里我们遇到了文章开头时遇到的问题,当滑动ViewPager时,指示器也要跟着滑动,这里我们继承ViewPager.OnPageChangeListener,实现一些常用的方法,代码中都有注释,请自行查看。 
    4、还有一个是点击指示器的时候,ViewPager也跟着一起滑动。这里我们继承View.OnClickListener方法,这个方法就是点击事件,viewPager.setCurrentItem((int) v.getTag());便可以跳转到所点击的界面,然后指示器在跳到指定界面之后,也会有相应的颜色变化。

    3、ViewPager的适配器代码 
    ViewPagerAdapter.javpublic class ViewPagerAdapter extends PagerAdapter { 
    private List list;

    public ViewPagerAdapter(List list) {
        this.list = list;
    }
    
    
    //获取要滑动的控件的数量,在这里我们以滑动的广告栏为例,那么这里就应该是展示的广告图片的ImageView数量
    @Override
    public int getCount() {
        return list.size();
    }
    
    //来判断显示的是否是同一张图片,这里我们将两个参数相比较返回即可
    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view == object;//官方demo给出的建议写法
    }
    
    //当要显示的图片可以进行缓存的时候,会调用这个方法进行显示图片的初始化,我们将要显示的ImageView加入到ViewGroup中,然后作为返回值返回即可
    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        container.addView(list.get(position));
        return list.get(position);
    }
    
    //PagerAdapter只缓存三张要显示的图片,如果滑动的图片超出了缓存的范围,就会调用这个方法,将图片销毁
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView(list.get(position));
    }
    

    }示器的布局。 
    现在,我们来实现一下指示器的圆点,之前我一直以为,指示器的圆点就是让UI画出来的,原来还可以通过这种方式来实现。直接上代码。 
    未点击的圆点。 
    drawable文件中。v_point_up.xml文件

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
    
        <corners android:radius="0.5dp" />
    
        <solid android:color="#AAFFFFFF" />
    
    </shape>
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9

    点击的圆点。 
    drawable文件中。v_point_down.xml文件

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
    
        <corners android:radius="0.5dp" />
    
        <solid android:color="#55000000" />
    
    </shape>
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9

    主布局文件中的point_selector.xml文件,这个文件的功能是在选择指示器之后,可以让指示器的颜色用代码改变。 
    drawbale文件中。point_selector.xml文件

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
    
        <item android:drawable="@drawable/v_point_up" android:state_enabled="true"></item>
    
        <item android:drawable="@drawable/v_point_down" android:state_enabled="false"></item>
    
    </selector>
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8

    解释:请注意这里是android:state_enabled属性,表示状态是否可以点击。

    2、使用ViewFlipper来展示mipmap中的图片

    这里我没有用ViewFlipper来展示网络图片 
    1、布局文件: 
    同上ViewPager中的主布局文件和第四个布局文件,还有指示器的布局文件。 
    2、ViewFlipperActivity.java文件

    public class ViewFlipperActivity extends Activity implements GestureDetector.OnGestureListener, View.OnClickListener {
        //设置ViewFlipper和view视图
        private ViewFlipper viewFlipper;
        private int[] imageId = {R.mipmap.launcher_b, R.mipmap.launcher_c, R.mipmap.launcher_b};
        View lastView;
        //设置小圆点
        private ImageView[] points;//存放小圆圈数组
        private int currentIndex = 0;//当前页面,默认首页
        //设置手势
        GestureDetector gestureDetector;
    
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            requestWindowFeature(Window.FEATURE_NO_TITLE);
            setContentView(R.layout.activity_view_flipper);
            gestureDetector = new GestureDetector(ViewFlipperActivity.this);
            initViewFlipper();
            initPoints();
        }
    
        //初始化ViewFlipper
        private void initViewFlipper() {
            viewFlipper = (ViewFlipper) findViewById(R.id.viewflipper);
            //添加对应的view进入集合(数据源)
            for (int i = 0; i < imageId.length; i++) {
                ImageView imageView = new ImageView(this);
                imageView.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
                imageView.setScaleType(ImageView.ScaleType.FIT_XY);//设置缩放样式
                imageView.setImageResource(imageId[i]);
                viewFlipper.addView(imageView);
            }
            //另外增加最后一个能点击进入应用的视图
            lastView = View.inflate(this, R.layout.activity_view_pager4, null);
            Button button = (Button) lastView.findViewById(R.id.startbutton);
            viewFlipper.addView(lastView);
            //设置最后一个视图上的点击事件
            button.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Toast.makeText(ViewFlipperActivity.this, "应用开始!", Toast.LENGTH_SHORT).show();
                }
            });
        }
    
        //初始化下标点
        private void initPoints() {
            LinearLayout linearLayout = (LinearLayout) findViewById(R.id.ll);
            points = new ImageView[4];
            //初始化布局中的小圆点ImageView控件
            for (int i = 0; i < points.length; i++) {
                points[i] = (ImageView) linearLayout.getChildAt(i);//遍历LinearLayout下的所有ImageView子节点
                points[i].setEnabled(true);//设置当前状态为允许点击(可点,灰色)
                points[i].setOnClickListener(this);//设置点击监听
                //额外设置一个标识符,以便点击小圆点时跳转对应页面
                points[i].setTag(i);//标识符与圆点顺序一致
            }
            currentIndex = 0;
            points[currentIndex].setEnabled(false);//设置首页为当前页(不可点,黑色)
        }
    
    
        @Override
        public void onClick(View v) {
            //点击小点,改变小点的状态,并且改变viewFlipper中子view的显示
            viewFlipper.setDisplayedChild((int) v.getTag());
            points[(int) v.getTag()].setEnabled(false);
            points[currentIndex].setEnabled(true);
            currentIndex = (int) v.getTag();
        }
    
    
        //用户轻触触摸屏,由1个MotionEvent ACTION_DOWN触发
        @Override
        public boolean onDown(MotionEvent e) {
            return false;
        }
    
        //用户轻触触摸屏,尚未松开或拖动,由一个1个MotionEvent ACTION_DOWN触发
        //注意和onDown()的区别,强调的是没有松开或者拖动的状态
        @Override
        public void onShowPress(MotionEvent e) {
    
        }
    
        //用户(轻触触摸屏后)松开,由一个1个MotionEvent ACTION_UP触发
        @Override
        public boolean onSingleTapUp(MotionEvent e) {
            return false;
        }
    
        //用户按下触摸屏,并拖动,由1个MotionEvent ACTION_DOWN, 多个ACTION_MOVE触发
        @Override
        public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
            return false;
        }
    
        //用户长按触摸屏,由多个MotionEvent ACTION_DOWN触发
        @Override
        public void onLongPress(MotionEvent e) {
    
        }
    
        //用户按下触摸屏、快速移动后松开,由1个MotionEvent ACTION_DOWN, 多个ACTION_MOVE,1个ACTION_UP触发
        @Override
        public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
            if (e2.getX() - e1.getX() > 120) {
                //为了避免能够一直向右滑动
                if (viewFlipper.getDisplayedChild() != 0) {
                    //向右滑动,设置滑动动画
                    viewFlipper.setInAnimation(AnimationUtils.loadAnimation(ViewFlipperActivity.this,
                            R.anim.push_right_in));
                    viewFlipper.setOutAnimation(AnimationUtils.loadAnimation(ViewFlipperActivity.this,
                            R.anim.push_right_out));
                    //这个要判断,不然就会跳到第一个
                    viewFlipper.showPrevious();
                    //当前页卡被选择时,viewFlipper.getDisplayedChild()为当前页数
                    points[viewFlipper.getDisplayedChild()].setEnabled(false);//不可点击
                    points[currentIndex].setEnabled(true);//恢复之前页面状态
                    currentIndex = viewFlipper.getDisplayedChild();
                    return true;
                }
            } else if (e2.getX() - e1.getX() < 120) {
                //为了避免能够一直向左滑动
                if (viewFlipper.getDisplayedChild() != viewFlipper.getChildCount() - 1) {
                    //向左滑动,设置滑动动画
                    viewFlipper.setInAnimation(AnimationUtils.loadAnimation(ViewFlipperActivity.this,
                            R.anim.push_left_in));
                    viewFlipper.setOutAnimation(AnimationUtils.loadAnimation(ViewFlipperActivity.this,
                            R.anim.push_left_out));
                    //这个要判断,不然就会跳到最后一个
                    viewFlipper.showNext();
                    //当前页卡被选择时,viewFlipper.getDisplayedChild()为当前页数
                    points[viewFlipper.getDisplayedChild()].setEnabled(false);//不可点击
                    points[currentIndex].setEnabled(true);//恢复之前页面状态
                    currentIndex = viewFlipper.getDisplayedChild();
                    return true;
                }
            }
            return false;
        }
    
    
        //用户轻触触摸屏,由1个MotionEvent ACTION_DOWN触发
        @Override
        public boolean onTouchEvent(MotionEvent event) {
            return this.gestureDetector.onTouchEvent(event);
        }
    
    }
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • 109
    • 110
    • 111
    • 112
    • 113
    • 114
    • 115
    • 116
    • 117
    • 118
    • 119
    • 120
    • 121
    • 122
    • 123
    • 124
    • 125
    • 126
    • 127
    • 128
    • 129
    • 130
    • 131
    • 132
    • 133
    • 134
    • 135
    • 136
    • 137
    • 138
    • 139
    • 140
    • 141
    • 142
    • 143
    • 144
    • 145
    • 146
    • 147
    • 148
    • 149
    • 150
    • 151

    解释:这里我用ViewFlipper实现这个启动页的功能,一开始以为应该会比ViewPager实现容易,但是自己后来弄了一下,感觉自己还是不怎么能弄出来。我来讲一下有几处要注意的。 
    1、使用ViewFlipper来实现启动页功能,需要使用手势。让类继承GestureDetector.OnGestureListener接口,实现一些必要的方法。主要是onFling()方法。 
    2、为了让ViewFlipper不能一直的滑动下去。需要判断是不是第一个和最后一个,使用 if (viewFlipper.getDisplayedChild() != 0)判断是不是第一个,使用if (viewFlipper.getDisplayedChild() != viewFlipper.getChildCount() - 1)判断是不是最后一个。 
    3、在滑动了ViewFlipper之后,我们也要考虑和ViewPager相同的两个问题。ViewFlipper滑动带动指示器,指示器点击带动ViewFlpper。 
    使用

    //当前页卡被选择时,viewFlipper.getDisplayedChild()为当前页数
                    points[viewFlipper.getDisplayedChild()].setEnabled(false);//不可点击
                    points[currentIndex].setEnabled(true);//恢复之前页面状态
                    currentIndex = viewFlipper.getDisplayedChild();
    • 1
    • 2
    • 3
    • 4

    来使ViewFlipper滑动,带动指示器的滑动。 
    使用

    //点击小点,改变小点的状态,并且改变viewFlipper中子view的显示
            viewFlipper.setDisplayedChild((int) v.getTag());
            points[(int) v.getTag()].setEnabled(false);
            points[currentIndex].setEnabled(true);
            currentIndex = (int) v.getTag();
    • 1
    • 2
    • 3
    • 4
    • 5

    来点击指示器,带动ViewFlipper的跳转。

    注意:可能是方法不同的原因,在ViewPager中,setCurrentItem(int item)方法就可以直接调用第几个界面,然后再触发onPageSelected(int position)方法,使得指示器按钮变化。而在ViewFlipper中,setDisplayedChild(int childid)方法只能调用第几个界面,不能触发onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY)方法,onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY)方法只能通过滑动来获得。

    4、需要注意的是,使用手势的时候,一定要实现这个方法,不然手势不能生效。原因,查了好多,都是说未知。

    //用户轻触触摸屏,由1个MotionEvent ACTION_DOWN触发
        @Override
        public boolean onTouchEvent(MotionEvent event) {
            return this.gestureDetector.onTouchEvent(event);
        }
    • 1
    • 2
    • 3
    • 4
    • 5
     
    0
  • 相关阅读:
    深度优先和广度优先
    水管工游戏(深度优先)
    炸弹人
    广度优先(迷宫找人)
    System.Data.Entity.Core.MetadataException: 无法加载指定的无数据资源
    Element Cascader 级联选择器 单选操作优化
    Windows服务 ProjectInstaller 获取 路径
    Quartz.NET ScheduledFireTimeUtc 当超过1分钟时出现的问题。
    记录:一个SQL SERVER奇怪的问题。
    log4.net 配置
  • 原文地址:https://www.cnblogs.com/lenkevin/p/5781772.html
Copyright © 2011-2022 走看看