Android 轮换控件

Posted 老彭茶馆

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Android 轮换控件相关的知识,希望对你有一定的参考价值。

首先是控件轮换

 

一.创建主布局 

1.用到的控件是 TextSwitcher (文本轮换)

  那么其他对应的也就是 ImageSwitcher (图片轮换)

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2     xmlns:tools="http://schemas.android.com/tools"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical"
 6     android:paddingBottom="@dimen/activity_vertical_margin"
 7     android:paddingLeft="@dimen/activity_horizontal_margin"
 8     android:paddingRight="@dimen/activity_horizontal_margin"
 9     android:paddingTop="@dimen/activity_vertical_margin"
10     tools:context="com.yuxuan.lunhuan.activity.MainActivity" >
11 
12     <TextSwitcher
13         android:id="@+id/textSwitcher1"
14         android:layout_width="match_parent"
15         android:layout_height="wrap_content"
16         android:background="#440000ff" >
17 
18     </TextSwitcher>
19 
20     <ImageSwitcher
21         android:id="@+id/imageSwitcher1"
22         android:layout_width="match_parent"
23         android:layout_height="wrap_content"
24         android:background="#44ff0000" >
25 
26     </ImageSwitcher>
27 
28 </LinearLayout>
activity_main.xml

二.主要代码

1.声明一下控件 TextSwitcher

private TextSwitcher textSwitcher1;

 

2.定义一个String类型的数组用来做数据

private String[] strs = new String[] { "1", "2", "3" };

 

3.创建一个int型的变量用来记录下标

private int index = 0;

 

4.创建两个int型的值用来保存下面会用到的触摸事件手机按下和松开的X值

private int startx;

private int endx;

 

5.在初始化事件里开始写代码把!

textSwitcher1 = (TextSwitcher) findViewById(R.id.textSwitcher1);

                // 创建工厂 匿名内部类
        textSwitcher1.setFactory(new ViewFactory() {

            @Override
                        // 用这个方法创建TextView
            public View makeView() {
                
                return new TextView(MainActivity.this);
            }
        });

                // 定义一个动画(可有可无)
        TranslateAnimation animation = new TranslateAnimation(
                Animation.RELATIVE_TO_PARENT, 1.0f,
                Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_SELF,
                0.0f, Animation.RELATIVE_TO_SELF, 0.0f);

        animation.setDuration(1500);
        animation.setFillAfter(true);

        textSwitcher1.setInAnimation(animation);
        textSwitcher1.setText(strs[0]);

        textSwitcher1.setOnTouchListener(new OnTouchListener() {

            @Override
                        // 设置触摸事件
            public boolean onTouch(View v, MotionEvent event) {
                                // 按下
                if (event.getAction() == MotionEvent.ACTION_DOWN) {

                    startx = event.getX();

                }
                                // 松开
                if (event.getAction() == MotionEvent.ACTION_UP) {

                    endx = event.getX();
                                        // 滑动一定距离才执行
                    if (startx - endx > 100) {
                                                // 判断下标
                        if (index == strs.length) {
                            index = 0;
                        }
                                                // 设置文本 下标加1
                        textSwitcher1.setText(strs[index]);
                        index = index + 1;
                    }

                }
                return true;
            }
        });

 

然后是图片轮换 其实大致上是一样的 直接上代码

 

首先在主布局文件中添加一个 ImageSwitcher 控件 

 

然后进入代码编写

 

1.声明一下控件 ImageSwitcher 

private ImageSwitcher imageSwitcher1;

 

2.定义一个int类型的数组用来保存所需图片的ID

private int[] imgs = new int[] { android.R.drawable.alert_dark_frame,
            android.R.drawable.arrow_down_float,
            android.R.drawable.btn_dropdown, };

 

3.创建一个int型的变量用来记录下标 (同上)

4.创建两个int型的值用来保存下面会用到的触摸事件手机按下和松开的X值 (同上)

 

