How to draw hexagons in android?

前端 未结 2 1721
后悔当初
后悔当初 2021-01-06 18:54

I used the hexagon code in this tutorial and created a createHex class (Should I post the code?). The linked web page has used the following code to actually draw the hexago

相关标签:
2条回答
  • 2021-01-06 19:34

    Try this:

    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();
    }
    }
    
    0 讨论(0)
  • 2021-01-06 19:36

    Try this or download demo example.

    public static Bitmap getHexagonalCroppedBitmap(Bitmap bitmap, int radius) {
            Bitmap finalBitmap;
            if (bitmap.getWidth() != radius || bitmap.getHeight() != radius)
                finalBitmap = Bitmap.createScaledBitmap(bitmap, radius, radius,
                        false);
            else
                finalBitmap = bitmap;
            Bitmap output = Bitmap.createBitmap(finalBitmap.getWidth(),
                    finalBitmap.getHeight(), Bitmap.Config.ARGB_8888);
            Canvas canvas = new Canvas(output);
    
            Paint paint = new Paint();
            final Rect rect = new Rect(0, 0, finalBitmap.getWidth(),
                    finalBitmap.getHeight());
    
            Point point1_draw = new Point(75, 0);
            Point point2_draw = new Point(0, 50);
            Point point3_draw = new Point(0, 100);
            Point point4_draw = new Point(75, 150);
            Point point5_draw = new Point(150, 100);
            Point point6_draw = new Point(150, 50);
    
            Path path = new Path();
            path.moveTo(point1_draw.x, point1_draw.y);
            path.lineTo(point2_draw.x, point2_draw.y);
            path.lineTo(point3_draw.x, point3_draw.y);
            path.lineTo(point4_draw.x, point4_draw.y);
            path.lineTo(point5_draw.x, point5_draw.y);
            path.lineTo(point6_draw.x, point6_draw.y);
    
            path.close();
            canvas.drawARGB(0, 0, 0, 0);
            paint.setColor(Color.parseColor("#BAB399"));
            canvas.drawPath(path, paint);
            paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
            canvas.drawBitmap(finalBitmap, rect, rect, paint);
    
            return output;
        }
    

    pass your image to be cropped to hexagon as bitmap to this function

    Bitmap myhexagon = getHexagonalCroppedBitmap(Myimage, yourHexagonalRadius);
    
    0 讨论(0)
提交回复
热议问题