（笔记）Android 多行垂直滚动

前言：最近在Android开发学习中需要用到多行垂直滚动，做好后现将它整理出来。

概述：我这主要是实现两行滚动，如果字符超过两行则滚动，如果少于或等于两行则不滚动，点击按钮停止滚动。

效果图：

image

步骤：

1、新建自定义VerticalMarqueeView java文件。

public class VerticalMarqueeView extends ViewFlipper {
    /**
     * Alpha animation enable
     */
    private boolean isSetAlphaAnim = true;
    /**
     * Animation interval
     */
    private int interval = 5000;
    /**
     * Animation duration
     */
    private int animDuration = 2000;

    public VerticalMarqueeView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs, 0);
    }

    private void init(Context context, AttributeSet attrs, int defStyleAttr) {
        TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.MarqueeViewUp, defStyleAttr, 0);
        isSetAlphaAnim = ta.getBoolean(R.styleable.MarqueeViewUp_isSetAlphaAnim, isSetAlphaAnim);
        interval = ta.getInteger(R.styleable.MarqueeViewUp_interval, interval);
        animDuration = ta.getInteger(R.styleable.MarqueeViewUp_animDuration, animDuration);
        setFlipInterval(interval);
        // In or out animation: alpha, continuous
        AlphaAnimation animationIn = new AlphaAnimation(0, 1);
        animationIn.setDuration(animDuration);
        AlphaAnimation animationOut = new AlphaAnimation(1, 0);
        animationOut.setDuration(animDuration);
        // TranslateAnimation: show
        TranslateAnimation translateAnimationIn = new TranslateAnimation(
                Animation.RELATIVE_TO_SELF, 0.0f,
                Animation.RELATIVE_TO_SELF, 0.0f,
                Animation.RELATIVE_TO_SELF, 1.0f,
                Animation.RELATIVE_TO_SELF, 0.0f);
        // TranslateAnimation: dismiss
        TranslateAnimation translateAnimationOut = new TranslateAnimation(
                Animation.RELATIVE_TO_SELF, 0.0f,
                Animation.RELATIVE_TO_SELF, 0.0f,
                Animation.RELATIVE_TO_SELF, 0.0f,
                Animation.RELATIVE_TO_SELF, -1.0f);
        translateAnimationIn.setDuration(animDuration);
        translateAnimationOut.setDuration(animDuration);
        // In
        AnimationSet animationInSet = new AnimationSet(false);
        animationInSet.addAnimation(translateAnimationIn);
        // Out
        AnimationSet animationOutSet = new AnimationSet(false);
        animationOutSet.addAnimation(translateAnimationOut);
        // alpha animation enable
        if (isSetAlphaAnim) {
            animationInSet.addAnimation(animationIn);
            animationOutSet.addAnimation(animationOut);
        }
        setInAnimation(animationInSet);
        setOutAnimation(animationOutSet);
    }


    /**
     * Set flipping views array
     */
    public void setViews(final List<View> views) {
        if (views == null || views.size() == 0) {
            return;
        }
        removeAllViews();
        for (int i = 0; i < views.size(); i++) {
            final int position = i;
            // Single tap listener
            views.get(i).setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View v) {
                    if (onItemClickListener != null) {
                        onItemClickListener.onItemClick(position, views.get(position));
                    }
                }
            });
            addView(views.get(i));
        }
        startFlipping();
    }

    /**
     * Single tap click listener
     */
    private OnItemClickListener onItemClickListener;

    /**
     * Set single tap callback
     */
    public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
        this.onItemClickListener = onItemClickListener;
    }

    /**
     * Single tap callback interface
     */
    public interface OnItemClickListener {
        /**
         * On item click
         *
         * @param position On click position
         * @param view     On click view
         */
        void onItemClick(int position, View view);
    }

2、在res下的values文件夹新建VerticalMarqueeView中所需要的attrs.xml资源文件，在里面定义自定义属性。

<?xml version="1.0" encoding="UTF-8"?>
<resources>
    // Vertical marquee
    <declare-styleable name="MarqueeViewUp">
        <attr name="isSetAlphaAnim" format="boolean" />
        <attr name="interval" format="integer" />
        <attr name="animDuration" format="integer" />
    </declare-styleable>
