如何顯示六角形邊框

Question

嗨，我需要繪製六邊形邊框。我試着使用下面的代碼，但我面臨的問題是顏色填滿了Hexagon。我只需要給Hexagon的邊框添加顏色。誰能幫幫我嗎？

public class HexagonLayout extends RelativeLayout { 

    public HexagonLayout(Context context) { 
     super(context); 
    } 

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

    @SuppressLint("NewApi") 
    public HexagonLayout(Context context, AttributeSet attrs, int defStyle) { 
     super(context, attrs, defStyle); 

    } 

    @Override 
    protected void onDraw(Canvas canvas) { 

     Path clipPath = new Path(); 
     clipPath.addPath(Hexagon()); 
     //canvas.clipPath(clipPath); 

     Paint mPaint=new Paint(); 
     mPaint.setColor(Color.BLUE); 

     mPaint.setAntiAlias(true); 
     canvas.drawPath(Hexagon(), mPaint); 
     super.onDraw(canvas); 

    } 

    private Path Hexagon() { 

     float midx = 100; 
     float midy = 200; 

     Path p = new Path(); 

     p.moveTo(midx, midy); 
     p.lineTo(midx+150, midy + 220); 
     p.lineTo(midx, midy + 220); 
     p.lineTo(midx-150, midy + 220); 
     p.lineTo(midx-300, midy); 
     p.lineTo(midx-150, midy-220); 
     p.lineTo(midx+150, midy-220); 
     p.lineTo(midx+300, midy); 
     p.lineTo(midx+150, midy + 220); 
     return p; 

    } 
} 

Answer 1

試試這個代碼

import android.content.Context; 
import android.graphics.Canvas; 
import android.graphics.Color; 
import android.graphics.Path; 
import android.graphics.Region; 
import android.util.AttributeSet; 
import android.view.View; 

public class HexagonMaskView extends View { 
    private Path hexagonPath; 
    private Path hexagonBorderPath; 
    private float radius; 
    private float width, height; 
    private int maskColor; 

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

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

public HexagonMaskView(Context context, AttributeSet attrs, int defStyleAttr) { 
    super(context, attrs, defStyleAttr); 
    init(); 
} 

private void init() { 
    hexagonPath = new Path(); 
    hexagonBorderPath = new Path(); 
    maskColor = 0xFF01FF77; 
} 

public void setRadius(float r) { 
    this.radius = r; 
    calculatePath(); 
} 

public void setMaskColor(int color) { 
    this.maskColor = color; 
    invalidate(); 
} 

private void calculatePath() { 
    float triangleHeight = (float) (Math.sqrt(3) * radius/2); 
    float centerX = width/2; 
    float centerY = height/2; 
    hexagonPath.moveTo(centerX, centerY + radius); 
    hexagonPath.lineTo(centerX - triangleHeight, centerY + radius/2); 
    hexagonPath.lineTo(centerX - triangleHeight, centerY - radius/2); 
    hexagonPath.lineTo(centerX, centerY - radius); 
    hexagonPath.lineTo(centerX + triangleHeight, centerY - radius/2); 
    hexagonPath.lineTo(centerX + triangleHeight, centerY + radius/2); 
    hexagonPath.moveTo(centerX, centerY + radius); 

    float radiusBorder = radius - 5;  
    float triangleBorderHeight = (float) (Math.sqrt(3) * radiusBorder/2); 
    hexagonBorderPath.moveTo(centerX, centerY + radiusBorder); 
    hexagonBorderPath.lineTo(centerX - triangleBorderHeight, centerY + radiusBorder/2); 
    hexagonBorderPath.lineTo(centerX - triangleBorderHeight, centerY - radiusBorder/2); 
    hexagonBorderPath.lineTo(centerX, centerY - radiusBorder); 
    hexagonBorderPath.lineTo(centerX + triangleBorderHeight, centerY - radiusBorder/2); 
    hexagonBorderPath.lineTo(centerX + triangleBorderHeight, centerY + radiusBorder/2); 
    hexagonBorderPath.moveTo(centerX, centerY + radiusBorder); 
    invalidate(); 
} 

@Override 
public void onDraw(Canvas c){ 
    super.onDraw(c); 
    c.clipPath(hexagonBorderPath, Region.Op.DIFFERENCE); 
    c.drawColor(Color.WHITE); 
    c.save(); 
    c.clipPath(hexagonPath, Region.Op.DIFFERENCE); 
    c.drawColor(maskColor); 
    c.save(); 
} 

// getting the view size and default radius 
@Override 
public void onMeasure(int widthMeasureSpec, int heightMeasureSpec){ 
    super.onMeasure(widthMeasureSpec, heightMeasureSpec); 
    width = MeasureSpec.getSize(widthMeasureSpec); 
    height = MeasureSpec.getSize(heightMeasureSpec); 
    radius = height/2 - 10; 
    calculatePath(); 
} 
}