Android按钮样式背景与XML

时间:2014-04-16 21:31:36

标签: android xml android-layout

所以我有两个按钮风格非常接近我想要的但我需要一点点帮助它一路走来。我现在拥有的是第一个屏幕节目,我想要的是第二个。有人有主意吗?我附上了相关的代码。

enter image description here enter image description here

layout xml:

....
<Button
            android:id="@+id/sched_button"
            style="?android:attr/buttonBarButtonStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/sync"
            android:layout_alignParentTop="true"
            android:background="@drawable/round_left_corner_active"
            android:text="@string/headersched"
            android:layout_toLeftOf="@+id/placeholder"
            android:paddingRight="@dimen/scheduleheadermargin"
            android:paddingLeft="@dimen/scheduleheadermargin" />

        <Button
            android:id="@+id/sched_fav_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/sched_button"
            android:layout_alignParentTop="true"
            android:layout_toRightOf="@+id/placeholder"
            android:background="@drawable/round_right_corner"
            android:paddingLeft="@dimen/scheduleheadermargin"
            android:paddingRight="@dimen/scheduleheadermargin"
            android:text="@string/headerfav" />
...

round_left_corner_active:

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

    <item>
        <shape android:shape="rectangle" >
            <solid android:color="@color/active" />

            <padding
                android:bottom="2dp"
                android:left="2dp"
                android:top="2dp" />

            <corners android:radius="5dp" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle" >
            <padding
                android:bottom="5dp"
                android:left="5dp"
                android:right="5dp"
                android:top="5dp" />

            <solid android:color="@color/active" />
        </shape>
    </item>
</layer-list>

round_right_corner

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

    <item>
        <shape android:shape="rectangle" >
            <solid android:color="@color/active" />

            <padding
                android:bottom="2dp"
                android:right="2dp"
                android:top="2dp" />

            <corners android:radius="5dp" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle" >
            <padding
                android:bottom="5dp"
                android:left="5dp"
                android:right="5dp"
                android:top="5dp" />

            <solid android:color="@color/base" />
        </shape>
    </item>
</layer-list>

1 个答案:

答案 0 :(得分:3)

左侧按钮:

<corners
    android:radius="5dip"
    android:topRightRadius="0dip"
    android:bottomRightRadius="0dip" />  

正确的一个:

<corners
    android:radius="5dip"
    android:topLeftRadius="0dip"
    android:bottomLeftRadius="0dip" />  

这应该可以解决问题。

但是,android:bottomRightRadiusandroid:bottomLeftRadius在API中的错误低于12(Android 3.1 Honeycomb)。您应该在dimens.xml内设置半径并创建一个新文件夹values-v12。请参阅此解决方案:Something's wrong in Corner radius 然后,你应该这样做:

左侧可绘制按钮

... 
<corners
    android:radius="5dip"
    android:topRightRadius="0dip"
    android:bottomRightRadius="@dimen/right_bottom_leftbutton"
    android:bottomLeftRadius="@dimen/left_bottom_leftbutton" /> 

右侧可绘制按钮

... 
<corners
    android:radius="5dip"
    android:topLeftRadius="0dip"
    android:bottomRightRadius="@dimen/right_bottom_rightbutton"
    android:bottomLeftRadius="@dimen/left_bottom_rightbutton" /> 

values / dimens.xml

<!-- left button -->
<dimen name="right_bottom_leftbutton">5dip</dimen>
<dimen name="left_bottom_leftbutton">0dip</dimen>
<!-- right button -->
<dimen name="right_bottom_rightbutton">5dip</dimen>
<dimen name="left_bottom_rightbutton">0dip</dimen>

values-v12 / dimens.xml

<!-- left button -->
<dimen name="right_bottom_leftbutton">0dip</dimen>
<dimen name="left_bottom_leftbutton">5dip</dimen>
<!-- right button -->
<dimen name="right_bottom_rightbutton">5dip</dimen>
<dimen name="left_bottom_rightbutton">0dip</dimen>