</resources>

3、在Actitivity中的运用。
初始化界面程序

    data = new ArrayList<>();
        //final  String s="21wqsqwsqw";
        String s = "你听说过一见钟情吗？ 那个十二岁的夏天，校门口边上 他倚在单车边上，微微回头寻找我,我撞上他眼睛里,他撞进我心底 没有任何对话,他送了我一路,那段路好长好长,我走了好久好久。";
        s = s.replaceAll("\t|\n", "");
        voice_tv_words.setText(s);
        List<String> list = getStrList(s, 21);
        for (int i = 0; i < list.size(); i++) {
            data.add(list.get(i));
        }
       //判断如果超过两行则执行滚动，否则不滚动
        if (Strint_size > 2) {
            voice_tv_words.setVisibility(View.GONE);
            marqueeView1.setVisibility(View.VISIBLE);
            if (s.isEmpty()) {
                return;
            }
            setViewTwoLines();
            marqueeView1.setViews(views1);
        } else {
            voice_tv_words.setText(s);
            voice_tv_words.setVisibility(View.VISIBLE);
            marqueeView1.setVisibility(View.GONE);
        }
          //点击按钮停止天滚动
        stop.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                marqueeView1.stopFlipping();
                marqueeView1.removeAllViews();
                Toast.makeText(ScrollTextActivity.this, "停止滚动", Toast.LENGTH_SHORT).show();
            }
        });

设置显示两行

private void setViewTwoLines() {
        views1.clear();//去除重影现象
        for (int i = 0; i < data.size(); i = i + 2) {
            final int position = i;
            //设置滚动的单个布局
            LinearLayout moreView = (LinearLayout) LayoutInflater.from(this).inflate(R.layout.item_view, null);
            //初始化布局的控件
            TextView tv1 = (TextView) moreView.findViewById(R.id.tv1);
            TextView tv2 = (TextView) moreView.findViewById(R.id.tv2);

            //进行对控件赋值
            tv1.setText(data.get(i).toString());
            if (data.size() > i + 1) {
                //奇数条
                tv2.setText(data.get(i + 1).toString());
            } else {//偶数条
                //moreView.findViewById(R.id.rl2).setVisibility(View.GONE);
            }
            //添加到循环滚动数组里面去
            views1.add(moreView);
            moreView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    marqueeView1.setViews(views1);
                    Toast.makeText(ScrollTextActivity.this, "停止滚动", Toast.LENGTH_SHORT).show();
                }
            });
        }
    }

将字符串分成指定长度

public static List<String> getStrList(String inputString, int length) {
        int size = inputString.length() / length;
        if (inputString.length() % length != 0) {
            size += 1;
        }
        return getStrList(inputString, length, size);
    }

    public static List<String> getStrList(String inputString, int length,
                                          int size) {
        List<String> list = new ArrayList<String>();
        for (int index = 0; index < size; index++) {
            String childStr = substring(inputString, index * length,
                    (index + 1) * length);
            list.add(childStr);
        }
        Strint_size = size;
        System.out.println("wyq129:size " + size);
        return list;
    }

    public static String substring(String str, int f, int t) {
        if (f > str.length()) {
            return null;
        }
        if (t > str.length()) {
            return str.substring(f, str.length());
        } else {
            return str.substring(f, t);
        }
    }

item_view.xml布局文件代码，显示两个textview

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical">
    <TextView
        android:id="@+id/tv1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:ellipsize="end"
        android:maxLines="1"
        android:textColor="#ffffffff"
        android:textSize="16sp" />

    <TextView
        android:id="@+id/tv2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:ellipsize="end"
        android:maxLines="1"
        android:textColor="#ffffffff"
        android:textSize="16sp" />
</LinearLayout>

VerticalMarqueeView在布局文件中的引用

 <com.example.aiiage.scrolltextview.VerticalMarqueeView
        android:id="@+id/upview1"
        android:background="@color/white"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="10dp"
        app:animDuration="1000"
        app:interval="2000"
        app:isSetAlphaAnim="true"
        android:visibility="gone"/>

结论

以上就全部实现完了。