Android 반지 모양의 분할로

Question

간격이있는 원형 모양을 만들어야합니다.

시계를 나타내는 진행률 막대를 만듭니다. 각 간격은 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> 

에서 (죽음의 별에 외부 링) 여기

지금까지 내 코드입니다

내 모양을 어떻게 분리합니까? 나는 올바른 길을 가고 있는가?

Answer 1

과거에 사용자 지정 진행률 표시 줄을 만들어야했습니다. 솔루션에 대해서는 잘 모르겠습니다. 이 내가이 문제에 접근하는 방법입니다

내가있는 LinearLayout를 오버라이드 (override) 사용자 정의 클래스를 만들었을의 onDraw를

그럼 난 무시하고 단지 아치를 그리는 (I는하지만 다른 뷰를 대체 할 수 있습니다 몇 가지 더보기를 추가 할 필요)

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> 

012 : 캔버스 이상 3,516,

당신은 당신이 이렇게 원하는 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 개 개의 세그먼트를 그리고 세그먼트의 크기보다 약간 작은 아치를 만들 수 있습니다. 그런 다음 진행 상황을 업데이트하는 동안 필요한 세그먼트 수를 그립니다. https://github.com/nevoroee/ArchProgress