2017-06-27 7 views
2

に矩形を描画するにはどうすればビュー以下のようにする必要があります。アンドロイドは円

私が使用している角丸矩形

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"> 

    <solid android:color="@color/bg_send_text" /> 
    <corners android:radius="100dip" /> 
</shape> 

を描く。そして、私はVoiceDrawableがGradientDrawableを拡張し、書き込み、およびこのコードを使用することができます知っている:

public void setVoice(int voice) { 
    level = (float) 1.0 * voice/100; 
} 

@Override 
public void draw(Canvas canvas) { 
    super.draw(canvas); 

    rect = getBounds(); 
    canvas.drawRect(rect.left, rect.top + (rect.bottom - rect.top) * 
     (1 - level), rect.right, rect.bottom, paint); 
} 

しかし、結果は次のとおりです。enter image description here

私は使っていますが、

paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN)); 

このビューを実装するにはどうすればよいですか?私に何ができる?

+0

こんにちは、@pskink、私はこのビューを実装しました。後でコメントを追加します。審査にお役立てください。私はhttps://github.com/gelitenight/WaveView – Strong

答えて

0

すべて

私は、このビューを実装している:

import android.graphics.Bitmap; 
import android.graphics.BitmapShader; 
import android.graphics.Canvas; 
import android.graphics.Matrix; 
import android.graphics.Paint; 
import android.graphics.Rect; 
import android.graphics.RectF; 
import android.graphics.Shader; 
import android.graphics.drawable.GradientDrawable; 

public class VoiceDrawable extends GradientDrawable { 
    private static final float DEFAULT_LEVEL = 0.5f; 

    private Paint levelPaint; 
    private Paint viewPaint; 
    private BitmapShader bitmapShader; 
    private Matrix shaderMatrix; 
    private float radius; 

    private float level; 

    public VoiceDrawable() { 
     super(); 
     init(); 
    } 

    private void init() { 
     levelPaint = new Paint(); 
     levelPaint.setStyle(Paint.Style.FILL); 

     viewPaint = new Paint(); 
     shaderMatrix = new Matrix(); 
    } 

    public void setCornerRadius(float radius) { 
     super.setCornerRadius(radius); 

     this.radius = radius; 
    } 

    public void setVoice(float level) { 
     this.level = level; 

     invalidateSelf(); 
    } 

    public void setLevelColor(int color) { 
     levelPaint.setColor(color); 
    } 

    @Override 
    public void draw(Canvas canvas) { 
     super.draw(canvas); 

     Rect rect = getBounds(); 
     if (bitmapShader == null) { 
      initLevel(rect); 
     } 
     float scale = level == 0 ? 100 : (1 - level)/(1 - DEFAULT_LEVEL); 
     shaderMatrix.setScale(1, scale, 0, DEFAULT_LEVEL); 
     bitmapShader.setLocalMatrix(shaderMatrix); 

     float rad = Math.min(radius, Math.min(rect.width(), rect.height()) * 0.5f); 
     canvas.drawRoundRect(new RectF(rect), rad, rad, viewPaint); 
    } 

    private void initLevel(Rect rect) { 
     Bitmap bitmap = Bitmap.createBitmap(rect.width(), rect.height(), Bitmap.Config.ARGB_8888); 
     Canvas canvas = new Canvas(bitmap); 
     canvas.drawRect(rect.left, rect.top + rect.height() * (1 - DEFAULT_LEVEL), rect.right, rect.bottom, levelPaint); 

     bitmapShader = new BitmapShader(bitmap, Shader.TileMode.REPEAT, Shader.TileMode.CLAMP); 
     viewPaint.setShader(bitmapShader); 
    } 
} 

主なアイデアは、シェーダを使用しています。 そして私は考えを得るhttps://github.com/gelitenight/WaveView

1

あなたはウルPorterDuffモードを変更する必要があります。enter image description here

+0

からアイデアを得るこんにちは、@GiaLe、私はこのビューを実装しました。ご確認ください。 – Strong

+0

ライブラリを使用する場合、非常に使いやすいです。しかし、urselfで何かできるのであれば、それは良いことです。 – GiaLe

関連する問題