使用Scroller实现文字从底部中间向斜上方两个对角滑动

最新推荐文章于 2021-03-31 22:29:34 发布

原创最新推荐文章于 2021-03-31 22:29:34 发布 · 259 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#Scroller #滑动

Android 专栏收录该内容

42 篇文章

订阅专栏

本文介绍如何使用Scroller和自定义TextView实现文字从底部中间向斜上方两个对角滑动的特效。通过重写computeScroll方法并结合Scroller，实现平滑移动效果。

使用Scroller实现文字从底部中间向斜上方两个对角滑动

效果图

在这里插入图片描述

实现思路

为了实现这一效果，需要自定义两个TextView,实现其computeScroll方法，并且结合Scroller实现平滑移动的效果。单独使用Scroller是无法实现元素移动的。

主要代码片段

自定义TextView

    private Scroller mScroller;
    public MyTestView(Context context) {
        super(context);
    }

    public MyTestView(Context context, AttributeSet attrs) {
        super(context, attrs);
        mScroller = new Scroller(context);
    }

定义实现元素移动的方法供外部activity调用

 public void scrollTo(int destX,int destY){
        int scrollX=getScrollX();
        int scrollY=getScrollY();
        int deltax=destX-scrollX;
        int deltay=destY-scrollY;
        //在2s内完成移动
        mScroller.startScroll(scrollX,scrollY,deltax,deltay,2000);
//        mScroller.startScroll(scrollY,0,deltax,0,2000);
        invalidate();
    }

重写computeScroll()方法

@Override
    public void computeScroll() {
        super.computeScroll();
        if(mScroller.computeScrollOffset()){
            ((View) getParent()).scrollTo(mScroller.getCurrX(),mScroller.getCurrY());
            //刷新重绘 
            invalidate();
        }
    }

外部调用

btn_start.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                tv_test.scrollTo(-400,200);
                tv_test2.smoothScrollTo2(+400,200);
            }
        });

xml布局

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:orientation="horizontal"
        android:gravity="center_horizontal">
        <com.example.myapplication.MyTestView
            android:id="@+id/tv_test"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello"
            android:textSize="10sp"
            android:layout_gravity="bottom|center_horizontal"/>
    </LinearLayout>
    <LinearLayout
        android:id="@+id/ll_test2"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:orientation="horizontal"
        android:gravity="center_horizontal">
        <com.example.myapplication.MyTestView2
            android:id="@+id/tv_test2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello23"
            android:textSize="10sp"
            android:layout_gravity="bottom|center_horizontal"/>
    </LinearLayout>

需要注意的地方
1. 需要定义两个TextView
2. Scroller需要和computeScroll结合使用，否则无法移动元素
3. 两个TextView需要分别包裹在两个父布局中，因为如果在一个父布局中，运行的时候会发现两个TextView滑动的方向是相同的，猜测是和computeScroll方法中的((View) getParent()).scrollTo有关，后续再研究
结语
采用这种方式实现文章开头的效果或许不是最好的，但是研究研究又有何妨呢