android 我可以像使用9补丁一样使用矢量图吗?

uplii1fm  于 2023-05-15  发布在  Android
关注(0)|答案(3)|浏览(135)

我已经玩了很多9补丁,他们是一个巨大的救济,当涉及到一个按钮,一个形式,等漂亮的背景。
由于矢量可绘制对象现在可以在大范围的Android版本的支持库中使用,我期待着像使用9补丁图像一样使用矢量可绘制对象。可悲的是,我没有遇到任何可能性设置内容填充和补丁...
有没有人成功地实现了这个9-patch/svg的混合?

iq0todco

iq0todco1#

这是一个有点尴尬,但它的工作。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" >

    <item
        android:left="@dimen/speech_bubble_corners_plus_tail"
        android:right="@dimen/speech_bubble_corners"
        android:bottom="@dimen/speech_bubble_spacing"
        tools:width="50dp"
        tools:height="50dp">
        <shape android:shape="rectangle">
            <solid android:color="@color/speech_bubble_user"/>
        </shape>
    </item>

    <item
        android:top="@dimen/speech_bubble_corners"
        android:bottom="@dimen/speech_bubble_corners_plus_tail"
        android:left="@dimen/speech_bubble_spacing"
        android:gravity="left"
        android:width="@dimen/speech_bubble_corners">
        <shape android:shape="rectangle">
            <solid android:color="@color/speech_bubble_user"/>
        </shape>
    </item>

    <item
        android:top="@dimen/speech_bubble_corners"
        android:bottom="@dimen/speech_bubble_corners_plus_tail"
        android:gravity="right"
        android:width="@dimen/speech_bubble_corners">
        <shape android:shape="rectangle">
            <solid android:color="@color/speech_bubble_user"/>
        </shape>
    </item>

    <item
        android:width="@dimen/speech_bubble_corners"
        android:height="@dimen/speech_bubble_corners"
        android:bottom="@dimen/speech_bubble_spacing"
        android:gravity="bottom|right">
        <vector xmlns:android="http://schemas.android.com/apk/res/android"
            android:width="@dimen/speech_bubble_corners"
            android:height="@dimen/speech_bubble_corners"
            android:viewportWidth="10.0"
            android:viewportHeight="10.0">
            <path
                android:pathData="M0,10 A10,10 0 0,0 10,0 L0,0 Z"
                android:fillColor="@color/speech_bubble_user"/>
        </vector>
    </item>

    <item
        android:width="@dimen/speech_bubble_corners"
        android:height="@dimen/speech_bubble_corners"
        android:gravity="top|right">
        <vector xmlns:android="http://schemas.android.com/apk/res/android"
            android:width="@dimen/speech_bubble_corners"
            android:height="@dimen/speech_bubble_corners"
            android:viewportWidth="10.0"
            android:viewportHeight="10.0">
            <path
                android:pathData="M10,10 A10,10 0 0,0 0,0 L0,10 Z"
                android:fillColor="@color/speech_bubble_user"/>
        </vector>
    </item>

    <item
        android:width="@dimen/speech_bubble_corners"
        android:height="@dimen/speech_bubble_corners"
        android:left="@dimen/speech_bubble_spacing"
        android:gravity="top|left">
        <vector xmlns:android="http://schemas.android.com/apk/res/android"
            android:width="@dimen/speech_bubble_corners"
            android:height="@dimen/speech_bubble_corners"
            android:viewportWidth="10.0"
            android:viewportHeight="10.0">
            <path
                android:pathData="M10,0 A10,10 0 0,0 0,10 L10,10 Z"
                android:fillColor="@color/speech_bubble_user"/>
        </vector>
    </item>

    <item
        android:width="@dimen/speech_bubble_corners_plus_tail"
        android:height="@dimen/speech_bubble_corners_plus_tail"
        android:gravity="bottom|left">
        <vector xmlns:android="http://schemas.android.com/apk/res/android"
            android:width="@dimen/speech_bubble_corners_plus_tail"
            android:height="@dimen/speech_bubble_corners_plus_tail"
            android:viewportWidth="150.0"
            android:viewportHeight="150.0">
            <path
                android:pathData="M150,100 L150,0 L50,0 C50,11.9054549 52.5180742,22.2130322 55.2200144,32.2289993 C59.25,47.1679688 65.7054859,60.8615415 68.15625,65.5820312 C55.2200144,107.207031 41.7460938,127.800781 0,151 C61.5311854,147.539062 101.691406,129.675781 124.615295,97.6602593 C132.823321,99.8389881 141.106342,100 150,100 Z"
                android:fillColor="@color/speech_bubble_user"/>
        </vector>
    </item>

</layer-list>

我在dimens.xml中使用了以下代码:

<dimen name="speech_bubble_corners">10dp</dimen>
<dimen name="speech_bubble_corners_plus_tail">15dp</dimen>
<dimen name="speech_bubble_spacing">5dp</dimen>

下面是一个例子,它看起来像什么:

如果这条路径可以采用可变的九个补丁部分,那就更好了。理论上应该不难。每个部分都可以有像+x+y这样的选项添加到pathData中。我想也许可以用代码来计算,并根据需要编程创建适当的向量。

xriantvc

xriantvc2#

你不能在一个特定的区域中对一个可绘制的矢量应用一个9面片的行为。9-patch是为bitmap设计的,位图只是存储在int [x][y]中的像素网格。对于一个可调整大小的位图,9 patch行为表示“嘿,第12列(9 patch的一列)可以并行复制n次”,然后,图像被拉伸并且不再成比例
而矢量可绘制对象 * 仅 * 是静态绘制路径定义。结果将始终被重新缩放,并与其原始路径成比例,因为路径不会动态更改。

b4qexyjb

b4qexyjb3#

还有一个更简单的layer-list drawable,它只有两个元素,它产生的输出与the answer中的输出相同:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:bottom="@dimen/bubble_bottom_shift"
        android:left="@dimen/bubble_left_shift"
        android:gravity="fill">
        <shape android:shape="rectangle">
            <solid android:color="#fff" />
            <corners android:radius="12dp" />
        </shape>
    </item>

    <item
        android:width="@dimen/tail_width"
        android:height="@dimen/tail_height"
        android:gravity="bottom|left">
        <vector
            android:width="@dimen/tail_width"
            android:height="@dimen/tail_height"
            android:viewportWidth="16.0"
            android:viewportHeight="16.0">
            <path
                android:fillColor="#fff"
                android:pathData="YOUR TAIL PATH DATA HERE" />
        </vector>
    </item>

</layer-list>

相关问题