【问题标题】:Android - Show/Hide TextView using Swipe Left to RightAndroid - 使用从左向右滑动显示/隐藏 TextView
【发布时间】:2017-05-28 20:06:45
【问题描述】:

我正在尝试显示/隐藏 TextView。因此,如果用户从左向右滑动,它将从“橙色渐变视图”后面显示 TextView。并且显示文字后,5秒后会再次隐藏,如下图:

但我不知道像上面那样实施的最佳实践是什么。 请帮忙。

【问题讨论】:

  • 把它们放在另一个上面,然后用谷歌搜索一下:GestureDetector,Android Animation
  • 扩展@gudin 所写的内容。将它们都放在顶部渐变的框架布局中,当在橙色渐变小部件上检测到手势时,为向右滑动动画设置动画(当动画完成时,使用动画侦听器将橙色渐变设置为不可见)。创建一个新的 postdelayed 处理程序 5 秒钟,完成后将橙色渐变滑回或使其再次可见。
  • @BradleyWilson:你能给我举个例子吗?如果手势 x pos 在中心,我如何将动画暂停到橙色渐变小部件宽度的一半?
  • 很遗憾我不是来为你写代码的。但是您可以只做一个 TranslateAnimation 并将中心的位置设置为与用户的触摸位置相同,直到他们到达屏幕的末端(或靠近它)
  • 谢谢布拉德利。 @wdyz 阅读动画文档:developer.android.com/guide/topics/graphics/view-animation.html 一旦你理解了它,你就会明白的。无论如何,这是更具体的定制设计,所以不要指望找到完全符合您要求的代码,而是您必须花一些时间阅读文档。

标签: android view textview show-hide swipe-gesture


【解决方案1】:

在 res 目录中创建一个目录动画并将其作为 slide.xml

<?xml version="1.0" encoding="utf-8"?>
<set
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/linear_interpolator"
    android:fillAfter="true">

   <translate
        android:fromXDelta="0%p"
        android:toXDelta="75%p"
        android:duration="800" />
</set>

使用下面的动画方法

    /**
     * Animate the swipe rightto left
     *
     * @param context context of the activity or fragment
     */
    private void animImage(final Context context) {
        // Load the animation like this
        final Animation animRightToLeft = AnimationUtils.loadAnimation(context, R.anim.anim_move_right_to_left);
        textViewObject.setLayerType(View.LAYER_TYPE_HARDWARE, null);
        // Start the animation like this
        textViewObject.startAnimation(animRightToLeft);
    }

// Now on MainActivity 
llMain.setOnTouchListener(new OnSwipeTouchListener(ThemeSelectionActivity.this) {
            @Override
            public void onSwipeLeft() {
                super.onSwipeLeft();

                }
            }

            @Override
            public void onSwipeRight() {
                super.onSwipeRight();
animImage(getApplicationContext());
            }
        });

【讨论】:

  • 谢谢,我们怎样才能让它触摸响应式幻灯片动画。就像我触摸并向右滑动它一样,它会滑动到我手指所在的位置。与whatsapp回复功能相同
【解决方案2】:

这是xml文件

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/activity_theme_sel_ll_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

   <!--Add your content here for texview and whatever -->
    </LinearLayout>

现在使用这个类

import android.content.Context;
import android.view.GestureDetector;
import android.view.GestureDetector.SimpleOnGestureListener;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;

/**
 * This TouchListener is Using for very First time ThemeSelection Screen with SwipeLeft Finger
 */
public class OnSwipeTouchListener implements OnTouchListener {

    private final GestureDetector gestureDetector;

    public OnSwipeTouchListener(Context ctx) {
        gestureDetector = new GestureDetector(ctx, new GestureListener());
    }

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        return gestureDetector.onTouchEvent(event);
    }

    private final class GestureListener extends SimpleOnGestureListener {

        private static final int SWIPE_THRESHOLD = 1;
        private static final int SWIPE_VELOCITY_THRESHOLD = 1;

        @Override
        public boolean onDown(MotionEvent e) {
            return true;
        }

        @Override
        public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
            boolean result = false;
            try {
                float diffY = e2.getY() - e1.getY();
                float diffX = e2.getX() - e1.getX();
                if (Math.abs(diffX) > Math.abs(diffY)) {
                    if (Math.abs(diffX) > SWIPE_THRESHOLD && Math.abs(velocityX) > SWIPE_VELOCITY_THRESHOLD) {
                        if (diffX > 0) {
                            onSwipeRight();
                        } else {
                            onSwipeLeft();
                        }
                    }
                    result = true;
                } else if (Math.abs(diffY) > SWIPE_THRESHOLD && Math.abs(velocityY) > SWIPE_VELOCITY_THRESHOLD) {
                    if (diffY > 0) {
                        onSwipeBottom();
                    } else {
                        onSwipeTop();
                    }
                }
                result = true;

            } catch (Exception exception) {
                exception.printStackTrace();
            }
            return result;
        }
    }

    public void onSwipeRight() {
    }

    public void onSwipeLeft() {
    }

    public void onSwipeTop() {
    }

    public void onSwipeBottom() {
    }
}

在您的 MainActivity.java 类中使用以下代码

//llMain is the root layout of your xml where you want to perform swipe 
        llMain.setOnTouchListener(new OnSwipeTouchListener(ThemeSelectionActivity.this) {
            @Override
            public void onSwipeLeft() {
                super.onSwipeLeft();

                }
            }

            @Override
            public void onSwipeRight() {
                super.onSwipeRight();

    // Put your logic here for text visibility and for timer like progress bar for 5 second and setText 
            }
        });

【讨论】:

  • 谢谢!我已经尝试过这段代码并且效果很好。但是,我如何在橙色渐变小部件上添加滑动动画?动画可以在手势的 x 位置停止吗?
猜你喜欢
  • 1970-01-01
  • 2021-07-05
  • 2011-04-17
  • 1970-01-01
  • 1970-01-01
  • 2011-03-17
  • 1970-01-01
  • 2011-03-29
  • 2010-10-10
相关资源
最近更新 更多