Android：允许在TableLayout中使用margin/padding，以便在小部件之间提供一些间隔。

Question

我已经在TableLayout中定义了六个按钮，如下所示：-

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp"
android:shrinkColumns="*"
android:stretchColumns="*" >

<TableRow
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:gravity="center" >

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:text="Btn1" />

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:text="Btn1" />
</TableRow>

<TableRow
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1" >

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:text="Btn1" />

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:padding="5dp"
        android:text="Btn1" />
</TableRow>

<TableRow
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1" >

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:text="Btn1" />

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:text="Btn1" />
</TableRow>

</TableLayout>

其显示效果如下：

这里我想要将所有按钮分开。当我应用填充或边距时，位于右侧的按钮不能适应屏幕并且部分被裁剪。

这里我给第一行添加了20个填充和第二行添加了20个边距，然后它看起来像：

代码：

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp"
android:shrinkColumns="*"
android:stretchColumns="*" >

<TableRow
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:padding="20dp" >

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:text="Btn1" />

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:text="Btn1" />
</TableRow>

<TableRow
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:layout_margin="20dp" >

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:text="Btn1" />

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:padding="5dp"
        android:text="Btn1" />
</TableRow>

<TableRow
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1" >

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:text="Btn1" />

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:text="Btn1" />
</TableRow>

</TableLayout>

如何解决这个问题？

风格：

<style name="CustomStyleButton2" parent="@android:style/Widget.Button">
    <item name="android:textSize">16sp</item>
    <item name="android:textStyle">bold</item>
    <item name="android:textColor">#dedfdc</item>
    <item name="android:gravity">center</item>
    <item name="android:shadowColor">#000000</item>
    <item name="android:shadowDx">1</item>
    <item name="android:shadowDy">1</item>
    <item name="android:shadowRadius">0.6</item>
    <item name="android:background">@drawable/custom_button2</item>
    <item name="android:padding">10dip</item>
</style>

背景：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape>
            <solid android:color="#151515" />
            <stroke android:width="1dp" android:color="#FFFFFF" />
            <corners android:radius="3dp" />
            <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />
        </shape>
    </item>
    <item>
        <shape>
            <gradient android:angle="270" android:endColor="#2E2E2E" android:startColor="#585858" />
            <stroke android:width="1dp" android:color="#FFFFFF" />
            <corners android:radius="3dp" />
            <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />
        </shape>
    </item>
</selector>

- Vinit ...

---

你正在使用什么样式？ - nitesh goel

@niteshgoel...我在上面编辑的代码中提到了样式... - Vinit ...

@niteshgoel... 抱歉 Nitesh ...我正在使用 Kathir 的代码...这种风格也用于其他布局。因此，如果我对样式进行任何更改，则会影响到另一个布局... - Vinit ...

我刚刚根据你的问题给出了正确的解决方案。如果你想要创建不同的样式，那么可以自由发挥。否则，你可以使用任何你想要的东西...谢谢。 - nitesh goel

@niteshgoel，谢谢你的努力。我检查了你的代码（在示例项目中）。它可以工作。再次感谢。 - Vinit ...

Answer 1

只需将这些代码添加到您的样式中

<item name="android:layout_marginRight">10dp</item>
    <item name="android:layout_marginBottom">10dp</item>

- nitesh goel

---

是的，这是您想要的吗？ - nitesh goel

Answer 2

您应该适当使用权重，例如将 weightSum 设置为 TableRow，并将 layout_weight 分配给每个按钮。

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp"
android:shrinkColumns="*"
android:stretchColumns="*" >

<TableRow
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:weightSum="2"
    android:padding="20dp" >

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:layout_weight="1"
        android:text="Btn1" />

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:layout_weight="1"
        android:text="Btn1" />
</TableRow>

    <TableRow
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:weightSum="2"
    android:layout_margin="20dp" >

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:layout_weight="1"
        android:text="Btn1" />

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:padding="5dp"
        android:layout_weight="1"
        android:text="Btn1" />
</TableRow>

