Why buttons are stretched to cover all selected layouts

Question

I am trying to align 3 buttons (left, center, right). I know that this can be done using gravity, but I tried to understand the concept of layout_weight here. I am using this code:

<LinearLayout
id=..
layout_width =  "wrap_content"
layout_height = "wrap_content"
orientation="Horizonta"
>
 <Button
  id=1
  layout_width =  "wrap_content"
  layout_height = "wrap_content"
  layout_weight = "1"
  text= "text" />

 <Button
  id=2
  layout_width =  "wrap_content"
  layout_height = "wrap_content"
  layout_weight = "1"
  text= "text" />

 <Button
  id=3
  layout_width =  "wrap_content"
  layout_height = "wrap_content"
  layout_weight = "1"
  text= "text" />
</LinearLayout>

However, I get the TOP part of the image below. What is right. The question is, why does the button stretch to cover the whole area that it highlights when I use wrap_content? How to do it like bottom image?

thank

Answer 1

layout_weight , . layout_weight , , , .

- , , (--). , LinearLayout , layout_gravity. layout_gravity, , LinearLayout, .

, - , . API 14 (Ice Cream Sandwich) .

<?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="wrap_content"
    android:orientation="horizontal" >

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

     <Space
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight = "1" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

    <Space
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight = "1" />

    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

</LinearLayout>

Space TextViews, , API.

<TextView
    android:id="@+id/textView1"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1.0"
    android:text="" />     

Answer 2

, - , .

Answer 3

Your buttons fill the gap because you use layout_weight="1"one that tells the buttons to use extra space, also because the attribute layout_weightis 1 for all buttons, they will have the same space and the same size. You cannot get this bottom layout using layout_weight, use layout_gravityto place them (here is another question about this What does android mean: layout_weight? ).

If you want the following image to try the following:

<LinearLayout
id=..
layout_width =  "wrap_content"
layout_height = "wrap_content"
orientation="Horizonta"
>
 <Button
  id=1
  layout_width =  "wrap_content"
  layout_height = "wrap_content"
  android:layout_gravity="left"
  text= "text" />

 <Button
  id=2
  layout_width =  "wrap_content"
  layout_height = "wrap_content"
  android:layout_gravity="center_horizontal"
  text= "text" />

 <Button
  id=3
  layout_width =  "wrap_content"
  layout_height = "wrap_content"
  android:layout_gravity="right"
  text= "text" />
</LinearLayout>