Several implementation methods of Android text vertical scrolling and vertical horse riding lamp

Method 1: use the system control ViewFlipper mode:

Layout file:

<ViewFlipper
        android:id="@+id/view_flipper"
        android:layout_width="300dp"
        android:layout_height="35dp"
        android:layout_centerInParent="true"
        android:autoStart="true"
        android:background="@drawable/warning_bg"
        android:flipInterval="3000"
        android:inAnimation="@anim/slide_in_bottom"
        android:outAnimation="@anim/slide_out_top">

        <TextView
            android:id="@+id/tv_warning_content1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:ellipsize="middle"
            android:gravity="center"
            android:singleLine="true"
            android:text="There is warning information, there is warning information, there is warning information"
            android:textColor="#000000"
            android:textSize="16sp"/>

        <TextView
            android:id="@+id/tv_warning_content2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:ellipsize="middle"
            android:gravity="center"
            android:singleLine="true"
            android:text="Current weather conditions current weather conditions"
            android:textColor="#000000"
            android:textSize="16sp"/>

        <TextView
            android:id="@+id/tv_warning_content3"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:ellipsize="middle"
            android:gravity="center"
            android:singleLine="true"
            android:text="123456465"
            android:textColor="#000000"
            android:textSize="16sp"/>
    </ViewFlipper>

Background file: warning bg.xml

<?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">

    <solid android:color="#34000000"/>
    <corners android:radius="80dp"/>

</shape>

Cut in Animation: slide in bottom.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <translate
        android:duration="1000"
        android:fromYDelta="100%p"
        android:toYDelta="0" />
</set>

Cut out animation: slide out top.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <translate
        android:duration="1000"
        android:fromYDelta="0"
        android:toYDelta="-100%p" />

</set>

Note: if you do not set: android:autoStart= "true" in the layout file, you can dynamically set the start loop mViewFlipper.startFlipping() in the code;
Normal in Activity, but ghosting may occur in fragment.

Method 2: use tripartite framework

Gradle:

compile 'com.sunfusheng:marqueeview:1.3.3'

attribute

Attribute attribute Description Description
mvAnimDuration Execution time of one line of text animation
mvInterval Page turning time interval of two lines of text
mvTextSize Text size
mvTextColor Text color
mvGravity Text position: left, center, right
mvSingleLine Single line settings
mvDirection Scroll direction of animation: bottom to top, top to bottom, right to left, left to right

XML

<com.sunfusheng.marqueeview.MarqueeView
    android:id="@+id/marqueeView"
    android:layout_width="match_parent"
    android:layout_height="30dp"
    app:mvAnimDuration="1000"
    app:mvDirection="bottom_to_top"
    app:mvInterval="3000"
    app:mvTextColor="@color/white"
    app:mvTextSize="14sp"
    app:mvSingleLine="true"/>

Set string list data

MarqueeView marqueeView = (MarqueeView) findViewById(R.id.marqueeView);

List<String> info = new ArrayList<>();
info.add("11111111111111");
info.add("22222222222222");
info.add("33333333333333");
info.add("44444444444444");
info.add("55555555555555");
info.add("66666666666666");
marqueeView.startWithList(info);

// Set up your own animation in the code
marqueeView.startWithList(info, R.anim.anim_bottom_in, R.anim.anim_top_out);

Set string data

String notice = "There is sunshine in my heart, and strength in my feet! There is sunshine in my heart, and strength in my feet! There is sunshine in my heart, and strength in my feet!";
marqueeView.startWithText(notice);

// Animating yourself in code
marqueeView.startWithText(notice, R.anim.anim_bottom_in, R.anim.anim_top_out);

Set event listening

marqueeView.setOnItemClickListener(new MarqueeView.OnItemClickListener() {
    @Override
    public void onItemClick(int position, TextView textView) {
        Toast.makeText(getApplicationContext(), String.valueOf(marqueeView1.getPosition()) + ". " + textView.getText(), Toast.LENGTH_SHORT).show();
    }
});

Refer to the following solutions for ghosting problems

