5

触摸蓝色图像时有两个黑色和蓝色图像，它应该像进度一样填充，我使用多个剪切图像而不使用画布但没有smoothness接触，例如100 Pushups 应用程序。

实际上，我正在尝试实现类似于上面提到的 100 Pushups 应用程序，我有一个 链接，但这是使用画布实现的，我想使用图像来实现，我谷歌但没有运气，任何类似于该应用程序的链接或教程（ 100个俯卧撑）？

在此处输入图像描述

4

2 回答 2

4

这是我使用剪辑路径想出的东西。我正在使用以下图像（编码器颜色），其中背景是纯色的，前景是透明背景上仅包含蓝色圆圈的。第一个背景图像被绘制到屏幕上，然后设置剪辑路径，以便在其顶部正确绘制进度图像，前景一个。

背景图片; http://i.imgur.com/Sf6kg.png
前景图片；http://i.imgur.com/Svtoh.png

和代码；

private class ProgressView extends View {

    private Bitmap bgBitmap;
    private Bitmap fgBitmap;
    private RectF fullRect = new RectF();
    private Path clipPath = new Path();

    public ProgressView(Context context) {
        super(context);
        bgBitmap = BitmapFactory.decodeResource(
                                   context.getResources(), R.drawable.bg);
        fgBitmap = BitmapFactory.decodeResource(
                                   context.getResources(), R.drawable.fg);
    }

    @Override
    public void onDraw(Canvas c) {
        fullRect.right = getWidth();
        fullRect.bottom = getHeight();

        c.drawBitmap(bgBitmap, null, fullRect, null);

        float angle = SystemClock.uptimeMillis() % 3600 / 10.0f;

        clipPath.reset();
        clipPath.setLastPoint(getWidth() / 2, getHeight() / 2);
        clipPath.lineTo(getWidth() / 2, getHeight());
        clipPath.arcTo(fullRect, -90, angle);
        clipPath.lineTo(getWidth() / 2, getHeight() / 2);
        c.clipPath(clipPath);

        c.drawBitmap(fgBitmap, null, fullRect, null);

        invalidate();
    }   
}

用体面的图像替换我的临时图像并以更合适的方式更新角度应该不会太难。

于 2013-01-18T21:02:09.933 回答
1

它将是一个自定义视图，它将处理onTouchEvent()方法并在用户触摸视图时重绘。

该onDraw()方法将检查如下内容：

if(mIsBeingTouched){
  //set colour to touched
}
doDraw(canvas);
///....

所以当用户触摸视图时，我会增加一个计数，然后增加弧计数。

final float arcDistance = mCurrentCount * 3.6; //Based on a max of 100
canvas.drawArc(mBoundsRectF, 0f, mCurrentCount, mPaint);

然后根据计数得出。

于 2013-01-17T13:56:24.793 回答