<TableRow
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:weightSum="2" >

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:layout_weight="1"
        android:text="Btn1" />

    <Button
        style="@style/CustomStyleButton2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_span="1"
        android:layout_weight="1"
        android:text="Btn1" />
</TableRow>

</TableLayout>

此外，如果您希望在所有按钮之间有间隔，请为每个按钮设置边距而不是表格行。

- vipul mittal

---

直到出现问题为止，无法在两个按钮（左右按钮）之间提供一些分离。 - Vinit ...

将表格行的边距删除并将其设置为按钮。 - vipul mittal

Answer 3

不要使用表格布局，按照我下面指定的方式使用三个线性布局。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="#ffffff" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="@drawable/action_back"
        android:gravity="center"
        android:paddingLeft="20dp"
        android:padding="3dp" >

        <Button
            android:id="@+id/button1"
            android:layout_width="38dp"
            android:layout_height="38dp"
            android:background="@drawable/d" />

        <View
            android:layout_width="1dp"
            android:layout_height="30dp"
            android:layout_marginLeft="5dp"
            android:background="#ffffff" />

        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="TextView"
            android:visibility="invisible" />

        <View
            android:layout_width="1dp"
            android:layout_height="30dp"
            android:layout_marginRight="5dp"
            android:background="#ffffff" />

        <Button
            android:id="@+id/button2"
            android:layout_width="38dp"
            android:layout_height="38dp"
            android:background="@drawable/b" />
    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="#000066" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1" >

        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/d"
            android:text="Button" />

        <View
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:background="#000066" />

        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/d"
            android:text="Button" />
    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="#000066" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1" >

        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/d"
            android:text="Button" />

        <View
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:background="#000066" />

        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/d"
            android:text="Button" />
    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="#000066" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1" >

        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/d"
            android:text="Button" />

        <View
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:background="#000066" />

        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/d"
            android:text="Button" />
    </LinearLayout>

</LinearLayout>

在android:drawableTop="@drawable/d"之后，我放置了要绘制的图像。通过指定，您可以设计任何您想要的按钮。现在，您可以对线性布局进行对齐填充。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >





    <View
        android:layout_width="match_parent"
        android:layout_height="10dp"
        android:background="#000066" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1" >

        <View
            android:layout_width="10dp"
            android:layout_height="match_parent"
            android:background="#000066" />

        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/d"
            android:text="Button" />

        <View
            android:layout_width="10dp"
            android:layout_height="match_parent"
            android:background="#000066" />

        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/d"
            android:text="Button" />

        <View
            android:layout_width="10dp"
            android:layout_height="match_parent"
            android:background="#000066" />

    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="10dp"
        android:background="#000066" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1" >

        <View
            android:layout_width="10dp"
            android:layout_height="match_parent"
            android:background="#000066" />

        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/d"
            android:text="Button" />

        <View
            android:layout_width="10dp"
            android:layout_height="match_parent"
            android:background="#000066" />

        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/d"
            android:text="Button" />

        <View
            android:layout_width="10dp"
            android:layout_height="match_parent"
            android:background="#000066" />

    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="10dp"
        android:background="#000066" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1" >

        <View
            android:layout_width="10dp"
            android:layout_height="match_parent"
            android:background="#000066" />


        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/d"
            android:text="Button" />

        <View
            android:layout_width="10dp"
            android:layout_height="match_parent"
            android:background="#000066" />

        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@null"
            android:drawableTop="@drawable/d"
            android:text="Button" />

        <View
            android:layout_width="10dp"
            android:layout_height="match_parent"
            android:background="#000066" />

    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="10dp"
        android:background="#000066" />

</LinearLayout>

屏幕截图：http://s1288.photobucket.com/user/csevoice1/media/untitled_zps659b57d7.png.html 希望这是您所需要的。

- kathir

---

使用视图，您可以拆分按钮。 - kathir

这样做没有意义，TableRow 扩展了 LinearLayout. - Adinia

可以对表格行应用精确的权重。 - vipul mittal

@kathir...这段代码可以工作...但我认为我们可以通过TableLayout来实现这个。 - Vinit ...

是的，正确的。但是表格行，我们想设计什么就很容易了，伙计。 - kathir