如何在Android中用填充颜色绘制自定义圆圈？

Question

我正在尝试在我的Android应用程序中绘制此形状：

我想画一个大笔画的空心圆，

我想绘制一个宽笔触的空心圆，我希望每个圆都以自定义方式填充。 如果用户输入57，则圆圈笔触将为57％黄色，并且在形状的中间将是文本视图。 有办法吗？

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

public class MyView extends View {

Paint paint;
Path path;

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

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

public MyView(Context context, AttributeSet attrs, int defStyle) {
 super(context, attrs, defStyle);
 init();
}

private void init(){
paint = new Paint();
paint.setColor(Color.BLUE);
paint.setStrokeWidth(10);
paint.setStyle(Paint.Style.STROKE);

}

@Override
protected void onDraw(Canvas canvas) {
 // TODO Auto-generated method stub
 super.onDraw(canvas);

 paint.setStyle(Paint.Style.STROKE);
 canvas.drawCircle(50, 50, 30, paint);



}

}

和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="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="right"
        android:orientation="vertical"
        android:padding="10dp" >

        <TextView
            style="@style/black_textview"
            android:text="@string/status_m" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:baselineAligned="false"
            android:orientation="horizontal" >

            <FrameLayout
                android:id="@+id/frame_graph_1"
                android:layout_width="0dp"
                android:layout_height="100dp"
                android:layout_marginTop="10dp"
                android:layout_weight="1"
                android:orientation="vertical" >
            </FrameLayout>

            <FrameLayout
                android:id="@+id/frame_graph_2"
                android:layout_width="0dp"
                android:layout_height="100dp"
                android:layout_marginTop="10dp"
                android:layout_weight="1"
                android:orientation="vertical" >
            </FrameLayout>

            <FrameLayout
                android:id="@+id/frame_graph_3"
                android:layout_width="0dp"
                android:layout_height="100dp"
                android:layout_marginTop="10dp"
                android:layout_weight="1"
                android:orientation="vertical" >
            </FrameLayout>
        </LinearLayout>
    </LinearLayout>

</LinearLayout>

这是主要的课程

public  class HomeGraphFragment extends Fragment {

    FrameLayout frameGraph1 , frameGraph2 , frameGraph3;

    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {

        View v = inflater.inflate(R.layout.home_graph, container, false);
        init(v);
        return v;
    }

    private void init(View v) {

        frameGraph1 = (FrameLayout)v.findViewById(R.id.frame_graph_1);
        frameGraph2 = (FrameLayout)v.findViewById(R.id.frame_graph_2);
        frameGraph3= (FrameLayout)v.findViewById(R.id.frame_graph_3);

        frameGraph1.addView(new MyView(getActivity()));

    }



}

Answer 1

您可以自定义进度栏：

<item android:id="@android:id/background">
    <rotate
        android:fromDegrees="270"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="270" >
        <shape
            android:innerRadiusRatio="3"
            android:shape="ring"
            android:thicknessRatio="15.0" >
            <solid android:color="@color/clr_secondary" />
        </shape>
    </rotate>
</item>
<item android:id="@android:id/secondaryProgress">
    <rotate
        android:fromDegrees="270"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="270" >
        <shape
            android:innerRadiusRatio="3"
            android:shape="ring"
            android:thicknessRatio="15.0" >
            <solid android:color="@color/clr_secondary" />
        </shape>
    </rotate>
</item>
<item android:id="@android:id/progress">
    <rotate
        android:fromDegrees="270"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="270" >
        <shape
            android:innerRadiusRatio="3"
            android:shape="ring"
            android:thicknessRatio="15.0" >
            <solid android:color="@color/clr_primary" />
        </shape>
    </rotate>
</item>

最后将ProgressBar drawable设置为您的drawable

android:progressDrawable="@drawable/blue_progress_bar"

要在中心显示文本，请将RelativeLayout设置为背景，然后添加ProgressBar和TextView 。 然后在父级RelativeLayout设置centerInParent="true"

Answer 2

您可以使用SweepGradient ，将圆心坐标作为参数传递。