guide/components/fragments.jd

page.title=
parent.title=
parent.link=activities.html
@jd:body

<div id="qv-wrapper">
<div id="qv">
  <h2>  </h2>
  <ol>
    <li><a href="#Design"> </a></li>
    <li><a href="#Creating"> </a>
      <ol>
        <li><a href="#UI">  </a></li>
        <li><a href="#Adding">  </a></li>
      </ol>
    </li>
    <li><a href="#Managing"> </a></li>
    <li><a href="#Transactions">  </a></li>
    <li><a href="#CommunicatingWithActivity"> </a>
      <ol>
        <li><a href="#EventCallbacks">   </a></li>
        <li><a href="#ActionBar">   </a></li>
      </ol>
    </li>
    <li><a href="#Lifecycle">   </a>
      <ol>
        <li><a href="#CoordinatingWithActivity">   </a></li>
      </ol>
    </li>
    <li><a href="#Example"></a></li>
  </ol>

  <h2>Key </h2>
  <ol>
    <li>{@link android.app.Fragment}</li>
    <li>{@link android.app.FragmentManager}</li>
    <li>{@link android.app.FragmentTransaction}</li>
  </ol>

  <h2> </h2>
  <ol>
    <li><a href="{@docRoot}training/basics/fragments/index.html">  UI </a></li>
    <li><a href="{@docRoot}guide/practices/tablets-and-handsets.html">
  </a></li>
  </ol>
</div>
</div>

<p>{@link android.app.Fragment}
{@link android.app.Activity}     .
    UI   ,       .     ,    ,

 (
   " "  ).</p>

<p>
      .     ,
      .
(<em></em> <a href="{@docRoot}guide/components/activities.html#Lifecycle">  </a>   )
         .

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

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

   {@code &lt;fragment&gt;}  ,
 {@link android.view.ViewGroup}  .
     .  UI
     .</p>

<p>
.            ,

       .</p>


<h2 id="Design"> </h2>

<p>Android     Android 3.0(API  11).
       UI    .
     UI
 .
      .

    .</p>

<p>
              .
    ,
      . ,

    .   1    .</p>

<p>            .
 ,
      .
         .
             .
  ,
     .
    UI    .
 .</p>

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

  .</p>

<p> &mdash;    &mdash;      ,
  <em> A</em>       .
          .
 <em> A</em>     ,
<em> B</em> .        .

( 1 ).</p>

<p>
<a href="{@docRoot}guide/practices/tablets-and-handsets.html">   </a>   .</p>


<h2 id="Creating"> </h2>

<div class="figure" style="width:327px">
<img src="{@docRoot}images/fragment_lifecycle.png" alt="" />
<p class="img-caption"><strong> 2.</strong>   (
    ).</p>
</div>