5.在初始化事件里开始写代码把!

imageSwitcher1 = (ImageSwitcher) findViewById(R.id.imageSwitcher1);

        imageSwitcher1.setFactory(new ViewFactory() {

            @Override
                        // 创建 ImageView 这里我们需要处理一下背景
            public View makeView() {
                
                ImageView lv = new ImageView(MainActivity.this);
                lv.setBackgroundColor(Color.RED);
                FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
                params.gravity = Gravity.CENTER_VERTICAL;
                lv.setLayoutParams(params);
                return lv;
            }
        });

        TranslateAnimation inanimation = new TranslateAnimation(
                Animation.RELATIVE_TO_PARENT, 1.0f,
                Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_SELF,
                0.0f, Animation.RELATIVE_TO_SELF, 0.0f);

        inanimation.setDuration(1500);
        inanimation.setFillAfter(true);

        imageSwitcher1.setInAnimation(inanimation);
        imageSwitcher1.setImageResource(imgs[index]);
        
        imageSwitcher1.setOnTouchListener(new OnTouchListener() {

            @Override
            public boolean onTouch(View v, MotionEvent event) {
                if (event.getAction() == MotionEvent.ACTION_DOWN) {

                    startx = event.getX();

                }
                if (event.getAction() == MotionEvent.ACTION_UP) {

                    endx = event.getX();

                    if (startx - endx > 100) {
                        if (index == strs.length) {
                            index = 0;
                        }

                        imageSwitcher1.setImageResource(imgs[index]);
                        index = index + 1;
                    }

                }
                return true;
            }
        });

 

最后写一写页面间的轮换

 

首先放上主布局代码

<LinearLayout 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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.yuxuan.lunhuanym.MainActivity" >

// 这里用的是用的是 android-support-v4 里面的控件 详情可以百度
    <android.support.v4.view.ViewPager
        android:id="@+id/vp"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    </android.support.v4.view.ViewPager>

</LinearLayout>
activity_main.xml

 

下面的直接附上主代码

package com.yuxuan.lunhuanym;

import java.util.ArrayList;
import java.util.List;

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.view.ViewGroup;

public class MainActivity extends Activity {

    private ViewPager pager;

    private int[] pagids = new int[] { R.layout.activity_view1,
            R.layout.activity_view2, R.layout.activity_view3, };

    private PagerAdapter adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        initView();
    }

    private void initView() {
        setContentView(R.layout.activity_main);

        pager = (ViewPager) findViewById(R.id.vp);

        adapter = new MyPageAdapter();

        pager.setAdapter(adapter);
    }

    // 自定义适配器
    private class MyPageAdapter extends PagerAdapter {

        private List<View> vs;

        public MyPageAdapter() {
            vs = new ArrayList<View>();
            for (int i = 0; i < pagids.length; i++) {
                View view = View.inflate(MainActivity.this, pagids[i], null);
                vs.add(view);
            }
        }

        @Override
        // 要轮放的页面总共有多少
        public int getCount() {

            return pagids.length;
        }

        @Override
        public boolean isViewFromObject(View view, Object object) {

            return view == object;
        }

        @Override
        // 初始化一个条目
        // container viewpager 本身
        // position 马上出来的试图
        public Object instantiateItem(ViewGroup container, int position) {

            container.addView(vs.get(position));

            return vs.get(position);
        }

        @Override
        // 销毁一个条目
        // container 容器本身
        // position 销毁的下标
        // object 销毁的page
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView((View) object);
        }

    }
}

 

感觉稍微牛逼点的控件都和适配器有关 有木有~

以上是关于Android 轮换控件的主要内容,如果未能解决你的问题,请参考以下文章

Android 片段与复合控件

ios 轮换最佳实践

单击ListViewItem时Android加载片段

android如何跨片段分离/附加保留视图状态

如何清空android ListView控件的内容

JS实现背景渐变轮换(已有背景轮换代码,只要一个轮换效果就可以)