如何在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 ，將圓心坐標作為參數傳遞。