xref: /frameworks/base/docs/html-intl/intl/zh-tw/guide/topics/ui/declaring-layout.jd

page.title=
page.tags=view,viewgroup
@jd:body

<div id="qv-wrapper">
<div id="qv">
  <h2></h2>
<ol>
  <li><a href="#write"> XML</a></li>
  <li><a href="#load"> XML </a></li>
  <li><a href="#attributes"></a>
    <ol>
      <li><a href="#id">ID</a></li>
      <li><a href="#layout-params"></a></li>
    </ol>
  </li>
  <li><a href="#Position"></a></li>
  <li><a href="#SizePaddingMargins"></a></li>
  <li><a href="#CommonLayouts"></a></li>
  <li><a href="#AdapterViews"></a>
    <ol>
      <li><a href="#FillingTheLayout"></a></li>
      <li><a href="#HandlingUserSelections"></a></li>
    </ol>
  </li>
</ol>

  <h2></h2>
  <ol>
    <li>{@link android.view.View}</li>
    <li>{@link android.view.ViewGroup}</li>
    <li>{@link android.view.ViewGroup.LayoutParams}</li>
  </ol>

  <h2></h2>
  <ol>
    <li><a href="{@docRoot}training/basics/firstapp/building-ui.html">
</a></li> </div>
</div>

<p> ( <a href="{@docRoot}guide/components/activities.html">Activity</a> <a href="{@docRoot}guide/topics/appwidgets/index.html"></a>) 
</p>
<ul>
<li><strong> XML  UI </strong>Android  XML  View  ()
</li>
<li><strong></strong> View  ViewGroup  ()
 </li>
</ul>

<p>Android  UI XML  XML  </p>

<div class="sidebox-wrapper">
<div class="sidebox">
  <ul>
  <li><a href="{@docRoot}tools/sdk/eclipse-adt.html">Eclipse  ADT </a> XML  &mdash;  XML  []<strong></strong> 

</li>
  <li> <a href="{@docRoot}tools/debugging/debugging-ui.html#hierarchyViewer"></a> &mdash; / ()



</li>
  <li><a href="{@docRoot}tools/debugging/debugging-ui.html#layoutopt">layoutopt</a> 
</li>
</div>
</div>

<p> XML  UI  UI  XML  XML  UI  XML  View  {@link android.view.ViewGroup}  {@link android.view.View} 

</p>

<p> UI  XML  XML  XML EditText  <code>EditText.setText()</code>  <code>text</code> 

 </p>

<p class="note"><strong></strong><a href="{@docRoot}guide/topics/ui/layout-objects.html"></a>
 <a href="{@docRoot}resources/tutorials/views/index.html">Hello Views</a> 
</p>

<h2 id="write"> XML</h2>

<p> Android  XML  UI  HTML  &mdash;  </p>

<p> 1  ( View  ViewGroup ) {@link android.widget.LinearLayout} 
{@link android.widget.TextView}  {@link android.widget.Button}  XML </p>
<pre>
&lt;?xml version="1.0" encoding="utf-8"?>
&lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:orientation="vertical" >
    &lt;TextView android:id="@+id/text"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:text="Hello, I am a TextView" />
    &lt;Button android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello, I am a Button" />
&lt;/LinearLayout>
</pre>

<p> XML  <code>.xml</code>  Android  <code>res/layout/</code> 
 </p>

<p> XML <a href="{@docRoot}guide/topics/resources/layout-resource.html"></a></p>

<h2 id="load"> XML </h2>

<p> XML 
{@link android.view.View}  {@link android.app.Activity#onCreate(android.os.Bundle) Activity.onCreate()}  <code>{@link android.app.Activity#setContentView(int) setContentView()}</code>
<code>R.layout.<em>layout_file_name</em></code> XML  <code>main_layout.xml</code> Activity  XML




</p>
<pre>
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main_layout);
}
</pre>

<p>Android  Activity  Activity  <code>onCreate()</code>  ( <a href="{@docRoot}guide/components/activities.html#Lifecycle">Activity</a>)


</p>


<h2 id="attributes"></h2>

<p> View  ViewGroup  XML  View  ( TextView  <code>textSize</code> ) View  View  View  ( <code>id</code> )



 View  (View  ViewGroup )

</p>

<h3 id="id">ID</h3>

<p> View  ID View ID  XML  <code>id</code>  View  XML  ( {@link android.view.View} ) XML  ID 




</p>
<pre>android:id="&#64;+id/my_button"</pre>

