开发者

Android XML Layout - 4 ImageViews on one screen

I thought I have understood the XML layout of Android, but it seems that I haven't. I want to have four ImageViews on one screen, to view four images at the same time.

It should look like this, where A to D represents the image views:

DDDAAA
DDDAAA
BBBCCC
BBBCCC

How can I do that? I tried it this way, but it's not working. The Eclipse Editor seems not to be very good for this either. Is there a better one to create those layouts ?

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

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <TableRow>
<ImageView android:id="@+id/ImageView01" android:layout_height="wrap_content" android:layout_width="wrap_content" ></开发者_StackOverflowImageView>
<ImageView android:id="@+id/ImageView02" android:layout_height="wrap_content" android:layout_width="wrap_content"></ImageView>
  </TableRow>

  <TableRow>
<ImageView android:id="@+id/ImageView03" android:layout_height="wrap_content" android:layout_width="wrap_content"></ImageView>
<ImageView android:id="@+id/ImageView04" android:layout_height="wrap_content" android:layout_width="wrap_content"></ImageView>
  </TableRow>
</RelativeLayout>


What about :

  • a LinearLayout, with vertical orientation, that would contain everything
  • and, then, a first LinearLayout, with horizontal orientation
    • that would contain D and A,
  • and the same kind of LinearLayout with horizontal orientation, a second time, for B and C

And using

  • android:layout_weight
  • and android:gravity="center"

so each Layout takes enough place and is centered ?


A bit like this, I'd say :

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

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="horizontal"
        android:layout_weight="1"
        >

        <LinearLayout
            android:id="@+id/DashboardNewPost"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical"
            android:layout_weight="1"
            android:gravity="center"
            >
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/new_post"
            />
        </LinearLayout>
        <LinearLayout
            android:id="@+id/DashboardPostsList"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical"
            android:layout_weight="1"
            android:gravity="center"
            >
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/posts_list"
            />
        </LinearLayout>

    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="horizontal"
        android:layout_weight="1"
        >
        <LinearLayout
            android:id="@+id/DashboardCommentsList"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical"
            android:layout_weight="1"
            android:gravity="center"
            >
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/comments_list"
            />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/DashboardBlogParameters"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical"
            android:layout_weight="1"
            android:gravity="center"
            >
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/blog_params"
            />
        </LinearLayout>

    </LinearLayout>

</LinearLayout>


I suppose (not tried) that you could even remove the LinearLayout that's just arround each ImageView, adding the attributes it has to the ImageViews instead...

(In the application I took this from, I had to add those LinearLayout because there are more than only those images)


It doesn't make sense to have TableRows in a RelativeLayout. It might help you to read through the introductory layout documentation. It explains the different layout types and their usages.

For your case, you should be able to change RelativeLayout to TableLayout.

Also, when asking layout questions its helpful if you explain the behavior you are seeing with your attempt, rather than just saying it doesn't work.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