Is the image designed manually?

Question

The ic_switch.xml is from https://github.com/android/camera-samples/blob/master/CameraXBasic/app/src/main/res/drawable/ic_switch.xml in the project CameraX at Github.

You can see the rendering with Image A.

The ic_switch.xml is very complex, is it designed manually?

ic_switch.xml

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:tint="@color/selector_ic"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="46.0"
    android:viewportHeight="46.0">
    <path android:fillAlpha="0" android:fillColor="#D8D8D8"
        android:fillType="evenOdd" android:pathData="M-4,-4h54v54h-54z"
        android:strokeColor="#00000000" android:strokeWidth="1"/>
    <path android:fillColor="#00000000" android:fillType="evenOdd"
        android:pathData="M23,23m-6.6,0a6.6,6.6 0,1 1,13.2 0a6.6,6.6 0,1 1,-13.2 0"
        android:strokeColor="#FFFFFF" android:strokeWidth="2.8"/>
    <path android:fillColor="#FEFEFE" android:fillType="evenOdd"
        android:pathData="M42.923,34.5C38.9462,41.3747 31.5132,46 23,46C10.2975,46 0,35.7025 0,23L2.8,23C2.8,34.1562 11.8438,43.2 23,43.2C29.8831,43.2 35.9621,39.7574 39.6091,34.5L42.923,34.5ZM46,23L43.2,23C43.2,11.8438 34.1562,2.8 23,2.8C16.1169,2.8 10.0379,6.2426 6.3909,11.5L3.077,11.5C7.0538,4.6253 14.4868,0 23,0C35.7025,0 46,10.2975 46,23Z"
        android:strokeColor="#00000000" android:strokeWidth="1"/>
    <path android:fillColor="#FEFEFE" android:fillType="evenOdd"
        android:pathData="M3,9.2h10v2.8h-10z"
        android:strokeColor="#00000000" android:strokeWidth="1"/>
    <path android:fillColor="#FEFEFE" android:fillType="evenOdd"
        android:pathData="M33,34h10v2.8h-10z"
        android:strokeColor="#00000000" android:strokeWidth="1"/>
    <path android:fillColor="#FEFEFE" android:fillType="evenOdd"
        android:pathData="M5.8,2l-0,10l-2.8,0l-0,-10z"
        android:strokeColor="#00000000" android:strokeWidth="1"/>
    <path android:fillColor="#FEFEFE" android:fillType="evenOdd"
        android:pathData="M43,34l-0,10l-2.8,0l-0,-10z"
        android:strokeColor="#00000000" android:strokeWidth="1"/>
</vector>

Image A

Related: [how to create android:pathData?](https://stackoverflow.com/q/36677768/295004) — Morrison Chang, Oct 02 '19 at 02:06

score 1 · Accepted Answer · answered Oct 03 '19 at 05:39

1

The complex graphical assets are created using graphical tools and then added in the project as a Vector Asset using Asset Studio offered by Android Studio itself from the exported .SVG (or of other formats) file/s. You can read more at how to configure Vector Asset using Android Asset Studio in the official Android Developer documenation.

answered Oct 03 '19 at 05:39

SaadAAkash

3,065
3
19
25

Thanks! What is the advantage of using Vector Asset instead of normal picture ? – HelloCW Oct 03 '19 at 10:39
@HelloCW Quoting the official documentation from Android Developers, "The major advantage of using a vector drawable is image scalability. It can be scaled without loss of display quality, which means the same file is resized for different screen densities without loss of image quality. This results in smaller APK files and less developer maintenance. You can also use vector images for animation by using multiple XML files instead of multiple images for each display resolution..." – SaadAAkash Oct 03 '19 at 14:38
Please go to the following link and explore why Vector Drawables are always preferred that using images in the app apk: https://developer.android.com/guide/topics/graphics/vector-drawable-resources – SaadAAkash Oct 03 '19 at 14:39
If my answer helped & resolved your queries anyhow, please consider accepting my answer. I'd appreciate it. Thanks. – SaadAAkash Oct 03 '19 at 14:42

Is the image designed manually?

1 Answers1