@Override
public void onStart() {
    super.onStart(); 
    marqueeView.startFlipping();
}

@Override
public void onStop() {
    super.onStop();
    marqueeView.stopFlipping();
}

Note: this library mainly inherits ViewFlipper. Similar libraries also have MarqueeViewLibrary. The implementation method is basically similar. It displays normally in Activity, but there may be ghosting in fragment.

Method 3: using the system control textswitch to implement

Layout file

<TextSwitcher
            android:id="@+id/text_switcher"
            android:layout_width="285dp"
            android:layout_height="35dp"
            android:background="@drawable/warning_bg"/>

Background file: warning bg.xml

<?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">

    <solid android:color="#34000000"/>
    <corners android:radius="80dp"/>

</shape>

code:

   private int index = 0;//textview scroll subscript up and down
    private Handler handler = new Handler();
    private boolean isFlipping = false; // Enable alert information rotation
    private List<String> mWarningTextList = new ArrayList<>();

    private void setTextSwitcher() {
        mTextSwitcher.setInAnimation(AnimationUtils.loadAnimation(mContext, R.anim.slide_in_bottom));
        mTextSwitcher.setOutAnimation(AnimationUtils.loadAnimation(mContext, R.anim.slide_out_top));
        mTextSwitcher.setFactory(new ViewSwitcher.ViewFactory() {
            @Override
            public View makeView() {
                TextView textView = new TextView(mContext);
                textView.setSingleLine();
                textView.setTextSize(12);//Font size
                textView.setTextColor(Color.parseColor("#ffffff"));
                textView.setEllipsize(TextUtils.TruncateAt.MIDDLE);
                textView.setSingleLine();
                textView.setGravity(Gravity.CENTER);
                FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(
                        ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
                params.gravity = Gravity.CENTER;
                textView.setLayoutParams(params);
                textView.setPadding(25, 0, 25, 0);
                return textView;
            }
        });
    }

        private Runnable runnable = new Runnable() {
        @Override
        public void run() {
            if (!isFlipping) {
                return;
            }
            index++;
            mTextSwitcher.setText(mWarningTextList.get(index % mWarningTextList.size()));
            if (index == mWarningTextList.size()) {
                index = 0;
            }
            startFlipping();
        }
    };

    //Turn on information carousel
    public void startFlipping() {
        if (mWarningTextList.size() > 1) {
            handler.removeCallbacks(runnable);
            isFlipping = true;
            handler.postDelayed(runnable, 3000);
        }
    }

    //Turn off information carousel
    public void stopFlipping() {
        if (mWarningTextList.size() > 1) {
            isFlipping = false;
            handler.removeCallbacks(runnable);
        }
    }

    //Set data
    private void setData() {
        if (mWarningTextList.size() == 1) {
            mTextSwitcher.setText(mWarningTextList.get(0));
            index = 0;
        }
        if (mWarningTextList.size() > 1) {
            handler.postDelayed(new Runnable() {
                @Override
                public void run() {
                    mTextSwitcher.setText(mWarningTextList.get(0));
                    index = 0;
                }
            }, 1000);
            mTextSwitcher.setInAnimation(AnimationUtils.loadAnimation(mContext, R.anim.slide_in_bottom));
            mTextSwitcher.setOutAnimation(AnimationUtils.loadAnimation(mContext, R.anim.slide_out_top));
            startFlipping();
        }
    }

       @Override
    public void onResume() {
        super.onResume();
       startFlipping();
    }

    @Override
    public void onStop() {
        super.onStop();
        stopFlipping();
    }

Cut in Animation: slide in bottom.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <translate
        android:duration="1000"
        android:fromYDelta="100%p"
        android:toYDelta="0" />
</set>

Cut out animation: slide out top.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <translate
        android:duration="1000"
        android:fromYDelta="0"
        android:toYDelta="-100%p" />

</set>

Note: this method works normally in both Activity and Fragment. It can solve the problem of Android text vertical scrolling and vertical horse riding lamp in Fragment.

Keywords: Android xml encoding Fragment

Added by DarkSuperHero on Fri, 01 May 2020 19:56:52 +0300