Android中的矢量图形

问题描述 投票:33回答:6

我正在开发一个显示其他人的图像数据库的应用程序。他们拥有的图像都是矢量图形,可以转换为任何格式,但是将它们保持为矢量格式是很好的,因为用户可能想要密切放大。

问题是,是否有一种在Android中显示矢量图形的内置方法?格式无关紧要 - 我们可以转换。我们正在考虑的当前格式是PDF,但鉴于没有本机PDF支持,我必须做一些非常复杂的事情才能使其正常工作(例如,通过NDK将poppler集成到我的应用程序中)。另一种方法是将矢量图形转换为更简单的格式(JPG,GIF),但我宁愿避免这种情况。

android vector-graphics
6个回答
21
投票

查看svg-android - 它是一个相对较新的库,它只支持SVG Basic,但它是用于绘制Androidify的库。主页上有关于如何从SVG获取Drawable的示例,它们正是您正在寻找的。


7
投票

Creating Vector Drawables.


我知道这个问题很老,但我遇到了同样的要求,我很高兴得知Android 5.0现在支持矢量绘图。您可以使用<vector>标记和路径数据来创建矢量绘图,它就像API-21上的魅力一样。这是一个产生心脏形状的矢量图像的例子。

<!-- res/drawable/heart.xml -->
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:height="256dp"
    android:width="256dp"
    android:viewportWidth="32"
    android:viewportHeight="32">

    <!-- draw a path -->
    <path android:fillColor="#8fff"
        android:pathData="M20.5,9.5
                    c-1.955,0,-3.83,1.268,-4.5,3
                    c-0.67,-1.732,-2.547,-3,-4.5,-3
                    C8.957,9.5,7,11.432,7,14
                    c0,3.53,3.793,6.257,9,11.5
                    c5.207,-5.242,9,-7.97,9,-11.5
                    C25,11.432,23.043,9.5,20.5,9.5z" />
</vector>

到目前为止我遇到的唯一问题是,它不包含在支持库中,因此您无法在较低的API中使用它们。美妙的是,你现在甚至可以为矢量绘图制作动画。这是一个例子。

<!-- res/drawable/vectordrawable.xml -->
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:height="64dp"
    android:width="64dp"
    android:viewportHeight="600"
    android:viewportWidth="600">
    <group
        android:name="rotationGroup"
        android:pivotX="300.0"
        android:pivotY="300.0"
        android:rotation="45.0" >
        <path
            android:name="v"
            android:fillColor="#000000"
            android:pathData="M300,70 l 0,-70 70,70 0,0 -70,70z" />
    </group>
</vector>

阅读更多关于矢量绘图动画here


4
投票

TinyLive SVG为Android提供SVG查看器。我没有尝试过,所以我不知道它是否有任何好处。

Reading this bug request似乎可以在浏览器中启用SVG - 因此大概也是WebView - 在Gingerbread中。但由于这是未来版本中的一个可能功能,现在可能对您没什么帮助。


3
投票

BetterVectorDrawable一起看看SVG to VectorDrawable Converter lib。

BetterVectorDrawable是Android 4.0+的VectorDrawable实现,在Android 5.0+上具有可配置的后退行为。

SVG to VectorDrawable Converter是将SVG图像批量转换为Android VectorDrawable XML资源文件。在线版本是here

链接指向自述文件,它提供有关如何使用lib和转换器的足够信息。


0
投票

一个无耻的自我插件,但也许你会对ribbon-vg感兴趣?它是基本的,纯Java和快速;依靠尖端技术在渲染过程中减轻CPU的负担。


0
投票

这个问题很老了。但希望我的回答可以帮助未来的游客。

我们将VectorDrawable文件放在drawable文件夹中。 AnimatedVectorDrawable也是一个drawable。因此,我们将这些文件也放在drawable文件夹中。以下是两个例子:

vd_欧米茄。 XML

    <vector 

        xmlns:android="http://schemas.android.com/apk/res/android"
                android:width="1536dp"
                android:height="864dp"
                android:viewportWidth="1536.0"
                android:viewportHeight="864.0">

            <path
                android:name="my_vector"
                android:pathData="M  162   8
                q    -07    00   -41    26
                q    -34    27   -50    64
                q    -25    59   -19   117
                q     07    70    53   121
                q     57    63   151    62
                q     87   -01   140   -66
                q     46   -55    48  -142
                q     01   -56   -34  -105
                q    -38   -52   -77   -70
                l    -29   -11
                q     16   -01    31   -02
                q     59   -01   119   -02 "

                android:strokeLineCap="round"
                android:strokeColor="#f00f"
                android:fillColor="#00000000"
                android:strokeWidth="32"
                android:trimPathEnd="0"/>



        </vector>

avd_omega_animator.xml

<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt"
android:drawable="@drawable/vd_number8">

    <target
        android:name="my_vector"
        android:animation="@animator/trimpath_animator"/>       



</animated-vector>

然后,您可以使用如下的动画文件进行动画处理:

trimpath_animator.xml

<set xmlns:android="http://schemas.android.com/apk/res/android">

<objectAnimator
android:propertyName="trimPathEnd"
android:duration="1000"
android:valueFrom="0"
android:valueTo="1"
android:repeatCount="0"
android:repeatMode="reverse"/>
</set>

您可以在同一文件中为各种属性配备更多动画师。

在您的布局文件中

activity_main.xml中

<RelativeLayout
    xmlna:android="http://schemasandroid.com/apk/res/android"
    xmlna:app="http://schemasandroid.com/apk/res-auto"
    xmls:tools="http:schemas.android.com/tools"
    android:id="@+some_id"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    tools:context=".MainActivity">

    <ImageView
    android:id="@+id/my_image"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:src="@drawable/avd_omega_animator"/>

</RelativeLayout>

在您的活动中,在onCreate中编写以下代码:

import ... import ...

public class MyActivity extends Activity{

ImageView myImage;


...
...
setContentView(R.layout.activity_main);
myImage = (ImageView)findViewById(R.id.my_image);
Drawable d = myImage.getDrawable():
if(d instance of Animatable){
d.start;
}

并看到乐趣。

就像我上面使用getDrawable一样,你也可以使用其他方法在drawView中放置drawables,如setImageDrawable(“d”)等。

您还可以参考Alex Lockwood先生的“图标动画技术简介”:

https://www.androiddesignpatterns.com/2016/11/introduction-to-icon-animation-techniques.html

举个很好的例子。

希望我给你有用的答案。

我上面给出的所有示例代码都有效。它也简单而直接。

© www.soinside.com 2019 - 2024. All rights reserved.