Vectors in Android resized dynamically

Question

I'm using SVG imported images in android, but I can't resize it using a ImageView, the image is like this.

The imported drawable is:

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="208dp"
android:height="208dp"
android:viewportHeight="24.0"
android:viewportWidth="24.0">
<path
    android:fillColor="#8A1D3043"
    android:pathData="...lines and curves..."/>
</vector>

When I change the ImageView (where it is attached to) layout_height and layout_width, I get this:

        <ImageView
        android:layout_height="100dp"
        android:layout_width="100dp"
        app:layout_width="@{smallScreen ? @dimen/img_small_screen_size : @dimen/img_big_screen_size}"
        app:layout_height="@{smallScreen ? @dimen/img_small_screen_size : @dimen/img_big_screen_size}"
        android:layout_gravity="center_horizontal"
        android:contentDescription="@{message}"
        android:src="@{image}"
        android:scaleType="center"
        tools:src="@drawable/img_message_private"/>

Notice that the height and width of the vector are both 208dp, but my ImageView must be used as 100dp. The View must be resized dynamically, using dataBind so having multiple vectors are not an option, I think.

Apparently the image does not scale with its ImageView. Does someone know why and how to easily get around it?

score 9 · Answer 1 · answered Jan 19 '16 at 11:33

9

The problem is with the line:

android:scaleType="center"

Here's a link to the documentation where you can see the definition of this:

Center the image in the view, but perform no scaling.

Try instead using another scaleType like:

android:scaleType="fitCenter"

answered Jan 19 '16 at 11:33

Lewis McGeary

7,692
2
40
46

Simple as that! Thank you! – Felipe Jun Jan 19 '16 at 11:42

score 0 · Answer 2 · answered Apr 01 '19 at 09:19

I had the same problem.

If you have the original SVG. Open the same in Inkspace (or any other vector editor).

Now go to File -> Document properties and expand "Resize page to content..." and then click on "Resize page to drawing or selection".

Now close the window and save the SVG.

Import it into android using Vector tool and use any width and height. It will take the width and height of the image view. Also, Do not forget to change the scale type to FitXY.

Vectors in Android resized dynamically

2 Answers2