如何在特定角度下暂停画布旋转2秒钟？

Question

我制作了一个旋转的旋钮，但我希望能在特定角度处将旋钮停留2秒钟。我想要将它停在260度和-20度。

有人能建议如何实现吗？

这是从博客中获得的代码，我根据自己的要求做了很多更改。

public class RotatoryKnobView extends ImageView  {

  private float angle = -20f;
  private float theta_old=0f;

  private RotaryKnobListener listener;

  public interface RotaryKnobListener {
    public void onKnobChanged(float arg);
  }

  public void setKnobListener(RotaryKnobListener l )
  {
    listener = l;
  }

  public RotatoryKnobView(Context context) {
    super(context);
    initialize();
  }

  public RotatoryKnobView(Context context, AttributeSet attrs)
  {
    super(context, attrs);
    initialize();
  }

  public RotatoryKnobView(Context context, AttributeSet attrs, int defStyle)
  {
    super(context, attrs, defStyle);
    initialize();
  }

  private float getTheta(float x, float y)
  {
    float sx = x - (getWidth() / 2.0f);
    float sy = y - (getHeight() / 2.0f);

    float length = (float)Math.sqrt( sx*sx + sy*sy);
    float nx = sx / length;
    float ny = sy / length;
    float theta = (float)Math.atan2( ny, nx );

    final float rad2deg = (float)(180.0/Math.PI);
    float thetaDeg = theta*rad2deg;

    return (thetaDeg < 0) ? thetaDeg + 360.0f : thetaDeg;
  }

  public void initialize()
  {
    this.setImageResource(R.drawable.rotoron);
    setOnTouchListener(new OnTouchListener()
      {
 @Override
 public boolean onTouch(View v, MotionEvent event) {
   float x = event.getX(0);
   float y = event.getY(0);
   float theta = getTheta(x,y);

   switch(event.getAction() & MotionEvent.ACTION_MASK)
     {
     case MotionEvent.ACTION_POINTER_DOWN:
       theta_old = theta;
       break;
     case MotionEvent.ACTION_MOVE:
       invalidate();
       float delta_theta = theta - theta_old;
       theta_old = theta;
       int direction = (delta_theta > 0) ? 1 : -1;
       angle += 5*direction;
       notifyListener(angle+20);
       break;
     }
   return true;
 }
      });
  }

  private void notifyListener(float arg)
  {
    if (null!=listener)
      listener.onKnobChanged(arg);
  }

  protected void onDraw(Canvas c)
  {if(angle==257f){
      try {
            synchronized (c) {

                c.wait(5000);
                angle=260f;
            }

        } catch (InterruptedException e) {
        }
  }
  else if(angle==-16f)
  {
      try {
            synchronized (c) {
                c.wait(5000);
                angle=-20f;
            }

        } catch (InterruptedException e) {

        }
  }
  else
      if(angle>260f)
          {

          angle=-20f;
         }
      else if(angle<-20f)
          {

          angle=260f;
         }
      else{
          c.rotate(angle,getWidth()/2,getHeight()/2);   

      }
    super.onDraw(c);
  }
} 

- Animesh Mangla

---

请停止更改问题以使其完全不同，以使下面的答案无效。 - Brad Larson

Answer 1

你可以设置一个固定的角度，并使用 postDelayed 在 2 秒后将其清除。

    public class RotatoryKnobView extends ImageView {

    private float angle = -20f;
    private float theta_old=0f;

    private RotaryKnobListener listener;

    private Float fixedAngle;
    private float settleAngle;

    private Runnable unsetFixedAngle = new Runnable() {
        @Override
        public void run() {
            angle = settleAngle;
            fixedAngle = null;
            invalidate();
        }
    };

    public interface RotaryKnobListener {
        public void onKnobChanged(float arg);
    }

    public void setKnobListener(RotaryKnobListener l )
    {
        listener = l;
    }

    public RotatoryKnobView(Context context) {
        super(context);
        initialize();
    }

    public RotatoryKnobView(Context context, AttributeSet attrs)
    {
        super(context, attrs);
        initialize();
    }

    public RotatoryKnobView(Context context, AttributeSet attrs, int defStyle)
    {
        super(context, attrs, defStyle);
        initialize();
    }

    private float getTheta(float x, float y)
    {
        float sx = x - (getWidth() / 2.0f);
        float sy = y - (getHeight() / 2.0f);

        float length = (float)Math.sqrt( sx*sx + sy*sy);
        float nx = sx / length;
        float ny = sy / length;
        float theta = (float)Math.atan2( ny, nx );

        final float rad2deg = (float)(180.0/Math.PI);
        float thetaDeg = theta*rad2deg;

        return (thetaDeg < 0) ? thetaDeg + 360.0f : thetaDeg;
    }

    public void initialize()
    {
        this.setImageResource(R.drawable.rotoron);
        setOnTouchListener(new OnTouchListener()
        {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                float x = event.getX(0);
                float y = event.getY(0);
                float theta = getTheta(x,y);

                switch(event.getAction() & MotionEvent.ACTION_MASK)
                {
                    case MotionEvent.ACTION_POINTER_DOWN:
                        theta_old = theta;
                        break;
                    case MotionEvent.ACTION_MOVE:
                        invalidate();
                        float delta_theta = theta - theta_old;
                        theta_old = theta;
                        int direction = (delta_theta > 0) ? 1 : -1;
                        angle += 5*direction;
                        notifyListener(angle+20);
                        break;
                }
                return true;
            }
        });
    }

    private void notifyListener(float arg)
    {
        if (null!=listener)
            listener.onKnobChanged(arg);
    }

    void setFixedAngle(float angle, float settleAngle) {
        fixedAngle = angle;
        this.settleAngle = settleAngle;
        postDelayed(unsetFixedAngle, 2000);
    }

    protected void onDraw(Canvas c)
    {
        if(fixedAngle==null) {
            if (angle > 270) {
                setFixedAngle(270, -15);
            } else if (angle < -20f) {
                setFixedAngle(-20, 260);
            }
        }
        Log.d("angle", "angle: " + angle + " fixed angle: " + fixedAngle);
        c.rotate(fixedAngle == null ? angle : fixedAngle,getWidth()/2,getHeight()/2);

        super.onDraw(c);
    }
}

`

- Ugur Ozmen

---

我已经修改了示例代码中的setFixedAngle()调用。 - Ugur Ozmen

抱歉，我无法理解旋钮的期望行为。您能否更清楚地说明一下？ - Ugur Ozmen

Answer 2

我认为最终的答案是通过扩展SurfaceView并重写onDraw(Canvas canvas)来实现自己的类。然后，您可以使用Canvas例程来渲染控件。如果您搜索一下，就会发现有很多好的示例。要开始初始化表面视图：

    // So things actually render
    setDrawingCacheEnabled(true);
    setWillNotDraw(false);
    setZOrderOnTop(true);

    // Controls the drawing thread.
    getHolder().addCallback(new CallbackSurfaceView());

重写 onDraw 方法并添加渲染程序。您可以按需叠加它们。

public void onDraw(Canvas canvas) {

      // Always Draw
      super.onDraw(canvas);

      drawBackground(canvas);

      drawKnobIndentWell(canvas);

      drawKnob(canvas);

      drawKnobLED( canvas ); //etc....
}

一个回调和更新线程的示例：

/**
 * This is the drawing callback.
 * It handles the creation and destruction of the drawing thread when the
 * surface for drawing is created and destroyed.
 */
class CallbackSurfaceView implements SurfaceHolder.Callback {
    Thread threadIndeterminant;
    RunnableProgressUpdater runnableUpdater;
    boolean done = false;

    /**
     * Kills the running thread.
     */
    public void done() {
        done = true;
        if (null != runnableUpdater) {
            runnableUpdater.done();
        }
    }

    /**
     * Causes the UI to render once.
     */
    public void needRedraw() {
        if (runnableUpdater != null) {
            runnableUpdater.needRedraw();
        }
    }


    /**
     * When the surface is created start the drawing thread.
     * @param holder
     */
    @Override
    public void surfaceCreated(SurfaceHolder holder) {
        if (!done) {
            threadIndeterminant = new Thread(runnableUpdater = new RunnableProgressUpdater());
            threadIndeterminant.start();
        }
    }

    @Override
    public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {

    }

    /**
     * When the surface is destroyed stop the drawing thread.
     * @param holder
     */
    @Override
    public void surfaceDestroyed(SurfaceHolder holder) {

        if (null != runnableUpdater) {
            runnableUpdater.done();
            threadIndeterminant = null;
            runnableUpdater = null;
        }
    }
}

/**
 * This is the runnable for the drawing operations. It is started and stopped by the callback class.
 */
class RunnableProgressUpdater implements Runnable {

    boolean surfaceExists = true;
    boolean needRedraw = false;

    public void done() {
        surfaceExists = false;
    }

    public void needRedraw() {
        needRedraw = true;
    }


    @Override
    public void run() {

        canvasDrawAndPost();

        while (surfaceExists) {

           // Renders continuously during a download operation.
           // Otherwise only renders when requested.
           // Necessary so that progress bar and cirlce activity update.
            if (syncContext.isRunning()) {
                canvasDrawAndPost();
                needRedraw = true;
            } else if (needRedraw) {
                canvasDrawAndPost();
                needRedraw = false;
            }


            try {
                Thread.sleep(100);
            } catch (InterruptedException e) {
                // Don't care
            }
        }


        // One final update
        canvasDrawAndPost();

    }

    /**
     * Routine the redraws the controls on each loop.
     */
    private synchronized void canvasDrawAndPost() {
        Canvas canvas = getHolder().lockCanvas();

        if (canvas != null) {
            try {
                draw(canvas);
            } finally {
                getHolder().unlockCanvasAndPost(canvas);
            }
        }
    }


}

如果您决定采用这种方式，您可以使用自定义值从XML自定义控件。

<com.killerknob.graphics.MultimeterVolumeControl
        android:id="@+id/volume_control"
        android:layout_below="@id/divider_one"
        android:background="@android:color/white"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:minHeight="60dp"
        custom:ledShadow="#357BBB"
        custom:ledColor="#357BBB"
        custom:knobBackground="@color/gray_level_13"
        custom:knobColor="@android:color/black"
        /> 

当您创建自定义控件时，需要使用其包名进行引用。 在 /values 资源文件中创建自定义变量，然后在类中进行引用。

更多细节请参见此处：

http://developer.android.com/training/custom-views/create-view.html

这可能需要比你想象中更多的工作，但我认为最终你会得到一个更专业的控件，并且动画效果会更加流畅。

无论如何，看起来是一个有趣的项目。祝好运。

- mjstam

---

添加了一个链接，显示如何使用自定义值和引用自定义视图类。 - mjstam

您不需要进度更新器代码。我从现有项目中提取了该代码，以提供一个更新线程和回调机制的示例。 - mjstam

我不能这样做，因为它是商业代码，不属于我。 - mjstam