How to use VectorDrawableCompat from the AppCompat library?

Question

I initially wrote this SSCCE with a minsdkversion of 21 (Lollipop), and it worked fine. But my need is to use a VectorDrawableCompat in pre-lollipop. In the SSCCE, there is an ImageView in the XML layout, in which the source of the image is a vector graphic defined in res/drawable/ directory.

Initially, when minsdkversion was set to 21 in manifest, I used android:src="@drawable/vector_circle" to set the vector graphic as the source of the image in ImageView. This worked fine.

Then I changed minsdkversion in manifest file to 11. I also changed ImageView's android:src="@drawable/vector_circle" attribute to app:srcCompat="@drawable/vector_circle" in XML layout. But I am getting

Unexpected namespace prefix "app" found for tag ImageView

on app:srcCompat="@drawable/vector_circle" line. How should I fix this?

SSCCE:

res/drawable/vector_circle.xml:

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android" 
     android:width="465dp"
     android:height="420dp"
     android:viewportHeight="600"
     android:viewportWidth="600" >

    <group>

        <path android:strokeColor="#2196F3"
            android:strokeWidth="2"
            android:pathData="M150,10 L75,200 L225,200 Z" />

    </group>

</vector>

activity_main:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center" >

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:srcCompat="@drawable/vector_circle" /><!-- app:srcCompat="@drawable/vector_circle" -->

</FrameLayout>

MainActivity.java:

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

EDIT:

I changed res/layout/activity_main.xml's ImageView element to

<ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:srcCompat="@drawable/vector_circle"
        tools:ignore="MissingPrefix" />

I also added layout-v21/activity_main.xml to the res/ directory:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center" >

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/vector_circle" /><!-- app:srcCompat="@drawable/vector_circle" -->

</FrameLayout>

and added the xmlns:tools="http://schemas.android.com/tools" to FrameLayout element.

The pre-compilation error went away. But when I run the app on Lollipop device, the vector graphic is drawn perfectly fine, but if I run the app on a pre-lollipop device, the application does not fail, but the vector graphic is not drawn at all.

Did you see [this question](http://stackoverflow.com/questions/35645148/cant-use-srccompat-for-imageviews-in-android)? It might help, check it out and write the result :) — Vucko, Jul 16 '16 at 10:14
@Vucko Yes, as you can see, I have used `app:srcCompat`, and not `android:srcCompat`. I have included the `xmlns:app` namespace as well. The only thing which is different is that in their question, they have mentioned that they ave done something with `build.gradle` file. I am using Eclipse, so I didn't do anything of the sort, I just included the AppCompat-v7 library in my project. — Solace, Jul 16 '16 at 10:19
@Vucko Besides, this is not a lint error. It is proper error (with with Eclipse shows red colored undlerline and cross) which makes the project Fail to compile — Solace, Jul 16 '16 at 10:20
Yeah, I noticed that you did almost everything like you should, that's why I cannot help you locate the issue further :D — Vucko, Jul 16 '16 at 10:21
@Vucko Well there is some progress. I posted an edit in the question. — Solace, Jul 16 '16 at 11:22
Yes, I can see. Well, I am sincerely sorry that I am of not much use, but when I use vectors, I usually import them via **new->vector asset** and import from a local SVG. — Vucko, Jul 16 '16 at 12:33
@Vucko "when I use vectors, I usually import them via new->vector asset and import from a local SVG" I am not getting you. Can you point me to some tutorial which explains this process/method you use? — Solace, Jul 16 '16 at 12:50
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/117482/discussion-between-vucko-and-solace). — Vucko, Jul 16 '16 at 12:53
Try to set: compileSdkVersion 23, buildToolsVersion '23.0.3' and don't forget about " vectorDrawables.useSupportLibrary = true ". — Alexey, Jul 26 '16 at 12:48

score 2 · Answer 1 · answered Dec 20 '16 at 14:34

2

All you have to do to fix this is use the widget that can handle app:srcCompat and that is AppCompatImageView instead of ImageView.

answered Dec 20 '16 at 14:34

Alex Newman

1,369
12
34

How to use VectorDrawableCompat from the AppCompat library?

1 Answers1