Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android relative layout with button width using weight

I've used the layout_weight parameter to set the width of the buttons at 70% of the total layout width, but it seems I'm missing some important detail in order to make it work.

(Another solution would be to work with display.getWidth() programmatically, but it doesn't work either, because I don't know what my .xml should look like If I choose to set the width with button.setWidth())

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="fill_parent" 
    android:layout_width="fill_parent"
    android:layout_weight="1.0">
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textSize="15px"  
        android:id="@+id/userVersionTextViewNew"
        android:gravity="center"
        android:layout_centerVertical="true"/>
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textSize="15px"
        android:gravity="center"
        android:layout_above="@id/userVersionTextViewNew"
        android:id="@+id/userSoftSerialNumberTextView"/>
    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:src="@drawable/logo_200"
        android:layout_above="@id/userSoftSerialNumberTextView"
        android:layout_centerHorizontal="true"/>    
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textSize="15px"
        android:gravity="center"
        android:layout_below="@id/userVersionTextViewNew"
        android:id="@+id/dummyTextView"/>       
    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/loginButton"
        android:text="Σύνδεση"
        android:layout_centerHorizontal="true"
        android:layout_below="@id/dummyTextView"
        android:layout_weight="0.7"/>
    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/demoLoginButton"
        android:text="Δοκιμαστική χρήση"
        android:layout_centerHorizontal="true"
        android:layout_below="@id/loginButton"
        android:layout_weight="0.7"/>
</RelativeLayout>
like image 492
iCantSeeSharp Avatar asked Oct 21 '11 08:10

iCantSeeSharp


People also ask

Can we use weight in RelativeLayout?

RelativeLayout does not pay attention to android:layout_weight . (That's a property of LinearLayout.

How does layout weight work android?

Layout WeightThis attribute assigns an "importance" value to a view in terms of how much space it should occupy on the screen. A larger weight value allows it to expand to fill any remaining space in the parent view.

How is weight used in linear layout?

Weight can only be used in LinearLayout . If the orientation of linearlayout is Vertical, then use android:layout_height="0dp" and if the orientation is horizontal, then use android:layout_width = "0dp" . It'll work perfectly. Save this answer.

How do you find the percentage width of a layout?

You are looking for the android:layout_weight attribute. It will allow you to use percentages to define your layout. In the following example, the left button uses 70% of the space, and the right button 30%. It works the same with any kind of View, you can replace the buttons with some EditText to fit your needs.


1 Answers

The Problem

You can't use the layout_weight parameters on a RelativeLayout. These are parameters from the LinearLayout. I'll give some more information about the differences later below. But first about the solution for this question

A Solution

Use a LinearLayout where you can position elements in a row with a weight distribution. Don't forget to use the 0dp width when adding layout_weights though! The below example shows a weight distribution of 70/30.

<LinearLayout
android:id="@+id/wrapper"
android:layout_width="fill_parent" 
android:layout_height="wrap_content"
android:weightSum="1.0" >

    <Button
        android:text="left" 
        android:layout_width="0dp" 
        android:layout_height="wrap_content" 
        android:layout_weight=".70" /> 

    <Button
        android:text="right" 
        android:layout_width="0dp" 
        android:layout_height="wrap_content" 
        android:layout_weight=".30" />

</LinearLayout>

All this within the RelativeLayout you already had in your code. The rest of this answer is background information that everyone with these questions should read in order to understand what they're doing.

RelativeLayout

Whenever you start with a layout with more than one element I advise you to prefer a RelativeLayout in favor of the Linear thing. The RelativeLayout is very powerful and lets you position elements in relation to each other (leftOf, below, ...). In most cases that is more than you'll ever need.

An example from the android development document (believe me it's all there):

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:paddingLeft="16dp"
    android:paddingRight="16dp" >
    <EditText
        android:id="@+id/name"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="@string/reminder" />
    <Spinner
        android:id="@+id/dates"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/name"
        android:layout_alignParentLeft="true"
        android:layout_toLeftOf="@+id/times" />
    <Spinner
        android:id="@id/times"
        android:layout_width="96dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/name"
        android:layout_alignParentRight="true" />
    <Button
        android:layout_width="96dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/times"
        android:layout_alignParentRight="true"
        android:text="@string/done" />
</RelativeLayout>

LinearLayout

The LinearLayout might look very capable too but in order to get everything sorted with only Linears you'll most likely start nesting these layouts. And that's where it get's ugly performance wise.

Again an example from the android development documentation.

<?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:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:orientation="vertical" >
    <EditText
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="@string/to" />
    <EditText
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="@string/subject" />
    <EditText
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="top"
        android:hint="@string/message" />
    <Button
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:layout_gravity="right"
        android:text="@string/send" />
</LinearLayout>
like image 152
hcpl Avatar answered Oct 27 '22 08:10

hcpl