java - 在 Android 中按下 ToggleButton 时，如何为相对布局 View 上的背景颜色变化设置动画？

Question

我有一个RelativeLayout，其中包含另一个相对布局，其中有几个backgroundColored View ，如下所示，并继续显示更多 View :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                tools:context=".MainActivity
                ">

    <RelativeLayout
        android:id="@+id/palette"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:animateLayoutChanges="true">

        <View
            android:background="@color/purple"
            android:tag="@color/purple"
            android:layout_alignParentTop="true"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
            android:layout_width="100dip"
            android:layout_height="200dip"
            android:id="@+id/view1">
        </View>

然后我有一个 seekbar，当滑动时，它会迭代相对布局的 View 数量，并更改它们的颜色，如下所示:

 @
 Override
 public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {


   for (int i = 0; i < mPalette.getChildCount(); i++) {
     View child = mPalette.getChildAt(i);

     int originalColor = Color.parseColor((String) child.getTag());
     int invertedColor = (0x00FFFFFF - (originalColor | 0xFF000000)) |
       (originalColor & 0xFF000000);

     if (getResources().getColor(R.color.white) != originalColor &&
       getResources().getColor(R.color.lightgray) != originalColor) {

       int red = (originalColor >> 16) & 0x000000FF;
       int green = (originalColor >> 8) & 0x000000FF;
       int blue = originalColor & 0x000000FF;

       int invR = (invertedColor >> 16) & 0x000000FF;
       int invG = (invertedColor >> 8) & 0x000000FF;
       int invB = invertedColor & 0x000000FF;

       child.setBackgroundColor(Color.rgb(
         (int)(red + (invR - red) * (progress / 100f)), (int)(green + (invG - green) * (progress / 100f)), (int)(blue + (invB - blue) * (progress / 100f))));
       child.invalidate();
     }
   }
 }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

运行顺利，没有问题。

我想要实现的是通过使用 ToggleButton“auto” 自动滑动 seekBar ，以便在将 seekbar 的进度从 0 更改为 100 时查看颜色变化，但我的代码实际发生的情况是，它会等到循环完成，只有当 searchbar 达到 100 时才更新 View (并且直接点击它而不单步执行)，我的代码是这样的:

 public void autoToggle(View view) throws InterruptedException {
    SeekBar seekBar=(SeekBar)findViewById(R.id.seekBar);
    boolean on = ((ToggleButton) view).isChecked();
    if(on){
        mPalette = (RelativeLayout) findViewById(R.id.palette);
        for (int i =0;i<10;i++){
            seekBar.setProgress(i);
            mPalette.requestLayout();
            Thread.sleep(10);
        }
    }
    else
        seekBar.setProgress(0);
}

我添加了 mPalette.requestLayout() 方法来查看它是否已更新，但没有更新。

Answer 1

根据这个答案，我决定研究 ObjectAnimator类(class): Android ObjectAnimator

首先，我确实更改了两个按钮的 ToggleButton，一个称为 go100，另一个称为 go0，两个按钮都从其 currentPosition() 滑动 seekbar；到 100 或 0，这是因为它们有更好的使用逻辑，因为如果我不强制取消选中，切换按钮在执行动画后将保持选中状态，无论哪种方式，这都会是一种奇怪的 UI 行为。这两个按钮都位于 RelativeLayout 之外，其中包含 seekBar 重新着色的彩色 View 。

Buttons xml定义，通过使用android:onClick:方法，不需要在代码上重写按钮onClickListener，而只需定义其onClick方法

  <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/go_100"
        android:id="@+id/go100"
        android:onClick="go100"
        android:layout_alignTop="@+id/go0"
        android:layout_alignParentRight="true" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/go_0"
        android:id="@+id/go0"
        android:onClick="go0"
        android:layout_alignWithParentIfMissing="false"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="73dp"
        android:layout_alignParentLeft="true" />

Java代码执行seekBar的滑动，并允许它在滑动时改变，这是实际的问题，因为我可以使用for、while或其他方法让它移动，但不显示起始位置和结束位置之间的滑动间隔。

 /* Called when the go100 button is clicked, it slides the seekBar from its current position
    to 100 in an adjusted time given the previous progress of the seekbar,
    given maximum 4 seconds and minimum 0 seconds
     */
    public void go100(View view){
        final SeekBar seekBar =  (SeekBar) findViewById(R.id.seekBar);
        ObjectAnimator anim = ObjectAnimator.ofInt(seekBar, "progress", seekBar.getProgress(),100);
        anim.setDuration(4000-(4000*seekBar.getProgress()/100));
        anim.start();
    }

    /* Called when the go0 button is clicked, it slides the seekBar from its current position
    to 100 in an adjusted time given the previous progress of the seekbar,
    given maximum 4 seconds and minimum 0 seconds
    */
    public void go0 (View view){
        final SeekBar seekBar =  (SeekBar) findViewById(R.id.seekBar);
        ObjectAnimator anim2 = ObjectAnimator.ofInt(seekBar, "progress", seekBar.getProgress(),0);
        anim2.setDuration(4000*seekBar.getProgress()/100);
        anim2.start();
    }

最后，我还想尝试使用 ObjectAnimator ofMultiInt (Object target, String propertyName, int[][] values) 来尝试将搜索栏从一侧循环到另一侧。并向其提供 int [][] a = new int {{0,100},{100,0} 的矩阵，但没有设法以这种方式解决它并用我的上述解决方案解决。