<p> @  XML  ID  ID 
 (+)  (<code>R.java</code> ) 
Android  ID 
 Android  ID  +  <code>android</code> 
</p>
<pre>android:id="&#64;android:id/empty"</pre>
<p> <code>android</code>  <code>android.R</code>  ID
</p>

<p></p>
<ol>
  <li>/ ID
<pre>
&lt;Button android:id="&#64;+id/my_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="&#64;string/my_button_text"/>
</pre>
  </li>
  <li> ( <code>{@link android.app.Activity#onCreate(Bundle) onCreate()}</code> )

<pre>
Button myButton = (Button) findViewById(R.id.my_button);
</pre>
  </li>
</ol>
<p> {@link android.widget.RelativeLayout}  ID ID 

</p>
<p> ID  ID ID  ID ( ID)

</p>


<h3 id="layout-params"></h3>

<p> <code>layout_<em>something</em></code>  XML  ViewGroup  View 
</p>

<p> ViewGroup  {@link
android.view.ViewGroup.LayoutParams} 

 1  () 
</p>

<img src="{@docRoot}images/layoutparams.png" alt="" />
<p class="img-caption"><strong> 1.</strong>
</p>

<p> LayoutParams 
 LayoutParams LayoutParams
 </p>

<p> (<code>layout_width</code> 
<code>layout_height</code>) LayoutParams 
 <p>

<p> ()

 </p>

<ul>
  <li><var>wrap_content</var> 
</li>
  <li><var>match_parent</var> ( API  8  <var>fill_parent</var> ) 
</li>
</ul>

<p> () 
 ( (
<var>dp</var>) <var>wrap_content</var>
<var>match_parent</var><a href="{@docRoot}guide/topics/resources/available-resources.html#dimension"></a>



</p>


<h2 id="Position"></h2>
   <p>
    (<em></em><em></em>) ()



   </p>

   <p>
    {@link android.view.View#getLeft()}  {@link android.view.View#getTop()} 
 (X )
 (Y )

 <code>getLeft()</code>  20 20 


   </p>

   <p>
    {@link android.view.View#getRight()}  {@link android.view.View#getBottom()} 

   
 {@link android.view.View#getRight()} <code>getLeft() + getWidth()</code>

   </p>


<h2 id="SizePaddingMargins"></h2>
   <p>
   

   </p>

   <p>
   <em></em><em></em>

 {@link android.view.View#getMeasuredWidth()}  {@link android.view.View#getMeasuredHeight()} 


   </p>

   <p>
   <em></em><em></em><em></em><em></em>
 ()

 () 

{@link android.view.View#getWidth()}  {@link android.view.View#getHeight()} 
   </p>

   <p>
    ()

   
2  2 

{@link android.view.View#setPadding(int, int, int, int)} 
{@link android.view.View#getPaddingLeft()}{@link android.view.View#getPaddingTop()}
{@link android.view.View#getPaddingRight()}  {@link android.view.View#getPaddingBottom()} 
   </p>

   <p>
   

{@link android.view.ViewGroup} 
{@link android.view.ViewGroup.MarginLayoutParams}
   </p>

   <p><a href="{@docRoot}guide/topics/resources/more-resources.html#Dimension"></a>

   </p>






<style type="text/css">
div.layout {
  float:left;
  width:200px;
  margin:0 0 20px 20px;
}
div.layout.first {
  margin-left:0;
  clear:left;
}
</style>




<h2 id="CommonLayouts"></h2>

<p>{@link android.view.ViewGroup} 
 Android 
</p>

<p class="note"><strong></strong> UI 

 ()
</p>

<!--
<h2 id="framelayout">FrameLayout</h2>
<p>{@link android.widget.FrameLayout FrameLayout} is the simplest type of layout
object. It's basically a blank space on your screen that you can
later fill with a single object &mdash; for example, a picture that you'll swap in and out.
All child elements of the FrameLayout are pinned to the top left corner of the screen; you cannot
specify a different location for a child view. Subsequent child views will simply be drawn over
previous ones,
partially or totally obscuring them (unless the newer object is transparent).
</p>
-->


<div class="layout first">
  <h4><a href="layout/linear.html"></a></h4>
  <a href="layout/linear.html"><img src="{@docRoot}images/ui/linearlayout-small.png" alt="" /></a>
  <p>
</p>
</div>

<div class="layout">
  <h4><a href="layout/relative.html"></a></h4>
  <a href="layout/relative.html"><img src="{@docRoot}images/ui/relativelayout-small.png" alt="" /></a>
  <p> ( A  B ) ()
</p>
</div>

<div class="layout">
  <h4><a href="{@docRoot}guide/webapps/webview.html"></a></h4>
  <a href="{@docRoot}guide/webapps/webview.html"><img src="{@docRoot}images/ui/webview-small.png" alt="" /></a>
  <p></p>
</div>




<h2 id="AdapterViews" style="clear:left"></h2>

<p> {@link android.widget.AdapterView} 

{@link android.widget.AdapterView}  {@link android.widget.Adapter} 
{@link android.widget.Adapter}  {@link android.widget.AdapterView}  &mdash; {@link android.widget.Adapter}  {@link android.widget.AdapterView} 


</p>

<p></p>

<div class="layout first">
  <h4><a href="layout/listview.html"></a></h4>
  <a href="layout/listview.html"><img src="{@docRoot}images/ui/listview-small.png" alt="" /></a>
  <p></p>
</div>

<div class="layout">
  <h4><a href="layout/gridview.html"></a></h4>
  <a href="layout/gridview.html"><img src="{@docRoot}images/ui/gridview-small.png" alt="" /></a>
  <p></p>
</div>



<h3 id="FillingTheLayout" style="clear:left"></h3>

<p> {@link android.widget.AdapterView} 
{@link android.widget.Adapter}  {@link
android.view.View} {@link android.widget.AdapterView} ( {@link android.widget.ListView}  {@link android.widget.GridView}
</p>

<p>Android  {@link android.widget.Adapter}  {@link android.widget.AdapterView} 

</p>

<dl>
  <dt>{@link android.widget.ArrayAdapter}</dt>
    <dd>{@link
android.widget.ArrayAdapter}  {@link
java.lang.Object#toString()}  {@link
android.widget.TextView} 
      <p> {@link
android.widget.ListView}  {@link android.widget.ArrayAdapter}
</p>
<pre>
ArrayAdapter&lt;String> adapter = new ArrayAdapter&lt;String>(this,
        android.R.layout.simple_list_item_1, myStringArray);
</pre>
<p></p>
<ul>
  <li> {@link android.content.Context}</li>
  <li> {@link android.widget.TextView} </li>
  <li></li>
</ul>
<p> {@link android.widget.ListView} 
{@link android.widget.ListView#setAdapter setAdapter()}</p>
<pre>
ListView listView = (ListView) findViewById(R.id.listview);
listView.setAdapter(adapter);
</pre>

      <p> {@link
java.lang.Object#toString()}  {@link android.widget.TextView}  ( {@link android.widget.ImageView}) {@link
android.widget.ArrayAdapter}  {@link android.widget.ArrayAdapter#getView
getView()}

</p>

</dd>

  <dt>{@link android.widget.SimpleCursorAdapter}</dt>
    <dd> {@link android.database.Cursor}
{@link android.widget.SimpleCursorAdapter}  {@link android.database.Cursor}  {@link android.database.Cursor} 

 {@link
android.database.Cursor}

 {@link
android.database.Cursor} 
</p>
<pre>
String[] fromColumns = {ContactsContract.Data.DISPLAY_NAME,
                        ContactsContract.CommonDataKinds.Phone.NUMBER};
int[] toViews = {R.id.display_name, R.id.phone_number};
</pre>
<p> {@link android.widget.SimpleCursorAdapter}  {@link android.database.Cursor}
</p>
<pre>
SimpleCursorAdapter adapter = new SimpleCursorAdapter(this,
        R.layout.person_name_and_number, cursor, fromColumns, toViews, 0);
ListView listView = getListView();
listView.setAdapter(adapter);
</pre>
<p>{@link android.widget.SimpleCursorAdapter}  {@code
fromColumns}  {@code toViews} 
{@link android.database.Cursor} </p>.</dd>
</dl>


<p> {@link android.widget.ArrayAdapter#notifyDataSetChanged()}

</p>



<h3 id="HandlingUserSelections"></h3>

<p> {@link android.widget.AdapterView.OnItemClickListener}  {@link android.widget.AdapterView} 
</p>

<pre>
// Create a message handling object as an anonymous class.
private OnItemClickListener mMessageClickedHandler = new OnItemClickListener() {
    public void onItemClick(AdapterView parent, View v, int position, long id) {
        // Do something in response to the click
    }
};

listView.setOnItemClickListener(mMessageClickedHandler);
</pre>