How to make multiple Views the same Width?
As part of a larger UI, I have a RelativeLayout
with three Views that I would like to have the same width. The three views are "stacked" on top of each other like this
ImageView
TextView
ImageView
I've tried various things such as setting the View
s' android:layout_width
to "wrap_content", setting android:layout_width
to "0px" and android:layout_weight
to "1" as suggested by this answer, and placing the View
s in a LinearLayout
with no success.
How can I get these three views to be the same width?
Relevant portion of the layout xml:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="0px"
android:layout_weight="1">
<ImageView
android:layout_above="@string/window_text"
android:layout_below="@string/eighteen_id"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:paddingTop="5dp"
android:layout_alignParentRight="true"
android:paddingBottom="5dp"
android:src="@drawable/line1"
android:id="@string/line_1_id"/>
<TextView
android:layout_above="@string/line_2_id"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:gravity="right"
android:layout_centerVertical="true"
android:textColor="#000000"
android:id="@string/window_text"/>
<ImageView
android:layout_above="@string/top_row_id"
android:layout_height="wrap_content"
android:lay开发者_运维知识库out_width="wrap_content"
android:layout_alignParentRight="true"
android:paddingTop="5dp"
android:paddingBottom="10dp"
android:src="@drawable/line1"
android:id="@string/line_2_id"/>
</RelativeLayout>
This is very simple, see below. The "magic" is simple. Set the parent to wrap_content, and the child views to fill parent. The smaller child views then always get set to the size of the largest child view.
<?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" >
<LinearLayout
android:id="@+id/bottom_row"
android:orientation="vertical"
android:layout_alignParentBottom="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<Button
android:id="@+id/view1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="123" />
<Button
android:id="@+id/view2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="more text" />
<Button
android:id="@+id/view3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="even more text" />
</LinearLayout>
</RelativeLayout>
Did you try setting android:layout_width="fill_parent" for the two image views, just like you have it for the TextView? If you want the three views to be the width of the widest, you can wrap all three in a LinearLayout that has android:layout_width="wrap_content".
You can get the image views to fill the parent width by setting android:scaleType="" in the ImageView but if the text doesn't fill the screen width and you want the image width to match the text width exactly, you'll have to do it programatically by getting the text views width and then setting the imageview's width to that.
精彩评论