在 Android 中按下 ToggleButton 时,如何在相对布局视图上设置动画背景颜色变化?

How to animate background color change on relative layouts views when pressing a ToggleButton in Android?

我有一个 RelativeLayout 包含另一个 relative layout,其中有几个 backgroundColored 视图,像这样,并继续更多视图:

<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,它在滑动时遍历 relative layouts 的视图数并更改它们的颜色,如下所示:

 @
 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,但我的代码实际发生的是它等待循环完成,只有当搜索栏达到 100 时才更新视图(它直接点击它而不是步进它),我的代码是这样的:

 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() 方法来查看它是否更新,但也没有。

根据这个答案,我决定研究 ObjectAnimator class: Android ObjectAnimator

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

按钮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} 但没有设法解决它并采用我上面的解决方案。