简述
矢量图的主要优点是可以无损的拉伸和缩放,而且本身的是一个xml文件,这样可以避免开发时再使用多套图片,减少APK大小,尤其在一些动画效果上节省体积更明显。另外可以通过fillColor或者android:tint动态改变图片颜色,方便开发。
默认适配
但是Android5.0(API21)以上才正式支持矢量图,5.0以下的手机需要通过AnimatedVectorDrawable和VectorDrawable适配,不然系统默认会为矢量图生成每一套分辨率下的图片(/build/generated/res/pngs),原来的矢量图放到了drawable-anyapi-v21目录下。可以看到自动生成的图片质量很差,这样就失去了使用矢量图的意义。
兼容方式
想要使用兼容模式,需要在gradle中添加如下配置
//For Gradle Plugin 2.0+
android {
defaultConfig {
vectorDrawables.useSupportLibrary = true
}
}
//For Gradle Plugin 1.5 or below
android {
defaultConfig {
// Stops the Gradle plugin’s automatic rasterization of vectors
generatedDensities = []
}
// Flag notifies aapt to keep the attribute IDs around
aaptOptions {
additionalParameters "--no-version-vectors"
}
}
加上上述配置后重新clean编译,generated就不再自动生成相应的png文件了,引用vector的地方使用
//使用android:src="@drawable/ic_add",低版本手机会crash。
app:srcCompat="@drawable/ic_add"
这时候如果手机API小于24,而Vector中使用<gradient>标签APP会crash,只能避免在低版本中使用该标签,只将其添加在drawable-v24包下.
特殊标签
这里有几个xml中的标签和属性与Android版本有关。
首先介绍一下"vectorDrawables.useSupportLibrary = true",这个 是矢量图的兼容库,使用该库项目编译时不会自动生成任何png,如果加了该库并且xml中有低版本不支持的属性或者标签,实际测试下来在低版本手机上有的xml会有以下两种问题:(1)使用app:srcCompat引用图片可能显示不正常。(2)使用drawableTop等属性引用该xml应用直接crash。
以下介绍的需要兼容的标签或者属性都要分使用"vectorDrawables.useSupportLibrary = true"和不使用两种情况去分析。
- <android:fillColor="@color/xxx"> 这里引用资源需要API 21支持,直接使用#123456这种则可以。(1)引用兼容库可以解决该属性的兼容问题 (2)不引用兼容库,如果minAPI小于21并且引用资源就不能生成png图片,编译会失败。
- <gradient>标签只能用于API 24及以上。 (1)引用兼容库,编译时不会有问题,但是在低版本上运行时如果没用兼容方法引用会直接crash,比如drawableTop引用。(2)不引用兼容库,该标签可以正常生成png图片,xml只用在drawable-anydpi-v24中。
Caused by: org.xmlpull.v1.XmlPullParserException: Binary XML file line #12: invalid drawable tag gradient
- <android:fillType="">只支持API 24以上。这个属性在绝大部分情况下都可以安全删除,不会影响图片显示,但个别图片也会被改变显示。(1) 引用兼容库时编译运行正常,但实测在低版本上该属性会被忽略。(2)不引用兼容库编译生成png时会失败,需要删除。
兼容原理
使用app:srcCompat或者动态使用setImageResource()可以让低版本使用矢量图,我们可以在v7包中的values.xml中找到srcCompat的定义
<declare-styleable name="AppCompatImageView">
....
<!-- Sets a drawable as the content of this ImageView. Allows the use of vector drawable
when running on older versions of the platform. -->
<attr format="reference" name="srcCompat"/>
....
</declare-styleable>
之后我们在AppCompatImageView控件中可以看到使用app:srcCompat或者setImageResource()最终都会在AppCompatImageHelper中调到如下方法
Drawable d = AppCompatResources.getDrawable(mView.getContext(), resId);
最终完成低版本使用矢量图在VectorDrawableCompat完成,如果API < 24就使用XmlPullParser解析节点构建drawable,否则直接通过ResourcesCompat获取。
synchronized Drawable getDrawable(@NonNull Context context, @DrawableRes int resId, boolean failIfNotKnown) {
//会加载一个测试用的vector,如果加载失败则throw一个未初始化矢量图的exception
checkVectorDrawableSetup(context);
//通过委托模式加载图片
Drawable drawable = this.loadDrawableFromDelegates(context, resId);
.....
return drawable;
}
//loadDrawableFromDelegates方法中使用XmlPullParser获得AttributeSet
AppCompatDrawableManager.InflateDelegate delegate = (AppCompatDrawableManager.InflateDelegate)this.mDelegates.get(tagName);
if (delegate != null) {
//在VectorDrawableCompat的inflate中中通过解析各个节点,绘制drawable
dr = delegate.createFromXmlInner(context, parser, attrs, context.getTheme());
}
private void inflateInternal(Resources res, XmlPullParser parser, AttributeSet attrs, Theme theme) throws XmlPullParserException, IOException {
VectorDrawableCompat.VectorDrawableCompatState state = this.mVectorState;
VectorDrawableCompat.VPathRenderer pathRenderer = state.mVPathRenderer;
boolean noPathTag = true;
ArrayDeque<VectorDrawableCompat.VGroup> groupStack = new ArrayDeque();
groupStack.push(pathRenderer.mRootGroup);
int eventType = parser.getEventType();
for(int innerDepth = parser.getDepth() + 1; eventType != 1 && (parser.getDepth() >= innerDepth || eventType != 3); eventType = parser.next()) {
String tagName;
if (eventType == 2) {
tagName = parser.getName();
VectorDrawableCompat.VGroup currentGroup = (VectorDrawableCompat.VGroup)groupStack.peek();
if ("path".equals(tagName)) {
VectorDrawableCompat.VFullPath path = new VectorDrawableCompat.VFullPath();
path.inflate(res, attrs, theme, parser);
currentGroup.mChildren.add(path);
if (path.getPathName() != null) {
pathRenderer.mVGTargetsMap.put(path.getPathName(), path);
}
noPathTag = false;
state.mChangingConfigurations |= path.mChangingConfigurations;
} else if ("clip-path".equals(tagName)) {
VectorDrawableCompat.VClipPath path = new VectorDrawableCompat.VClipPath();
path.inflate(res, attrs, theme, parser);
currentGroup.mChildren.add(path);
if (path.getPathName() != null) {
pathRenderer.mVGTargetsMap.put(path.getPathName(), path);
}
state.mChangingConfigurations |= path.mChangingConfigurations;
} else if ("group".equals(tagName)) {
VectorDrawableCompat.VGroup newChildGroup = new VectorDrawableCompat.VGroup();
newChildGroup.inflate(res, attrs, theme, parser);
currentGroup.mChildren.add(newChildGroup);
groupStack.push(newChildGroup);
if (newChildGroup.getGroupName() != null) {
pathRenderer.mVGTargetsMap.put(newChildGroup.getGroupName(), newChildGroup);
}
state.mChangingConfigurations |= newChildGroup.mChangingConfigurations;
}
} else if (eventType == 3) {
tagName = parser.getName();
if ("group".equals(tagName)) {
groupStack.pop();
}
}
}
if (noPathTag) {
throw new XmlPullParserException("no path defined");
}
}
其它
从上面可以推测如果Activity使用的是AppCompatActivity, ImageView会被替换成AppCompatImageView。
网友评论