具有图像背景和多个文本视图的自定义按钮

时间:2017-05-05 13:31:30

标签: android button view

我的项目我有一个看起来像这样的按钮。

enter image description here

我创建了一个自定义视图,图像资源作为背景和三个文本视图,但我有一个问题,在不同的屏幕尺寸上它看起来不同。背景在大屏幕上延伸太多而文本改变位置。

最好的方法是使用这种按钮来适应不同的屏幕尺寸。

修改

这是我的自定义视图的xml。我发现这样做的最好方法是使用PercentLayout。

<android.support.percent.PercentFrameLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
>
<ImageView
    android:id="@+id/background_image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/blue_button" />

<TextView
    android:id="@+id/custom_button_main_text"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="@dimen/custom_button_text_left_margin"
    app:layout_marginTopPercent="12%"
    android:textSize="@dimen/custom_button_title_text_size"
    android:textColor="@android:color/white"
    />

<TextView
    android:id="@+id/custom_button_additional_left_text"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_marginTopPercent="70%"
    app:layout_marginLeftPercent="20%"
    android:textSize="@dimen/custom_button_additional_text_size"
    android:textColor="@android:color/black"
    />

<TextView
    android:id="@+id/custom_button_additional_right_text"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_marginTopPercent="70%"
    app:layout_marginLeftPercent="80%"
    android:textSize="@dimen/custom_button_additional_text_size"
    android:textColor="@android:color/black"
    />

1 个答案:

答案 0 :(得分:0)

如果上面是您的自定义视图,则应使用具有上述形状的颜色和可绘制xml文件,并使用尺寸标注高度和宽度。