如何将图像按钮包裹在水平线性布局中?

时间:2013-01-02 04:42:36

标签: android android-linearlayout relativelayout

有没有办法在水平线性布局中包装图像按钮?或者还有其他方法可以做以下事情吗?

我有六个图像按钮。假设这些按钮出现在中等分辨率设备中,如下所示:

Image button 1 | Image button 2 | Image button 3 | (1st row)

Image button 4 | Image button 5 | Image button 6 | (2nd row)

我希望这些按钮出现在平板电脑或任何高分辨率设备中,如下所示:

Image button 1 | Image button 2 | Image button 3 | Image button 4 | (1st row)

Image button 5 | Image button 6 |      (2nd row)

或者像这样:

Image button 1 | Image button 2 | Image button 3 | Image button 4 | Image button 5 | 
Image button 6 |

根据设备屏幕。

这是我的主要XML文件:

<?xml version="1.0" encoding="utf-8"?>

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@layout/back2">


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@layout/back2">
<TextView
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:background="@layout/button5"
        android:gravity="center"
        android:orientation="vertical"
        android:text="@string/hello"
        android:textColor="#D5D5D5"
        android:textSize="20sp" />
<com.google.ads.AdView android:id="@+id/adView"
                         android:layout_width="wrap_content"
                         android:layout_height="wrap_content"
                         ads:adUnitId="a150c75f96c352c"
                         ads:adSize="BANNER"

                         ads:loadAdOnCreate="true"/>

<org.core.mywindows8.FlowLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:f="http://schemas.android.com/apk/res/org.core.mywindows8"
f:horizontalSpacing="6dip"
f:verticalSpacing="12dip"
f:fitContent="true"

   android:layout_width="fill_parent"
android:layout_height="wrap_content"
>

<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
      android:background="@color/morange1"
        android:drawableTop="@drawable/tutorials"
        android:textColor="#ffffff"
        android:id="@+id/button1"
        android:paddingTop="16sp"
        android:drawablePadding="10sp"
        android:text="@string/tutorials"
/>
<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
    android:background="@color/mviolet"
        android:drawableTop="@drawable/themes"
        android:textColor="#ffffff"
        android:id="@+id/button2"
        android:paddingTop="16sp"
        android:drawablePadding="10sp"
        android:text="@string/themes"
        />
<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
     android:background="@color/mblu2"
        android:drawableTop="@drawable/gadgets"
         android:textColor="#ffffff"
        android:id="@+id/button3"
        android:paddingTop="16sp"
        android:drawablePadding="10sp"
        android:text="@string/gadgets"/>
<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
android:background="@color/mgree"
        android:drawableTop="@drawable/network"
        android:textColor="#ffffff"
        android:id="@+id/button4"
        android:paddingTop="16sp"

        android:drawablePadding="10sp"
       android:text="@string/networking"/>
<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
    android:background="@color/mblu3"
        android:drawableTop="@drawable/search"
         android:textColor="#ffffff"
        android:id="@+id/button5"
        android:paddingTop="16sp"
        android:drawablePadding="10sp"
        android:text="@string/win8index"/>


 </org.core.mywindows8.FlowLayout>
</LinearLayout>
</ScrollView>

3 个答案:

答案 0 :(得分:10)

您可以使用FlowLayout。

检查this

<强> EDITED

从我给你的链接中为项目添加所需的类,样式和属性。 并使用此布局,将其添加到布局XML中。


在Git项目中提到..将所有文件从Git Project复制到您的项目

用户FlowLayout而不是XML中的LinearLayout

<com.yourpackage.FlowLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
>
</com.yourpackage.FlowLayout>

然后在该FlowLayout中添加子视图,可以仅使用XML或在运行时。

支持的其他参数是:

xmlns:f="http://schemas.android.com/apk/res/your.namespace"
f:horizontalSpacing="6dip"
f:verticalSpacing="12dip"
f:orientation="vertical"
f:layout_horizontalSpacing="32dip"
f:layout_verticalSpacing="32dip"

我添加了支持以使内容适合一行。获取my github source

使这项工作。你需要为你的布局再为fitContent赋予一个属性true。

F:fitContent = “真”

回答您的意见

f:verticalSpacing =“12dip” - 用于指定整个FlowLayout的垂直间距。即每个子视图/按钮都有垂直间距。

实施例

 <org.apmem.tools.layouts.FlowLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        f:verticalSpacing="12dip"
    >

</org.apmem.tools.layouts.FlowLayout>

然而,当我们指定权重时,f:layout_verticalSpacing =“32dip”被指定给子按钮

实施例

<Button
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    f:layout_verticalSpacing="32dip"
>
</Button>

答案 1 :(得分:0)

通常,您可以为不同的配置制作备用布局XML文件。每个文件夹都有一个同名的xml文件(在Activity中调用setContentView()时使用的文件)。

/res/layout/
/res/layout-sw600dp/
/res/layout-sw720dp/

如果您的项目没有这些文件夹,您可以继续自己制作。这告诉系统在运行时,基于与密度无关的像素中设备的最小可用宽度,将使用这三种布局中的一种。 sw600dp建议用于指定7英寸平板电脑等“大屏幕”;建议sw720dp用于指定10英寸平板电脑等“xlarge屏幕”。这些数字可以是任意的。

你也可以像Vivek Khandelwal建议的那样使用FlowLayout实现,但这可能会或可能不会完全按照你的意愿工作。

答案 2 :(得分:0)

我已在此处发布了一个简单且相对简洁的解决方案的详细信息:

https://stackoverflow.com/a/23228213/2162226


摘要