自定义斜切视图的按钮背景

Question

自定义斜切视图的按钮背景

androidandroid-canvasandroid-drawable

13

我想设置背景，如图所示。

我尝试了许多教程，例如：

但是没有得到理想的结果，有人能帮我获得完美的结果吗？

提前致谢。

- MJM

这可能是作为组件背景使用的 .png 图像。 - moictab

你可以通过使用仅包含橙色部分的png轻松实现这一点。 - ADM

@ADM 我不想使用图片，因为它会增加 APK 的大小。我有许多不同尺寸的按钮，所以每个按钮需要更多的图片。此外，还有点击效果。 - MJM

我不确定是否可以使用xml drawable实现，但使用canvas肯定可以。同时，请在您的问题中添加更多细节。箭头是否独立于单击？ - ADM

是的，箭头点击是独立的。 - MJM

我认为你应该看一下9-patch可绘制对象，似乎这是一个很好的使用案例。 - azizbekian

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Ashish Walia · Accepted Answer

更新的答案

请注意，您可能需要调整Button的width和height，以使其适合您的情况。

您可以使用vector和layer-list可绘制对象来完成此操作。

diagonal_shape

    <vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="150dp"
    android:height="80dp"
    android:viewportWidth="52.652084"
    android:viewportHeight="21.166666">
    <path
        android:fillColor="#F48733"
        android:pathData="M31.214,0.036 L2.229,0.027C0.332,0.026 0.104,0.811 0.101,1.862l-0.047,16.618c-0.003,1.466 -0.185,2.731 1.932,2.729L51.342,21.175c1.381,0.096 1.798,-0.748 0.581,-2.647L45.639,9.214 40.544,1.907C39.687,0.67 39.285,0.305 38.061,0.138 36.744,-0.042 34.414,0.081 31.214,0.036Z"
        android:strokeWidth="1.11766827"/>
</vector>

ic_arrow_forward

<vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="24dp"
        android:height="24dp"
        android:viewportWidth="24.0"
        android:viewportHeight="24.0">
    <path
        android:fillColor="#FFFFFF"
        android:pathData="M12,4l-1.41,1.41L16.17,11H4v2h12.17l-5.58,5.59L12,20l8,-8z"/>
</vector>

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

    <item
        android:gravity="end"
        android:left="10dp">
        <shape android:shape="rectangle">
            <solid android:color="#3B5998" />
            <corners android:radius="3dp" />
        </shape>
    </item>
    <item
        android:drawable="@drawable/diagonal_shape"
        android:gravity="start"
        android:right="20dp" />

    <item
        android:drawable="@drawable/ic_arrow_forward"
        android:gravity="end|center_vertical"
        android:right="5dp" />

</layer-list>

现在只需将button_background_layer_list设置为xml中的Button背景，如下所示：

android:background="@drawable/button_background_layer_list"

这看起来像这样。

经过更新代码后，新按钮看起来是这样的，希望这正是你想要的。