How to create Hexagon shape in .xml format

Question

I want to create Hexagon shape for my project so I want to create that shape in .xml format so how can i create.

Answer 1

The best solution for you would be use VectorDrawable:

Hexagon shape as vector drawable:

<vector android:height="24dp" android:viewportHeight="628.0"
android:viewportWidth="726.0" android:width="27dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#00ffffff"
    android:pathData="m723,314c-60,103.9 -120,207.8 -180,311.8 -120,0 -240,0 -360,0C123,521.8 63,417.9 3,314 63,210.1 123,106.2 183,2.2c120,0 240,0 360,0C603,106.2 663,210.1 723,314Z"
    android:strokeColor="#000000" android:strokeWidth="4"/>
</vector>

Update(28:07.2016):

To support API below Lollipop use support library http://android-developers.blogspot.com/2016/02/android-support-library-232.html remember to use VectorDrawableCompat instead VectorDrawable

Answer 2

if you want output like this if you want full hexagon

<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="512dp"
android:height="512dp"
android:viewportWidth="512"
android:viewportHeight="512">

<path
    android:fillColor="#000000"
    android:pathData="m485.291,129.408 l-224,-128c-3.285,-1.877 -7.296,-1.877 
-10.581,0l-224,128c-3.328,1.899 -5.376,5.44 -5.376,9.259v234.667c0,3.819 2.048,7.36 
5.376,9.259l224,128c1.643,0.939 3.456,1.408 5.291,1.408s3.648,-0.469 
5.291,-1.408l224,-128c3.328,-1.899 5.376,-5.44 5.376,-9.259v-234.667c-0.001,-3.819 
-2.049,-7.36 -5.377,-9.259z" />

</vector>

Answer 3

While most solutions would involve including the ShapeImageView (which is a great library, btw), you can always write your own logic to create a custom hexagon shaped layout.

All you need to do is define the properties of the Path object and then use that in the onDraw() method of the layout using the Canvas.

This is how you would create the hexagon path.

  float midx = getWidth() / 2;
  float midy = getHeight() / 2;

  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;

Now, in your custom hexagon layout, use this path in onDraw().

@Override
 protected void onDraw(Canvas canvas) {
      Path clipPath = new Path();
      clipPath.addPath(p); //p is the path you created above
      canvas.clipPath(clipPath);
      canvas.drawColor(Color.RED); //optional

      super.onDraw(canvas)
}

Once you have your custom layout ready, you can set the background of the layout to any drawable you want (just as you would do for any other layouts).

Answer 4

You can use VectorDrawable (VectorDrawableCompat for old version) https://developer.android.com/studio/write/vector-asset-studio.html. You can easialy import shape from .svg files.