- Home Startseite ホーム 主页 首頁
- SDK
- Dev Guide Handbuch Guía Guide Guida 開発ガイド 开发人员指南 開發指南
- Reference Referenz Referencia Référence Riferimento リファレンス 参考 參考資料
- Resources
- Videos ビデオ
- Blog ブログ 博客 網誌

Android.com

Hello, Views >

# Hello, LinearLayout

A `LinearLayout` is a GroupView that will lay child View elements vertically or horizontally.

1. Start a new project/Activity called HelloLinearLayout.
2. Open the layout file. Make it like so:

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

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

       	<TextView
       	    android:text="red"
       	    android:gravity="center_horizontal"
       	    android:background="#aa0000"
       	    android:layout_width="wrap_content"
       	    android:layout_height="fill_parent"
       	    android:layout_weight="1"/>

       	<TextView
       	    android:text="green"
       	    android:gravity="center_horizontal"
       	    android:background="#00aa00"
       	    android:layout_width="wrap_content"
       	    android:layout_height="fill_parent"
       	    android:layout_weight="1"/>

       	<TextView
       	    android:text="blue"
       	    android:gravity="center_horizontal"
       	    android:background="#0000aa"
       	    android:layout_width="wrap_content"
       	    android:layout_height="fill_parent"
       	    android:layout_weight="1"/>

       	<TextView
       	    android:text="yellow"
       	    android:gravity="center_horizontal"
       	    android:background="#aaaa00"
       	    android:layout_width="wrap_content"
       	    android:layout_height="fill_parent"
       	    android:layout_weight="1"/>

           </LinearLayout>

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

       	<TextView
       	    android:text="row one"
       	    android:textSize="15pt"
       	    android:layout_width="fill_parent"
       	    android:layout_height="wrap_content"
       	    android:layout_weight="1"/>

       	<TextView
       	    android:text="row two"
       	    android:textSize="15pt"
       	    android:layout_width="fill_parent"
       	    android:layout_height="wrap_content"
       	    android:layout_weight="1"/>

       	<TextView
       	    android:text="row three"
       	    android:textSize="15pt"
       	    android:layout_width="fill_parent"
       	    android:layout_height="wrap_content"
       	    android:layout_weight="1"/>

       	<TextView
       	    android:text="row four"
       	    android:textSize="15pt"
       	    android:layout_width="fill_parent"
       	    android:layout_height="wrap_content"
       	    android:layout_weight="1"/>

           </LinearLayout>

       </LinearLayout>

   Carefully inspect the XML. You'll notice how this layout works a lot like an HTML layout. There is one parent LinearLayout that is defined to lay its child elements vertically. The first child is another LinearLayout that uses a horizontal layout and the second uses a vertical layout. Each LinearLayout contains several `TextView` elements.

3. Now open the HelloLinearLayout Activity and be sure it loads this layout in the `onCreate()` method:

       public void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           setContentView(R.layout.main);
       }

   `R.layout.main` refers to the `main.xml` layout file.

4. Run it.

You should see the following:

Notice how the various XML attributes define the View's behavior. Pay attention to the effect of the `layout_weight`. Try experimenting with different values to see how the screen real estate is distributed based on the weight of each element.

### References

- `LinearLayout`
- `TextView`

↑ Go to top

← Back to Hello, Views