android - Android环形除法

我需要创建带有间隙的圆形。

我正在创建一个代表时钟的进度栏。每个时间分配12个间隔。

这正是我想要实现的目标。（死亡之星的外圈）

到目前为止，这是我的代码：

在activity.xml中

<ProgressBar
    android:id="@+id/progressBar"
    android:layout_width="200dp"
    android:layout_height="200dp"
    android:indeterminate="false"
    android:progressDrawable="@drawable/circular_progress_bar"
    android:background="@drawable/circle_shape"
    style="?android:attr/progressBarStyleHorizontal"
    android:max="500"
    android:progress="65"
    android:layout_marginBottom="165dp"
    android:layout_above="@+id/button5"
    android:layout_centerHorizontal="true" />

在circular_progress_bar中

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="270"
    android:toDegrees="270">
    <shape
        android:innerRadiusRatio="2.5"
        android:shape="ring"
        android:thickness="4dp"
        android:useLevel="true"><!-- this line fixes the issue for lollipop api 21 -->

        <gradient
            android:angle="0"
            android:endColor="#007DD6"
            android:startColor="#007DD6"
            android:type="sweep"
            android:useLevel="false" />
    </shape>
</rotate>

在circle_shape.xml中

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring"
    android:innerRadiusRatio="2.5"
    android:thickness="4dp"
    android:useLevel="false">

    <solid android:color="#CCC" />
    <stroke
        android:dashGap="10px"
        android:dashWidth="10px"
        android:width="1dp"
        android:color="#ababb2" />
</shape>

如何分离形状，使其看起来像这样？我在正确的道路上吗？

最佳答案

过去，我不得不创建一个自定义进度栏。
我不确定您的解决方案，因此我不会对此发表评论。
这是我处理此问题的方式：

我创建了一个覆盖LinearLayout的自定义类（我需要向其中添加更多视图，但是您可以覆盖任何其他视图）

然后，我重写onDraw并在画布上绘制一个Arch：

ArchProgressBar.java

public class ArchProgressBar extends LinearLayout {

private static final float START_ANGLE = 130;
private static final float ARCH_LENGTH = 50;

public ArchProgressBar(Context context) {
    super(context);
    init(context);
}

public ArchProgressBar(Context context, AttributeSet attrs) {
    super(context, attrs);
    init(context);
}

private void init(Context context) {
    this.setWillNotDraw(false);

    LayoutInflater inflater = (LayoutInflater) context
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    inflater.inflate(R.layout.arch_progress_bar, this, true);

    this.postInvalidate();
}

@Override
public void onDraw(Canvas canvas) {

    float middleWidth = canvas.getWidth() / 2;
    float middleHeight = canvas.getHeight() / 2;
    float left = middleWidth - 105 * getResources().getDisplayMetrics().density;
    float top = middleHeight - 90 * getResources().getDisplayMetrics().density;
    float right = middleWidth + 105 * getResources().getDisplayMetrics().density;
    float bottom = middleHeight + 120 * getResources().getDisplayMetrics().density;

    Paint mPaintBackground = new Paint();
    mPaintBackground.setAntiAlias(true);
    mPaintBackground.setStyle(Paint.Style.STROKE);
    mPaintBackground.setStrokeWidth(35);
    mPaintBackground.setColor(Color.BLACK);

    RectF mRectF = new RectF(left, top, right, bottom);

    // draw background line
    canvas.drawArc(mRectF, START_ANGLE, ARCH_LENGTH, false, mPaintBackground);

    canvas.drawArc(mRectF, START_ANGLE + ARCH_LENGTH + 10, ARCH_LENGTH, false, mPaintBackground);

}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    int width = View.MeasureSpec.getSize(widthMeasureSpec);
    setMeasuredDimension(width, Math.max(800, heightMeasureSpec));
}

}

arch_progress_bar.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

</LinearLayout>

然后您可以将其添加到所需的任何xml中，如下所示：

<com.training.archprogress.ArchProgressBar
    android:id="@+id/result_result"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true" />

您可以只绘制12个不同的线段，并使拱形稍小于线段的大小。
然后，只需绘制进度更新时所需的分段数即可。

我将带有此解决方案的项目放在github中：
https://github.com/nevoroee/ArchProgress

XML

android - Android环形除法