diff --git a/docs/html/guide/topics/resources/drawable-resource.jd b/docs/html/guide/topics/resources/drawable-resource.jd index 74727fb4bbea8..f974a5fe59923 100644 --- a/docs/html/guide/topics/resources/drawable-resource.jd +++ b/docs/html/guide/topics/resources/drawable-resource.jd @@ -8,6 +8,7 @@ parent.link=available-resources.html
Vector Asset Studio helps you add material icons +and import Scalable Vector Graphic (SVG) files into your app project as a drawable resource. +Compared to raster images, vector drawables can reduce the size of your app and be resized without +loss of image quality. They help you to more easily support different Android devices with varying +screen sizes and resolutions because you can display one vector drawable on all of them.
+ +Vector Asset Studio adds a vector graphic to the project as an XML file that describes the image. +Maintaining one XML file can be easier than updating multiple raster graphics at various resolutions.
+ +Android 4.4 (API level 20) and lower doesn't support vector drawables. If your minimum API level
+is set at one of these API levels, Vector Asset Studio also directs Gradle to generate raster images
+of the vector drawable for backward-compatibility. You can refer to vector assets as
+{@link android.graphics.drawable.Drawable} in Java code or @drawable in XML code; when
+your app runs, the corresponding vector or raster image displays automatically depending on the API
+level.
The Google material design specification provides material icons +that you can use in your Android apps. Vector +Asset Studio helps you choose, import, and size material icons, as well as define opacity and the +Right-to-Left (RTL) mirroring setting.
+ +Vector Asset Studio also helps you to import your own SVG files. SVG is an XML-based open +standard of the World Wide Web Consortium (W3C). Vector Asset Studio supports the essential +standard, but not all features. When you specify an SVG file, Vector Asset Studio gives immediate +feedback about whether the graphics code is supported or not. If the SVG code is supported, it +converts the file into an XML file containing {@link +android.graphics.drawable.VectorDrawable} code.
+ +A vector drawable is appropriate for simple icons. The +material icons provide good +examples of the types +of images that work well as vector drawables in an app. In contrast, many app launch icons do have +many details, so they work better as raster images.
+ +The initial loading of a vector graphic can cost more CPU cycles than the corresponding raster +image. Afterward, memory use and performance are similar between the two. We recommend that you +limit a vector image to a maximum of 200 x 200 dp; otherwise, it can take too long to draw.
+ +Although vector drawables do support one or more colors, in many cases it makes sense to color
+icons black (android:fillColor="#FF000000"). Using this approach, you can add a
+tint to the vector drawable
+that you placed in a layout, and the icon color changes to the tint color. If the icon color
+isn't black, the icon color might instead blend with the tint color.
Android 5.0 (API level 21) and higher provides vector drawable support. If your app has a
+minimum API level that is lower, Vector Asset Studio adds the vector drawable file to your
+project; also, at build time, Gradle creates Portable Network Graphic (PNG) raster images at various
+resolutions. Gradle generates the PNG densities specified by the Domain Specific Language (DSL)
+generatedDensities property
+in a build.gradle file. To generate PNGs, the build system requires Gradle 1.4.0 or higher.
For Android 5.0 (API level 21) and higher, Vector Asset Studio supports all of the {@link +android.graphics.drawable.VectorDrawable} elements. For backward compatibility with Android 4.4 (API +level 20) and lower, Vector Asset Studio supports the following XML elements:
+ +<vector>
android:widthandroid:heightandroid:viewportWidthandroid:viewportHeightandroid:alpha<path>
android:pathDataandroid:fillColorandroid:strokeColorandroid:strokeWidthandroid:strokeAlphaandroid:fillAlphaOnly Android 5.0 (API level 21) and higher supports dynamic attributes, for example, android:fillColor="?android:attr/colorControlNormal".
You can change the XML code that Vector Asset Studio generates, although it’s not a best practice. +Changing the values in the code should not cause any issues, as long as they’re valid and static. If +you want to add XML elements, you need to make sure that they’re supported based on your minimum API +level.
+ +For Android 5.0 (API level 21) and higher, you can use the {@link +android.graphics.drawable.AnimatedVectorDrawable} class to animate the properties of {@link +android.graphics.drawable.VectorDrawable}. For more information, see +Animating Vector Drawables.
+ +Follow these steps to start Vector Asset Studio:
+ +Some other project views and folders have this menu item as well.
+Vector Asset Studio appears.
+Gradle syncs the project.
+Vector Asset Studio appears.
+Vector Asset Studio helps you to import a vector graphics file into your app project. Follow one + of the following procedures:
+ + +After you open Vector Asset Studio, you can add a material icon as follows:
+ +The icon appears in the Vector Drawable Preview.
+The default is 24 x 24 dp, which is defined in the + material design + specification. Deselect the checkbox to return to the default.
+android:supportsRtl="true" to your app manifest. Auto-mirroring is
+ supported on Android 5.0 (API level 21) and higher only.src/main/res, src/debug/res, src/release/res,
+ or a user-defined source set. The main source set applies to all build variants, including
+ debug and release. The debug and release source sets override the main source set and apply
+ to one version of a build. The debug source set is for debugging only. To define a new source
+ set, select File > Project Structure > app >
+ Build Types. For example, you could define a beta source set and create a
+ version of an icon that includes the text "BETA” in the bottom right corner. For more information, see
+ Working with Build Variants.The Output Directories area displays the vector image and the directory + where it will appear.
+Vector Asset Studio adds an XML file defining the vector drawable to the project in the
+ app/src/main/res/drawable/ folder. From the
+ Android view of the Project
+ window, you can view the generated vector XML file in the drawable folder.
If the minimum API level is Android 4.4 (API level 20) and lower, Vector Asset Studio generates
+ PNG files. From the Project view
+ of the Project window, you can view the generated PNG and XML files in the
+ app/build/generated/res/pngs/debug/ folder.
You should not edit these generated raster files, but instead work with the vector XML file. The + build system regenerates the raster files automatically when needed so you don’t need to maintain + them.
+After you open Vector Asset Studio, you can import an SVG file as follows:
+ +The file must be on a local drive. If it’s located on the network, for example, you need to + download it to a local drive first.
+The image appears in the Vector Drawable Preview.
+However, if the SVG file contains unsupported features, an error appears at the bottom left of + Vector Asset Studio, as shown in the following figure.
+
+ In this case, you can’t use Vector Asset Studio to add the graphics file. Click + More to view the errors. For a list of supported elements, see + Vector Drawable Support at Different API Levels.
+The default is 24 x 24 dp, which is defined in the + material design + specification. Deselect the checkbox to return to the default.
+android:supportsRtl="true" to your app manifest. Auto-mirroring is
+ supported on Android 5.0 (API level 21) and higher only.src/main/res, src/debug/res, src/release/res,
+ or a user-defined source set. The main source set applies to all build variants, including
+ debug and release. The debug and release source sets override the main source set and apply
+ to one version of a build. The debug source set is for debugging only. To define a new source
+ set, select File > Project Structure > app >
+ Build Types. For example, you could define a beta source set and create a
+ version of an icon that includes the text "BETA” in the bottom right corner. For more information, see
+ Working with Build Variants.The Output Directories area displays the vector image and the directory + where it will appear.
+Vector Asset Studio adds an XML file defining the vector drawable to the project in the
+ app/src/main/res/drawable/ folder. From the
+ Android view of the Project
+ window, you can view the generated vector XML file in the drawable folder.
If the minimum API level is Android 4.4 (API level 20) and lower, Vector Asset Studio generates
+ PNG files. From the Project view
+ of the Project window, you can view the generated PNG and XML files in the
+ app/build/generated/res/pngs/debug/ folder.
You should not edit these generated raster files, but instead work with the vector XML file. The + build system regenerates the raster files automatically when needed so you don’t need to maintain + them.
+In a layout file, you can set any icon-related widget, such as {@link android.widget.ImageButton}, +{@link android.widget.ImageView}, and so on, to point to a vector asset. For example, the following +layout shows a vector asset displayed on a button:
+ +
+
+Follow these steps to display a vector asset on a widget, as shown in the figure:
+ +content_main.xml.ImageButton instance and click … .The vector asset appears on the ImageButton in the layout.
The color of the image changes to the accent color in the layout.
+The ImageButton code should be similar to the following:
+<ImageButton + android:id="@+id/imageButton" + android:src="@drawable/ic_build_24dp" + android:tint="@color/colorAccent" + android:layout_width="wrap_content" + android:layout_height="wrap_content" + android:layout_below="@+id/textView2" + android:layout_marginTop="168dp" /> ++ +
You can normally refer to a vector drawable resource in a generic way in your code, and when +your app runs, the corresponding vector or raster image displays automatically depending on the API +level:
+ +@drawable in XML code or
+ {@link android.graphics.drawable.Drawable} in Java code. For example, the following layout XML code applies the image to a view:
++<ImageView + android:layout_height="wrap_content" + android:layout_width="wrap_content" + android:src="@drawable/myimage" /> ++
The following Java code retrieves the image as a {@link android.graphics.drawable.Drawable}:
+
+Resources res = {@link android.content.Context#getResources()};
+Drawable drawable = res.{@link android.content.res.Resources#getDrawable(int) getDrawable}(R.drawable.myimage);
+
+
+if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
+ VectorDrawable vectorDrawable = (VectorDrawable) drawable;
+} else {
+ BitmapDrawable bitmapDrawable = (BitmapDrawable) drawable;
+}
+
+
+
+
+You can modify the vector asset XML code, but not the PNGs and corresponding XML code generated +at build time. However, we don't recommended it. Vector Asset Studio makes sure that the vector +drawable and the PNGs match, and that the manifest contains the proper code. If you add code that's +not supported on Android 4.4 (API level 20) and lower, your vector and PNG +images might differ. You also need to make sure that the manifest contains the code to support your +changes.
+ +Follow these steps to modify the vector XML file:
+ +The XML file appears in the editor and Preview windows.
+ +
+
+ For example, if you didn’t select the RTL option in Vector Asset Studio but realize you now
+ need it, you can add the autoMirrored
+ attribute later. To view the RTL version, select Preview Right-to-Left Layout in
+ the
+ menu of the Preview window. (Select None to remove the RTL preview.)
+ Note: If you’re working with an older project, you might need to
+ add android:supportsRtl="true" to your app manifest. Also, because
+ autoMirrored is a dynamic attribute, it's supported on Android 5.0 (API level 21) and
+ higher only.
Remember that the generated PNGs could display differently in the Preview window than + in the app due to different rendering engines and any changes made to the vector drawable before a + build. If you add code to the vector XML file created by Vector Asset Studio, any features + unsupported in Android 4.4 (API level 20) and lower don't appear in the generated PNG files. As a + result, when you add code, you should always check that the generated PNGs match the vector + drawable. To do so, you could double-click the PNG in the + Project view of the Project + window; the left margin of the code editor also displays the PNG image when your code refers to + the drawable.
+
+Follow these steps to remove a vector asset from a project:
+ +The Safe Delete dialog appears.
+Android Studio deletes the file from the project and the drive. However, if you chose to search + for places in the project where the file is used and some usages are found, you can view them and + decide whether to delete the file.
+Any auto-generated PNG and XML files corresponding to the deleted vector + asset are removed from the project and the drive.
+When your minimum API level includes Android 4.4 (API level 20) or lower, you have corresponding + vector and raster images in your project. In this case, you have two options for delivering your + APK files:
+ +