2016-05-29 6 views
2

丸みを帯びた四角形の進捗バーを作成して、画像の周りに進捗を描こうとしています。Android - 丸い四角の進捗バー

<shape xmlns:android="http://schemas.android.com/apk/res/android" > 

    <stroke 
     android:width="6dp" 
     android:color="@android:color/holo_green_light" /> 

    <padding 
     android:left="5dp" 
     android:right="5dp" 
     android:bottom="5dp" 
     android:top="5dp" /> 

    <corners android:radius="50dp" /> 

</shape> 

私は、このソリューションの承知している:https://github.com/mrwonderman/android-square-progressbarが、私は効果などに興味はないんだけど

enter image description here

はこれまでのところ、私は私の丸みを帯びた正方形のラインを定義し、次のXMLを持っています私が望むものではありません。

丸い四角い線の上にプレーン・サークルを作成しようとしましたが、2つをPorterDuffとマージしようとしましたが、これまではプログレスバー・エフェクトを作成できませんでした。その円を描いて進行を描く

私はまた、膨らんだ四角形を作成しようとしました。なぜなら、XML膨張が平らなイメージとみなされ、すべてのピクセルがPorterDuffマージの際に考慮されたからです。しかし、同じ結果。

+0

'setProgressDrawable' – pskink

+0

@を呼び出すときに使用されるカスタム' Drawable'クラスを作成しますpskink、はい、ありがとうございますが、行に正しい進捗効果を引き出す方法はありますか? – Bibu

+0

カスタムDrawableクラスを作成しましたか?丸い矩形を描くときにどのようなプロブレンがありますか? – pskink

答えて

3

この単純なカスタムクラスを試してみてください。

class V extends View { 
    Path path = new Path(); 
    Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG); 
    float length; 
    float[] intervals = {0, 0}; 

    public V(Context context) { 
     super(context); 
     paint.setColor(Color.GREEN); 
     paint.setStyle(Paint.Style.STROKE); 
     paint.setStrokeWidth(20); 
    } 

    @Override 
    protected void onSizeChanged(int w, int h, int oldw, int oldh) { 
     path.reset(); 
     RectF rect = new RectF(0, 0, w, h); 
     float inset = paint.getStrokeWidth(); 
     rect.inset(inset, inset); 

     path.addRoundRect(rect, 100, 100, Path.Direction.CW); 
     length = new PathMeasure(path, false).getLength(); 
     intervals[0] = intervals[1] = length; 
     PathEffect effect = new DashPathEffect(intervals, length); 
     paint.setPathEffect(effect); 
    } 

    public void setProgress(int progress) { 
     PathEffect effect = new DashPathEffect(intervals, length - length * progress/100); 
     paint.setPathEffect(effect); 
     invalidate(); 
    } 

    @Override 
    protected void onDraw(Canvas canvas) { 
     canvas.drawPath(path, paint); 
    } 
} 

テストコード(Activity#onCreateの内側に入れる):

LinearLayout ll = new LinearLayout(this); 
    ll.setOrientation(LinearLayout.VERTICAL); 
    SeekBar sb = new SeekBar(this); 
    ll.addView(sb); 
    final V v = new V(this); 
    ll.addView(v); 
    setContentView(ll); 

    SeekBar.OnSeekBarChangeListener sbcl = new SeekBar.OnSeekBarChangeListener() { 
     @Override 
     public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) { 
      v.setProgress(progress); 
     } 
     @Override public void onStartTrackingTouch(SeekBar seekBar) {} 
     @Override public void onStopTrackingTouch(SeekBar seekBar) {} 
    }; 
    sb.setOnSeekBarChangeListener(sbcl);