Android翻译动画 - 使用AnimationListener永久移动视图到新位置

44
我有一个Android的翻译动画。我有一个带有随机生成位置(next1, next2)的ImageView。每3秒调用一次void方法。它会生成视图的新位置,然后进行动画,并将视图移动到目标位置。Translate动画实现了AnimationListener。当动画完成时,我会在OnAnimationEnd中永久地将视图移动到新位置。我的问题是动画位置与设置layoutParams位置不对应。当动画结束时,它会跳到一个新的位置,大约相差50-100像素。我认为两种情况下位置应该是相同的,因为我在两种情况下都使用了相同的值(next1, next2)。请问您能否向我展示找到解决方案的方法? Drawing of situation here here
 FrameLayout.LayoutParams pozice_motyl = (FrameLayout.LayoutParams)  pozadi_motyl.getLayoutParams();    
            TranslateAnimation anim = new TranslateAnimation(Animation.ABSOLUTE,pozice_motyl.leftMargin, Animation.ABSOLUTE, next1, Animation.ABSOLUTE, pozice_motyl.topMargin, Animation.ABSOLUTE, next2);
            anim.setDuration(1000);
            anim.setFillAfter(true);
            anim.setFillEnabled(true);

            anim.setAnimationListener(new Animation.AnimationListener() {
                @Override
                public void onAnimationStart(Animation animation) {
                }

                @Override
                public void onAnimationEnd(Animation animation) {




                    FrameLayout.LayoutParams layoutParams = new FrameLayout.LayoutParams(100, 100);

                    layoutParams.leftMargin = (int)(next1);
                    layoutParams.topMargin = (int)(next2);
                    pozadi_motyl.setLayoutParams(layoutParams);

                }

                @Override
                public void onAnimationRepeat(Animation animation) {

                }
            });

            pozadi_motyl.startAnimation(anim);

以下是XML布局:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" 
    android:id="@+id/pozadi0"
    android:gravity="center_vertical"
    android:layout_gravity="center_vertical"          
    android:background="@drawable/pozadi2"
    >



<LinearLayout
android:id="@+id/pozadi_motyl"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        >

  <ImageView android:id="@+id/obrazek_motyl"
             android:src="@drawable/motyl"
             android:layout_width="100dip"
             android:layout_height="100dip"
                         />

   </LinearLayout>


<LinearLayout 
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>

<RelativeLayout
android:id="@+id/obrazek_pozadi0"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>



 <ImageView android:id="@+id/zaba_obrazek0"
android:src="@drawable/zaba_obrazek"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerInParent="true"
/>

</RelativeLayout>   
</LinearLayout> 

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" 
>

<cz.zaba.Spojnice  
android:layout_width="fill_parent"          
android:layout_height="fill_parent" 
/>

</LinearLayout>
</FrameLayout>

请查看我的答案,它与此直接相关: https://dev59.com/OaLia4cB1Zd3GeqPdhjR#47593484 - Fernando Prieto Moyano
尝试这个:https://dev59.com/fl4d5IYBdhLWcg3wDe30#70812265 - Sachin Singh
7个回答

57

通常我更喜欢在平移动画中使用增量因子,因为这可以避免很多混淆。

你可以试试这个方法,看看它是否适用于你:

TranslateAnimation anim = new TranslateAnimation(0, amountToMoveRight, 0, amountToMoveDown);
anim.setDuration(1000);

anim.setAnimationListener(new TranslateAnimation.AnimationListener() {

    @Override
    public void onAnimationStart(Animation animation) { }

    @Override
    public void onAnimationRepeat(Animation animation) { }

    @Override
    public void onAnimationEnd(Animation animation) 
    {
        FrameLayout.LayoutParams params = (FrameLayout.LayoutParams)view.getLayoutParams();
        params.topMargin += amountToMoveDown;
        params.leftMargin += amountToMoveRight;
        view.setLayoutParams(params);
    }
});

view.startAnimation(anim);

请确保将 amountToMoveRight / amountToMoveDown 设为final

希望这有所帮助 :)