<p>  {@link android.app.Fragment}  (
 )  . {@link android.app.Fragment}
{@link android.app.Activity}     .       .
  {@link android.app.Fragment#onCreate onCreate()}, {@link android.app.Fragment#onStart onStart()},
{@link android.app.Fragment#onPause onPause()}  {@link android.app.Fragment#onStop onStop()} . ,
 Android

  .</p>

<p>        .</p>

<dl>
  <dt>{@link android.app.Fragment#onCreate onCreate()}</dt>
  <dd>     .

 .</dd>
  <dt>{@link android.app.Fragment#onCreateView onCreateView()}</dt>
  <dd>
 .   UI   {@link android.view.View}  .
    .  UI    null
.</dd>
  <dt>{@link android.app.Activity#onPause onPause()}</dt>
  <dd>
  (       ).
        (
    ).</dd>
</dl>

<p>
 ,
 .
<a href="#Lifecycle">   </a>     .</p>


<p>,  {@link
android.app.Fragment}           .</p>

<dl>
  <dt>{@link android.app.DialogFragment}</dt>
  <dd>   .
{@link android.app.Activity}
  .            ,
       .</dd>

  <dt>{@link android.app.ListFragment}</dt>
  <dd>   (: {@link
android.widget.SimpleCursorAdapter}) , {@link android.app.ListActivity} .
         .   {@link
android.app.ListFragment#onListItemClick(ListView,View,int,long) onListItemClick()}
     .</dd>

  <dt>{@link android.preference.PreferenceFragment}</dt>
  <dd>{@link android.preference.Preference}    ,
{@link android.preference.PreferenceActivity} .
  ""    .</dd>
</dl>


<h3 id="UI">  </h3>

<p>
    .</p>

<p>     {@link
android.app.Fragment#onCreateView onCreateView()}    .
       Android   .
{@link android.view.View}  .    .</p>

<p class="note"><strong>:</strong>  {@link
android.app.ListFragment}   ,
{@link android.app.Fragment#onCreateView onCreateView()} {@link android.widget.ListView}     .</p>

<p>{@link
android.app.Fragment#onCreateView onCreateView()}    XML  <a href="{@docRoot}guide/topics/resources/layout-resource.html"> </a>  .
{@link android.app.Fragment#onCreateView onCreateView()}
{@link android.view.LayoutInflater}  .</p>

<p>   {@link android.app.Fragment}  .
{@code example_fragment.xml}   .</p>

<pre>
public static class ExampleFragment extends Fragment {
    &#64;Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.example_fragment, container, false);
    }
}
</pre>

<div class="sidebox-wrapper">
<div class="sidebox">
  <h3> </h3>
  <p>  {@code R.layout.example_fragment}
   {@code example_fragment.xml}    .
XML     <a href="{@docRoot}guide/topics/ui/index.html"> </a>
  .</p>
</div>
</div>

<p>{@link android.app.Fragment#onCreateView
onCreateView()}  {@code container}   {@link android.view.ViewGroup}( ),
    .
 {@code savedInstanceState}   {@link android.os.Bundle},

(   <a href="#Lifecycle">
</a>   ).</p>

<p>{@link android.view.LayoutInflater#inflate(int,ViewGroup,boolean) inflate()}
     .</p>
<ul>
  <li>    ID.</li>
  <li>    {@link android.view.ViewGroup}. {@code
container}
     .</li>
  <li>    {@link
android.view.ViewGroup}(  )      ( ,
 .     {@code
container}    .         ).</li>
</ul>

<p>       .
  .</p>


<h3 id="Adding">  </h3>

<p>  UI    .
     .
.</p>

<ul>
  <li><b>     .</b>
<p> ,
    .
      .</p>
<pre>
&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent"&gt;
    &lt;fragment android:name="com.example.news.ArticleListFragment"
            android:id="@+id/list"
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="match_parent" /&gt;
    &lt;fragment android:name="com.example.news.ArticleReaderFragment"
            android:id="@+id/viewer"
            android:layout_weight="2"
            android:layout_width="0dp"
            android:layout_height="match_parent" /&gt;
&lt;/LinearLayout&gt;
</pre>
  <p>{@code &lt;fragment&gt;}  {@code android:name}     {@link
android.app.Fragment}  .</p>

<p>
{@link android.app.Fragment#onCreateView onCreateView()}
    .    {@link android.view.View}
{@code &lt;fragment&gt;}    .</p>

<div class="note">
  <p><strong>:</strong>
         (,
        ).  ID
     .</p>
  <ul>
    <li> ID  {@code android:id}  .</li>
    <li>   {@code android:tag}  .</li>
    <li>       ,    ID
.</li>
  </ul>
</div>
  </li>

  <li><b>,     {@link android.view.ViewGroup} .</b>
<p>          .
{@link
android.view.ViewGroup}   .</p>
  <p>    ( ,
 ), {@link android.app.FragmentTransaction}  API  .
{@link android.app.FragmentTransaction}  {@link android.app.Activity}    .</p>

<pre>
FragmentManager fragmentManager = {@link android.app.Activity#getFragmentManager()}
FragmentTransaction fragmentTransaction = fragmentManager.{@link android.app.FragmentManager#beginTransaction()};
</pre>

<p>  {@link
android.app.FragmentTransaction#add(int,Fragment) add()}    ,
  . :</p>

<pre>
ExampleFragment fragment = new ExampleFragment();
fragmentTransaction.add(R.id.fragment_container, fragment);
fragmentTransaction.commit();
</pre>

  <p>{@link android.app.FragmentTransaction#add(int,Fragment) add()}
   {@link android.view.ViewGroup}.
   ID     ,     .</p>
  <p>
{@link android.app.FragmentTransaction}  ,
{@link android.app.FragmentTransaction#commit}    .</p>
  </li>
</ul>


<h4 id="AddingWithoutUI">UI   </h4>

<p>  UI       .
 UI
.</p>

<p>UI       {@link
android.app.FragmentTransaction#add(Fragment,String)}  (,
 ID   "" ).    ,
          {@link
android.app.Fragment#onCreateView onCreateView()}   .      .</p>

<p>         UI    . UI
     .
UI       .
   , {@link android.app.FragmentManager#findFragmentByTag
findFragmentByTag()}  .</p>

<p>    UI      .   {@code
FragmentRetainInstance.java}
 SDK   (Android SDK Manager   ),
<code>&lt;sdk_root&gt;/APIDemos/app/src/main/java/com/example/android/apis/app/FragmentRetainInstance.java</code>   .</p>


<h2 id="Managing"> </h2>

<p>    {@link android.app.FragmentManager}  .
  {@link android.app.Activity#getFragmentManager()} .</p>

<p>{@link android.app.FragmentManager}            .</p>

<ul>
  <li>    {@link
android.app.FragmentManager#findFragmentById findFragmentById()} (
UI   )  {@link android.app.FragmentManager#findFragmentByTag
findFragmentByTag()} (UI     ).</li>
  <li>   {@link
android.app.FragmentManager#popBackStack()}   (  <em></em>  ).</li>
  <li>       {@link
android.app.FragmentManager#addOnBackStackChangedListener addOnBackStackChangedListener()}  .</li>
</ul>

<p>          {@link
android.app.FragmentManager}    .</p>

<p>     {@link android.app.FragmentManager}
 {@link android.app.FragmentTransaction}
   .            .</p>


<h2 id="Transactions">  </h2>

<p>           ,
,        .
     .   {@link
android.app.FragmentTransaction}  API  .
  .           (
   ).</p>

<p>{@link android.app.FragmentTransaction}  {@link
android.app.FragmentManager}    .</p>

<pre>
FragmentManager fragmentManager = {@link android.app.Activity#getFragmentManager()};
FragmentTransaction fragmentTransaction = fragmentManager.{@link android.app.FragmentManager#beginTransaction()};
</pre>

<p>         .
        {@link
android.app.FragmentTransaction#add add()}, {@link android.app.FragmentTransaction#remove remove()},
 {@link android.app.FragmentTransaction#replace replace()}    .  ,
    {@link android.app.FragmentTransaction#commit()}  .</p>
</dl>

<p> {@link
android.app.FragmentTransaction#commit()}       .  {@link
android.app.FragmentTransaction#addToBackStack addToBackStack()}.
         .     ,
        .  <em></em>   .</p>

<p>
 .</p>

<pre>
// Create new fragment and transaction
Fragment newFragment = new ExampleFragment();
FragmentTransaction transaction = getFragmentManager().beginTransaction();

// Replace whatever is in the fragment_container view with this fragment,
// and add the transaction to the back stack
transaction.replace(R.id.fragment_container, newFragment);
transaction.addToBackStack(null);

// Commit the transaction
transaction.commit();
</pre>

<p>  {@code newFragment}
( ) .  {@code R.id.fragment_container} ID   . {@link
android.app.FragmentTransaction#addToBackStack addToBackStack()}
  ,
     . <em></em>   .</p>

<p>    (    {@link
android.app.FragmentTransaction#add add()}  {@link android.app.FragmentTransaction#remove
remove()}) {@link
android.app.FragmentTransaction#addToBackStack addToBackStack()} , {@link android.app.FragmentTransaction#commit commit()}
    , <em></em>
   .</p>

<p>{@link android.app.FragmentTransaction}      .
    .</p>
<ul>
  <li>{@link android.app.FragmentTransaction#commit()}   .</li>
  <li>      ,
     .</li>
</ul>

<p>    {@link android.app.FragmentTransaction#addToBackStack(String)
addToBackStack()}   ,
           .
  {@link android.app.FragmentTransaction#addToBackStack(String) addToBackStack()} ,
  <em></em>
.</p>

<p class="note"><strong>:</strong>
  {@link android.app.FragmentTransaction#setTransition setTransition()}
 .</p>

<p>{@link android.app.FragmentTransaction#commit()}
. ,  UI ("" )
      .    UI  {@link
android.app.FragmentManager#executePendingTransactions()}
{@link android.app.FragmentTransaction#commit()}      .
           .</p>

<p class="caution"><strong>:</strong>    {@link
android.app.FragmentTransaction#commit commit()}     <a href="{@docRoot}guide/components/activities.html#SavingActivityState">
</a> (   ).
.
 .    , {@link
android.app.FragmentTransaction#commitAllowingStateLoss()} .</p>


<h2 id="CommunicatingWithActivity"> </h2>

<p>{@link android.app.Fragment}
{@link android.app.Activity}            ,
         .</p>

<p> ,   {@link
android.app.Fragment#getActivity()}  {@link android.app.Activity}
          .</p>

<pre>
View listView = {@link android.app.Fragment#getActivity()}.{@link android.app.Activity#findViewById findViewById}(R.id.list);
</pre>

<p> ,       .  {@link android.app.FragmentManager}
{@link android.app.Fragment}    ,  {@link
android.app.FragmentManager#findFragmentById findFragmentById()}  {@link
android.app.FragmentManager#findFragmentByTag findFragmentByTag()} . :</p>

<pre>
ExampleFragment fragment = (ExampleFragment) getFragmentManager().findFragmentById(R.id.example_fragment);
</pre>


<h3 id="EventCallbacks">   </h3>

<p>          .

 .     ,
    .</p>

<p>          .
    ( A)     ( B)
 A    B      .  ,
{@code OnArticleSelectedListener}   A  .</p>

<pre>
public static class FragmentA extends ListFragment {
    ...
    // Container Activity must implement this interface
    public interface OnArticleSelectedListener {
        public void onArticleSelected(Uri articleUri);
    }
    ...
}
</pre>

<p>    {@code OnArticleSelectedListener}

 {@code onArticleSelected()}   A
 B .
   A {@link
android.app.Fragment#onAttach onAttach()}  (      ) {@code OnArticleSelectedListener}   .  {@link android.app.Fragment#onAttach
onAttach()}   {@link android.app.Activity}
  .</p>

<pre>
public static class FragmentA extends ListFragment {
    OnArticleSelectedListener mListener;
    ...
    &#64;Override
    public void onAttach(Activity activity) {
        super.onAttach(activity);
        try {
            mListener = (OnArticleSelectedListener) activity;
        } catch (ClassCastException e) {
            throw new ClassCastException(activity.toString() + " must implement OnArticleSelectedListener");
        }
    }
    ...
}
</pre>

<p>    ,
{@link java.lang.ClassCastException} .
 , {@code mListener}
{@code OnArticleSelectedListener}    ,  A     .
 {@code OnArticleSelectedListener}      .    A
{@link android.app.ListFragment}  ,
        {@link android.app.ListFragment#onListItemClick
onListItemClick()} ,   {@code onArticleSelected()}
    .</p>

<pre>
public static class FragmentA extends ListFragment {
    OnArticleSelectedListener mListener;
    ...
    &#64;Override
    public void onListItemClick(ListView l, View v, int position, long id) {
        // Append the clicked item's row ID with the content provider Uri
        Uri noteUri = ContentUris.{@link android.content.ContentUris#withAppendedId withAppendedId}(ArticleColumns.CONTENT_URI, id);
        // Send the event and Uri to the host activity
        mListener.onArticleSelected(noteUri);
    }
    ...
}
</pre>

<p>{@link
android.app.ListFragment#onListItemClick onListItemClick()}  {@code id}     ID,
(  )    {@link
android.content.ContentProvider}  .</p>

<p><!--To see a complete implementation of this kind of callback interface, see the <a
href="{@docRoot}resources/samples/NotePad/index.html">NotePad sample</a>. -->
<a href="{@docRoot}guide/topics/providers/content-providers.html"> </a>    .</p>


<h3 id="ActionBar">   </h3>

<p>  <a href="{@docRoot}guide/topics/ui/menus.html#options-menu"> </a>( <a href="{@docRoot}guide/topics/ui/actionbar.html"> </a>)     .
{@link android.app.Fragment#onCreateOptionsMenu(Menu,MenuInflater) onCreateOptionsMenu()}   .
  , {@link
android.app.Fragment#onCreate(Bundle) onCreate()}  {@link
android.app.Fragment#setHasOptionsMenu(boolean) setHasOptionsMenu()}
       (
{@link android.app.Fragment#onCreateOptionsMenu onCreateOptionsMenu()}    ).</p>

<p>
.      {@link
android.app.Fragment#onOptionsItemSelected(MenuItem) onOptionsItemSelected()}
 .</p>

<p>          .  {@link
android.app.Fragment#registerForContextMenu(View) registerForContextMenu()}  .    ,
  {@link
android.app.Fragment#onCreateContextMenu(ContextMenu,View,ContextMenu.ContextMenuInfo)
onCreateContextMenu()}  .    ,   {@link
android.app.Fragment#onContextItemSelected(MenuItem) onContextItemSelected()}  .</p>

<p class="note"><strong>:</strong>       ' '
  ,
.   ' '      ,
    .
     .</p>

<p>     <a href="{@docRoot}guide/topics/ui/menus.html"></a>  <a href="{@docRoot}guide/topics/ui/actionbar.html"> </a>   .</p>


<h2 id="Lifecycle">   </h2>

<div class="figure" style="width:350px">
<img src="{@docRoot}images/activity_fragment_lifecycle.png" alt="" />
<p class="img-caption"><strong> 3.</strong>
.</p>
</div>

<p>           .
      .</p>

<dl>
  <dt><i></i></dt>
    <dd>    .</dd>

  <dt><i></i></dt>
    <dd>          ,
      (
   ).</dd>

  <dt><i></i></dt>
    <dd>  .
     .
  (      ). ,
       .</dd>
</dl>

<p>  ,    {@link
android.os.Bundle} .
            .    {@link
android.app.Fragment#onSaveInstanceState onSaveInstanceState()}     ,
{@link android.app.Fragment#onCreate onCreate()}, {@link
android.app.Fragment#onCreateView onCreateView()}  {@link
android.app.Fragment#onActivityCreated onActivityCreated()}        .
<a href="{@docRoot}guide/components/activities.html#SavingActivityState"></a>
 .</p>

<p>
    .
      (  <em></em>
   .   <a href="{@docRoot}guide/components/tasks-and-back-stack.html">   </a> ).
,               .
     {@link
android.app.FragmentTransaction#addToBackStack(String) addToBackStack()}
.</p>

<p> ,
 . , <a href="{@docRoot}guide/components/activities.html#Lifecycle">
  </a>      .        . ,
        .</p>

<p class="caution"><strong>:</strong> {@link android.app.Fragment}  {@link android.content.Context}
  , {@link android.app.Fragment#getActivity()}  .
 {@link android.app.Fragment#getActivity()}
    .          ,
{@link android.app.Fragment#getActivity()} null .</p>


<h3 id="CoordinatingWithActivity">   </h3>

<p>
 .
.    {@link android.app.Activity#onPause} ,
     {@link android.app.Fragment#onPause} .</p>

<p>        .
     UI
 .        .</p>

<dl>
  <dt>{@link android.app.Fragment#onAttach onAttach()}</dt>
    <dd>     ( {@link
android.app.Activity} ).</dd>
  <dt>{@link android.app.Fragment#onCreateView onCreateView()}</dt>
    <dd>      .</dd>
  <dt>{@link android.app.Fragment#onActivityCreated onActivityCreated()}</dt>
    <dd> {@link android.app.Activity#onCreate
onCreate()}   .</dd>
  <dt>{@link android.app.Fragment#onDestroyView onDestroyView()}</dt>
    <dd>       .</dd>
  <dt>{@link android.app.Fragment#onDetach onDetach()}</dt>
    <dd>      .</dd>
</dl>

<p>         3
.
         .     {@link
android.app.Activity#onCreate onCreate()}   ,
{@link android.app.Fragment#onActivityCreated onActivityCreated()}   .</p>

<p>
 . ,
    .</p>

<p>
.</p>


<h2 id="Example"></h2>

<p>         ,
        .
      ,
   .
.</p>

<p class="note"><strong>:</strong>
<a href="{@docRoot}resources/samples/ApiDemos/src/com/example/android/apis/app/FragmentLayout.html">{@code
FragmentLayout.java}</a>   .</p>

<p>  {@link
android.app.Activity#onCreate onCreate()}     .</p>

{@sample development/samples/ApiDemos/src/com/example/android/apis/app/FragmentLayout.java main}

<p>  {@code fragment_layout.xml}.</p>

{@sample development/samples/ApiDemos/res/layout-land/fragment_layout.xml layout}

<p>       {@code TitlesFragment} (
 ).  {@link android.widget.FrameLayout}
(     )
       .    ,
    {@link android.widget.FrameLayout}  .</p>

<p>
  .        ,
 {@code res/layout-land/fragment_layout.xml}  .</p>

<p>     ,    .
{@code res/layout/fragment_layout.xml}  .</p>

{@sample development/samples/ApiDemos/res/layout/fragment_layout.xml layout}

<p>  {@code TitlesFragment}  .
    .        ,

 .</p>

<p>,      .   {@code
TitlesFragment},      .   {@link
android.app.ListFragment}         .</p>

<p>
   .
            ( {@link
android.widget.FrameLayout} ),     (    ).</p>

{@sample development/samples/ApiDemos/src/com/example/android/apis/app/FragmentLayout.java titles}

<p>   {@code DetailsFragment} {@code TitlesFragment}
 .</p>

{@sample development/samples/ApiDemos/src/com/example/android/apis/app/FragmentLayout.java details}

<p>{@code TitlesFragment}     ,
  {@code R.id.details}   <em></em> (
{@code DetailsFragment}  ),      {@code DetailsActivity}
   .</p>

<p>             {@code DetailsFragment}
   {@code DetailsActivity}.</p>

{@sample development/samples/ApiDemos/src/com/example/android/apis/app/FragmentLayout.java
details_activity}

<p>          .
     {@code DetailsFragment} {@code TitlesFragment}     .
     {@code DetailsActivity}
     (   )   .</p>


<p>     (      )
<a href="{@docRoot}resources/samples/ApiDemos/src/com/example/android/apis/app/index.html#Fragment">
ApiDemos</a>    API Demos   (<a href="{@docRoot}resources/samples/get.html"> SDK  </a>   ).</p>