Question

我想要一个button like this。它基本上是一个Text： NEXT ，右侧有一个 Chevron 。

我已经尝试了一个透明背景和android:drawableRight的按钮，但是drawable的填充看起来很奇怪。

如何实现想要的外观？

到目前为止我所拥有的：

<Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Next"
            android:textColor="@color/colorAccent"
            android:drawableRight="@drawable/chevron_right"
            android:background="#00000000"/>

/ 很抱歉直接发布链接而不是照片，但我的声誉不够高。 /

Answer 1

您可以使用FrameLayout / RelativeLayout包含ImageButton和水平LinearLayout / RelativeLayout，其中包含文字和V形图像对齐在右边。像这样：

  <FrameLayout
        android:id="@+id/fl_btn_container"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageButton
            android:id="@+id/imbtn_btn_bg"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@null"
            android:src="@drawable/white_drawable" />

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical">

            <TextView
                android:id="@+id/tv_btn_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerInParent="true"
                android:layout_marginRight="10dp"
                android:gravity="center_horizontal"
                android:text="@string/next" />

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_toRightOf="@id/tv_btn_text"
                android:src="@drawable/chevron" />
        </RelativeLayout>
    </FrameLayout>

此示例来自我的应用，可能您需要对其进行调整。

Answer 2

您可以使用android:drawablePadding="8dp"设置文本和drawable之间的填充。

Answer 3

您是否尝试使用负值dp设置V形和边框视图之间的空格。去年我遇到了类似的问题，正面和负面的dp正确组合修复了它

Answer 4

我不确定你想要什么，但这就是我将如何处理你所附的按钮

<RelativeLayout
    android:layout_width="80dp"     
    android:background="@color/colorAccent"
    android:layout_height="40dp">
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_centerInParent="true"

        android:layout_height="wrap_content">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            android:text="NEXT"/>
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            android:src="@android:drawable/arrow_up_float"/>
    </LinearLayout>
</RelativeLayout>

Android Button / TextView样式

4 个答案: