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
, withvertical
orientation, that would contain everything - and, then, a first
LinearLayout
, withhorizontal
orientation- that would contain D and A,
- and the same kind of
LinearLayout
withhorizontal
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 ImageView
s 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.
精彩评论