I'm trying to make customizable icons in Android. I made the vector element, but now I want to give it a rounded background, so I tried to place it within a rounded shape. Like this:
<?xml version="1.0" encoding="utf-8"?> <!-- drawable/circle_card_icon.xml --> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <vector xmlns:android="http://schemas.android.com/apk/res/android" android:height="24dp" android:width="24dp" android:viewportWidth="24" android:viewportHeight="24"> <path android:fillColor="#000" android:pathData="M20,2H4A2,2 0 0,0 2,4V22L6,18H20A2,2 0 0,0 22,16V4A2,2 0 0,0 20,2M6,9H18V11H6M14,14H6V12H14M18,8H6V6H18" /> </vector> </shape>
Yet this doesn't work, and I'm trying to achieve the following:
By using only the vector I don't get the background.
(I used this website to generate the vector)
Focus on the Group tag, pivotX and pivotY will position the image, if viewportHeight and viewportWidth is 24 that means pivotX and pivotY 12 will place it in center because 24/2 is 12 :) Another important tag, scaleX and scaleY will scale the size of your image.
Android Studio includes a tool called Vector Asset Studio that helps you add material icons and import Scalable Vector Graphic (SVG) and Adobe Photoshop Document (PSD) files into your project as vector drawable resources.
PathData in vector images android is Vector graphic program's script. It is not exactly clean and human readable code as a high priority.
A drawable resource is a general concept for a graphic that can be drawn to the screen and which you can retrieve with APIs such as getDrawable(int) or apply to another XML resource with attributes such as android:drawable and android:icon . There are several different types of drawables: Bitmap File.
Rather than putting a vector into a shape, I'd use a LayerList Drawable
Something like so:
<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <!-- drawable/circle_card_icon.xml --> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <solid android:color="#8df"/> <size android:width="48dp" android:height="48dp" /> </shape> </item> <item android:drawable="@drawable/your_vector_drawable" /> </layer-list>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With