按键间距 [英] Buttons spacing

问题描述

我想设置的按钮0保证金，（所以按键之间没有空格）。

I'm trying to set the margin of the buttons to 0, (so no spacing between the buttons).

基本上，我希望我的按钮看起来类似的东西（下面的样式和颜色）：

Basically, I want my buttons to look something like that(with the following style and colors):

任何想法，我怎么能完成这样的任务？我不希望由我自己创造一个9修补形象（因为我没有任何知识，这样做不）。

Any idea how can I accomplish this kind of task? I do not want to create a 9 patch image by myself (since I don't have any knowledge doing that).

推荐答案

在这种特殊情况下，可以方便的与XML的做这个任务。
这是你如何可以分两步实现的：

In this specific case, you can do this task easily with XMLs. This is how you can achieve it in two steps:

在创建文件夹绘制形状3：

Create 3 shapes in drawable folder:

• 第一个形状是左键： shape_button_left.xml 。这种形状具有径向左弯道和渐变背景。

• First shape is for the left button: shape_button_left.xml. This shape has radial left corners and gradient background.

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

    <stroke
        android:width="1dp"
        android:color="#BFBFBF" >
    </stroke>

    <corners
        android:bottomLeftRadius="10dp"
        android:topLeftRadius="10dp" >
    </corners>

    <gradient android:startColor="#D2D2D2" android:endColor="#F2F2F2" android:angle="90"/>

</shape>

二形状为中心按钮： shape_button_center.xml 。这种形状不为角定义任何东西，也有渐变背景。

Second shape is for the center button: shape_button_center.xml. This shape doesn't define anything for corners and also has gradient background.

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

    <stroke
        android:width="1dp"
        android:color="#BFBFBF" >
    </stroke>

    <gradient android:startColor="#D2D2D2" android:endColor="#F2F2F2" android:angle="90"/>

</shape>

第三形状是右边的按钮： shape_button_right.xml 。这种形状具有径向右上角和渐变背景。

Third shape is for the right button: shape_button_right.xml. This shape has radial right corners and gradient background.

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

    <stroke
        android:width="1dp"
        android:color="#BFBFBF" >
    </stroke>

    <corners
        android:bottomRightRadius="10dp"
        android:topRightRadius="10dp" >
    </corners>

    <gradient android:startColor="#D2D2D2" android:endColor="#F2F2F2" android:angle="90"/>

</shape>

现在，我们可以用简单的看法这些形状来获得按钮的作用。
在您的布局XML添加下一个code：

Now, we can use these shapes in simple views to get the effect of buttons. In your layout XML add the next code:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center" >

    <!-- Button Left -->

    <LinearLayout
        android:id="@+id/button_left"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:background="@drawable/shape_button_left"
        android:gravity="center"
        android:padding="10dp" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Left"
            android:textColor="#333333"
            android:textSize="20sp" />
    </LinearLayout>
    <!-- End Button Left -->


    <!-- Button Center -->

    <LinearLayout
        android:id="@+id/button_center"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:background="@drawable/shape_button_center"
        android:gravity="center"
        android:padding="10dp" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Center"
            android:textColor="#333333"
            android:textSize="20sp" />
    </LinearLayout>
    <!-- End Button Center -->


    <!-- Button Right -->

    <LinearLayout
        android:id="@+id/button_right"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:background="@drawable/shape_button_right"
        android:gravity="center"
        android:padding="10dp" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Right"
            android:textColor="#333333"
            android:textSize="20sp" />
    </LinearLayout>
    <!-- End Button Right -->

</LinearLayout>

这就是它
现在，你可以在你的code添加的onClick监听器LinearLayouts和它像一个按钮工作。

That's it Now, you can add onClick listener in your code to LinearLayouts and work with it like a button.

此测试code我的手机给下一个结果：

Testing this code on my mobile gives next result:

这篇关于按键间距的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！