Android 圆形菜单，如 Catch Notes

Question

我尝试在这个应用中做圆形菜单。

在“扩展”模式下，我将这个组件绘制如下：

<RelativeLayout android:id="@+id/bigCircle">
<!--color full borders-->
    <my.custom.component android:id="@+id/middleCircle">
    <!--circle for buttons-->
         <RelativeLayout android:id="@+id/smallCircle">
           <!--minus button-->
         </RelativeLayout>
    </my.custom.component>
</RelativeLayout>

在my.custom.component 的onDraw 方法中，我使用android.graphics.Path 和android.graphics.Paint 以及一些数学将圆分成8 个部分。
视觉上我完全如屏幕截图所示。但是当我按下圆圈的一部分时，我需要用另一种颜色重新绘制这部分，以向用户展示发生了什么。

例如，我如何通过android.graphics.Path 重新绘制与画布的另一部分截断的组件画布的一部分。
换句话说，我知道我应该在 onDraw 方法中重绘画布，我知道我可以展示一些来自可绘制的位图在 Photoshop 中绘制并且有一些“多屏问题”，我知道如何确定用户按下的部分。但我不知道如何选择画布的一部分并重绘它。

Answer 1

Catch 的开发者在这里。如果我理解您的问题，那么您将无法理解如何在圆形菜单的某个部分上专门绘制突出显示/选择指示器。

虽然有很多不同的方法可以实现它，但您倾向于（使用android.graphics.Path）是我们如何做到的。在我们的捕获按钮的视图层次结构中，有一个元素用作画布，在该画布上绘制选择突出显示颜色（如果有 是一个活动选择）。

如果您的布局中有类似的自定义 View，您可以像这样复制此行为。首先，您需要Path 来定义特定圆段的选择。使用Path.addArc(RectF, float, float)，我们可以得到我们需要的披萨片形状的路径：

private Path getPathForSegment(float startAngle, float sweep) {
    Point center = new Point(getWidth() / 2, getHeight() / 2);
    RectF rect = new RectF(0f, 0f, getWidth(), getHeight());
    Path selection = new Path();
    selection.addArc(rect, startAngle, sweep);
    selection.lineTo(center.x, center.y);
    selection.close();
    return selection;
}

上面的getWidth() 和getHeight() 用于封闭的自定义视图对象，因此它们定义了包含绘制选择的圆圈的边界框。

然后，在您的自定义视图的onDraw(Canvas) 中，如果您的代码已确定应为段绘制选择：

@Override
protected void onDraw(Canvas canvas) {
    // Assume one has the rest of these simple helper functions defined
    if (shouldDrawSelection()) {
        float startAngle = getStartAngleOfSelectedSegment();
        float sweep = getSweepAngle();
        Paint paint = getPaintStyleForSelectedSegment();
        Path path = getPathForSegment(startAngle, sweep);
        canvas.drawPath(path, paint);
    }

    // ...

    super.onDraw(canvas);
}

在跟踪触摸的其他代码区域中，只需在自定义视图上调用 invalidate()，它就会根据输入或状态的变化重绘（或不重绘）选择路径。

请记住，避免newing 对象在onDraw() 中是一种很好的做法，因此这些构建块（Paths、Paints 等）中的大多数可以提前构建（或一次，首次出现）并重复使用。

希望这与您的要求接近！