2
谢谢Gil。小修正:TranslateAnimation anim = new TranslateAnimation(0, amountToMoveRight, 0, amountToMoveDown); - Srikanth
7
这会导致闪烁问题,请参考:https://dev59.com/8HE85IYBdhLWcg3wtVxT - Saro Taşciyan
11
不需要添加监听器,只需使用setFillAfter(true)。 - Valera
2
@Valera 这样做会导致在尝试拦截动画视图上的触摸事件时出现意外行为。 - Gil Moshayof
由于某些原因,我需要将 onAnimationEnd() 的主体放在一个处理程序中。我不知道为什么,但是使用 handler.post() 可以解决问题,否则动画结束时会出现一点卡顿。 - Sufian

49

你应该使用ViewPropertyAnimator。这个动画可以将视图动画到它未来的位置,而且你不需要在动画结束后强制应用任何布局参数。而且使用起来非常简单。

myView.animate().x(50f).y(100f);

myView.animate().translateX(pixelInScreen) 
注意:此像素与视图无关,是屏幕上的像素位置。

有没有设置监听器的方法? - the_prole
@mView.animate().translationY(pixelInScreen) .setListener(object : Animator.AnimatorListener { override fun onAnimationStart(animation: Animator?) {} override fun onAnimationEnd(animation: Animator?) { slideIn(binding.bottomTextContainer) } override fun onAnimationCancel(animation: Animator?) {} override fun onAnimationRepeat(animation: Animator?) {} }) - Ankit Pandey

12

就这样做

view.animate()
            .translationY(-((root.height - (view.height)) / 2).toFloat())
            .setInterpolator(AccelerateInterpolator()).duration = 1500

这里,view 是您要从原始位置动画显示的视图。 root 是您 XML 文件的根视图。

translationY 内部的计算是为了将您的视图移动到顶部,但仍使其保持在屏幕内,否则,如果将其值保持为0,则它将部分超出屏幕。


有没有设置监听器的方法? - the_prole

2
这是对我非常有效的方法:-
// slide the view from its current position to below itself
public void slideUp(final View view, final View llDomestic){

    ObjectAnimator animation = ObjectAnimator.ofFloat(view, "translationY",0f);
    animation.setDuration(100);
    llDomestic.setVisibility(View.GONE);
    animation.start();

}

// slide the view from below itself to the current position
public void slideDown(View view,View llDomestic){
    llDomestic.setVisibility(View.VISIBLE);
    ObjectAnimator animation = ObjectAnimator.ofFloat(view, "translationY",   0f);
    animation.setDuration(100);
    animation.start();
}

llDomestic:您想要隐藏的视图。 view:您想要向下或向上移动的视图。


2
你可以尝试这种方法 -
最初的回答
ObjectAnimator.ofFloat(view, "translationX", 100f).apply {
    duration = 2000
    start()
}

注意 - view 是您希望进行动画的视图。

最初的回答:请注意,view是您想要进行动画的视图。


1

列出三种实现此目标的方法,以备将来参考

fun translateView(viewToAnimate: View, positionX: Int) {
        

直接动画显示视图
        viewToAnimate.animate()
            .x(positionX)
            .setDuration(600L)
            .setInterpolator(defaultAnimationInterpolator)
            .start()

对象动画器
         ObjectAnimator.ofFloat(
            viewToAnimate,
            View.X,
            positionX
        ).apply {
            duration = 600
            interpolator = defaultAnimationInterpolator
        }.start()

价值动画器
        ValueAnimator.ofFloat(viewToAnimate.x, positionX).apply {
            duration = 2000
            interpolator = defaultAnimationInterpolator
            addUpdateListener {
                viewToAnimate.x = it.animatedValue as Float
            }
            start()
        }
    }

-1
Just add this function. And we are good to goo.. 


fun moveView(viewToMove: View, targetView: View, repeatCount: Int? = 10) {
    val viewToMovePos = IntArray(2)
    viewToMove.getLocationOnScreen(viewToMovePos)

    val targetViewPos = IntArray(2)
    targetView.getLocationOnScreen(targetViewPos)

    // Calculate the distance to move
    val moveX = targetViewPos[0] - viewToMovePos[0]
    val moveY = targetViewPos[1] - viewToMovePos[1]

    // Create a TranslateAnimation for the movement
    val animation = TranslateAnimation(0f, moveX.toFloat(), 0f, moveY.toFloat())
    animation.duration = 300 // Set the duration of the animation (in milliseconds)

    // Set animation properties (optional)
    animation.fillAfter = true
    animation.repeatCount = repeatCount ?: 10


    // Start the animation on the source view
    viewToMove.startAnimation(animation)
}

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接