滑动动画具有多视图同步问题 [英] Sliding animation having multiple views synchronization issue

问题描述

我正在尝试制作具有两个textviews的动画.两者都处于相对布局.动画的功能是，左textview左移一点，同时右textview也会左移一点.我已经尝试过:

I am trying to make an animation with two textviews. Both are in a relative layout. The functionality of the animation is left textview will go little bit left and at the same time right textview will also go little bit left. I have tried:

http://nineoldandroids.com/和默认方式.

但是对于这两种情况，我在处理过程中都存在差距.我已经提出了一个问题，但没有得到任何肯定的答复:

But for both case I am getting a gap during the process. I already put one question but i am not getting any positive reply:

Android滑块动画未同步

Nineoldandroids代码:

Nineoldandroids code:

xml文件:

 <RelativeLayout  
android:layout_width="match_parent" android:layout_height="wrap_content"  
android:orientation="horizontal"
android:layout_below="@+id/target"
android:layout_marginTop="50dp"> 

<TextView
    android:id="@+id/TextView01"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:layout_alignParentLeft="true"     
    android:background="#f00"
    android:gravity="center"
    android:text="RED"
    android:textColor="#000" />

<Button
        android:id="@+id/TextView02"
        android:layout_width="50dp"
        android:layout_height="match_parent"
        android:layout_alignBottom="@+id/TextView01"
        android:layout_alignParentRight="true"
        android:layout_alignTop="@+id/TextView01"
        android:background="#0F0"
        android:text="TXT"
        android:visibility="invisible" />
</RelativeLayout>

MainActivity.java:

MainActivity.java:

public class MainActivity extends Activity {
  double counter = 0;
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.toggles);
    final View target = findViewById(R.id.target);
    final int duration = 5*1000;
    final int duration1 = 300;

    final View textView1 = findViewById(R.id.TextView01);
    final View textView2 = findViewById(R.id.TextView02);
    textView1.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View v) {
        if (counter == 0) {
          textView2.setVisibility(View.VISIBLE);
          ObjectAnimator.ofFloat(textView1, "translationX", 0, -50).setDuration(duration1).start();
          ObjectAnimator.ofFloat(textView2, "translationX", 100, 0).setDuration(duration1).start();
          counter++;

        }
        else {
          ObjectAnimator.ofFloat(textView1, "translationX", -50,0).setDuration(duration1).start();
          ObjectAnimator.ofFloat(textView2, "translationX", 0,100).setDuration(duration1).start();
          counter--;
        }
      }
    });
  }
}

我该如何解决?

否则，我试图将两个textview放在一个布局中，其中第二个textview将位于屏幕外，然后使用动画将整个布局移动.我怎样才能像这样的XML?

otherwise I am trying to put both textview inside a layout where second textview will be outside the screen and using the animation I will move the whole layout. how can I make the xml like this?

推荐答案

很抱歉误解了您的问题.

Sorry for misunderstanding your question.

无论如何，您的问题与时间无关.两种动画的持续时间相同，但问题在于动画区域的大小不同.从逻辑上讲，在相同的持续时间内移动较长的距离看起来比移动较小的距离要慢.

Anyway, your issue is not about time exactly. Both animations have the same duration but the problem is the sizes of the animated regions are different. Logically, moving a longer distance in the same duration will look slower than moving a smaller distance.

例如，为了解决您的问题，我在OnClickListener中使用了以下代码:

For example, to solve your problem, I used the following code in the OnClickListener:

public void onClick(View v) {
    int width =textView2.getWidth();
    if (counter == 0) {
        textView2.setVisibility(View.VISIBLE);
        ObjectAnimator.ofFloat(textView1, "translationX", 0, -1*width).setDuration(duration1).start();
        ObjectAnimator.ofFloat(textView2, "translationX", 1*width, 0).setDuration(duration1).start();
        counter++;

    }
    else {
        ObjectAnimator.ofFloat(textView1, "translationX", -1*width, 0).setDuration(duration1).start();
        ObjectAnimator.ofFloat(textView2, "translationX", 0, 1*width).setDuration(duration1).start();
        counter--;
    }
}

这篇关于滑动动画具有多视图同步问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！