用Fragments建立动态UI(翻译)

有感于看了许多文章但最后都会忘得一干二净,遂将所看整理一下记录下来,但愿能加深印象,也但愿对读者略有帮助。html

此处为翻译文章 原文连接 : http://developer.android.com/training/basics/fragments/index.htmljava


建立一个fragment 

咱们能够将fragment看作是activity的一个模块化部分,他有本身的生命周期,接收本身的交互事件,而且当这个activity正在运行时,你也能够添加和删除这个模块,有点像是子activity,可是你却能够在不一样的activities中重用它。
android

(若是你的app要求api级别>= 11,那你就能够直接使用android 框架内置的fragment,无需在使用支持库中的fragment)。api


建立一个fragment 类

  经过继承fragment能够建立fragment类,而且实现其中的一些关键生命周期方法来插入本身app的逻辑代码,基本和activity相同。app

其中一处不一样是,当建立一个fragment时,你须要回调onCreateView() 方法来定义本身的布局框架

 

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.ViewGroup;

public class ArticleFragment extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
        Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.article_view, container, false);
    }
}


下面说说怎么在activity中使用Fragmentide

经过xml添加fragment到activity中

  尽管fragment是一个重复可见模块化的UI组件,可是每个fragment必须和一个fragmentactivity类相关联才能使用,你能够得到这种关联性经过在一个activity的xml布局文件中定义fragment。模块化

(当你只支持api 11 以上的级别时,只须要和activity关联便可)布局

   这里有个例子优化

    

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <fragment android:name="com.example.android.fragments.HeadlinesFragment"
              android:id="@+id/headlines_fragment"
              android:layout_weight="1"
              android:layout_width="0dp"
              android:layout_height="match_parent" />

    <fragment android:name="com.example.android.fragments.ArticleFragment"
              android:id="@+id/article_fragment"
              android:layout_weight="2"
              android:layout_width="0dp"
              android:layout_height="match_parent" />

</LinearLayout>

  

 而后是在activity中使用这个布局 

import android.os.Bundle;
import android.support.v4.app.FragmentActivity;

public class MainActivity extends FragmentActivity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.news_articles);
    }
}


注意 :  当你经过xml布局把一个fragment加入到activity时,你没法在运行时将fragment移除,若是你想要在运行时灵活的加入或移除fragment,你必须在activity第一次启动时将fragment加入到activity。


建立灵活的UI

当你设计app时可能须要支持普遍的屏幕尺寸,你能够重用fragment在不一样的布局配置中来优化用户体验,基于可用的屏幕尺寸。

例如,手机设备为了更好地用户体验可能更适合一次显示一个fragment。相反,你可能想要并行的显示两个fragment在一个平板上,由于平板有更宽的屏幕来向用户展现更多的信息。

 FragmentManager提供了许多方法来操做fragment,包括添加、移除、替换等等,这些能够保证一个良好的用户体验。

在activity运行时添加一个fragment

并非在activity的布局里定义一个fragment,而是在activity运行时添加一个fragment,这是必要的,若是你打算在activity的生命周期内改变fragments。

为了执行一个操做,你必须使用FragmentMananger来建立一个FragmentTrasaction,它提供了添加、移除或其余一些操做fragment的方法。

若是你的fragment容许被移除或替换,你应该在activity的onCreate ()方法中初始化一个fragment。

处理fragment尤为是在运行时添加一个fragment的重要规则是,你必需要有一个容器来让你存放fragment。

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/fragment_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

在activity里面,若是你用的是支持库的apis调用getSupportFragmentManager()来获取FragmentManager,而后调用beginTransaction()来建立一个FragmentTransaction,而后在调用add()方法来添加一个fragment.

你能够经过一个FragmentTransaction来操做多个fragment,当你准备作改变的时候,你须要调用commit()方法。

import android.os.Bundle;
import android.support.v4.app.FragmentActivity;

public class MainActivity extends FragmentActivity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.news_articles);

        // Check that the activity is using the layout version with
        // the fragment_container FrameLayout
        if (findViewById(R.id.fragment_container) != null) {

            // However, if we're being restored from a previous state,
            // then we don't need to do anything and should return or else
            // we could end up with overlapping fragments.
            if (savedInstanceState != null) {
                return;
            }

            // Create a new Fragment to be placed in the activity layout
            HeadlinesFragment firstFragment = new HeadlinesFragment();
            
            // In case this activity was started with special instructions from an
            // Intent, pass the Intent's extras to the fragment as arguments
            firstFragment.setArguments(getIntent().getExtras());
            
            // Add the fragment to the 'fragment_container' FrameLayout
            getSupportFragmentManager().beginTransaction()
                    .add(R.id.fragment_container, firstFragment).commit();
        }
    }
}


替换fragment

   替换的过程和添加相似,使用的是replace()方法。

  当你操做fragment的时候,你应该考虑用户的向后导航操做,好比移除和替换操做。为了实现向后导航操做,当你commit() FragmentTransaction.以前,应该先调用addToBackStack()方法。

  当你移除或替换一个fragment的时候,同时你把它添加到了back stack中,这个被移除或替换的fragment只是被stop 而不是被destroy了,当用户执行向后导航操做时,这个fragment将被从新启动。若是你没有把它添加到back stack 中,这个fragment将被destroy。

   

ArticleFragment newFragment = new ArticleFragment();
Bundle args = new Bundle();
args.putInt(ArticleFragment.ARG_POSITION, position);
newFragment.setArguments(args);

FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();

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

// Commit the transaction
transaction.commit();


addToBackStack()方法接收一个字符串做为参数,它用来标识一个事务,但这个参数不是必须的。除非你想执行更高级的fragment操做,经过FragmentManager.BackStackEntry APIs.

fragments之间的通讯

    为了重用fragment,你应该创建每个彻底自包含的模块化组件,他们定义了本身的布局和行为。一旦你建立了这些fragments,你就能够将这些fragments与activity联系起来,经过应用逻辑来最终实现一个组合的UI。

   也许你常常想要一个fragment同另外一个通讯,好比须要根据用户的行为来改变内容。全部的fragment到fragment的通讯是经过关联的activity实现的,两个fragment之间毫不应该直接通讯的。

   定义一个接口

      为了实现fragment和activity之间的通讯,能够在fragment中定义一个接口,在activity中实现这个接口。fragment捕获这个接口的实如今它的onAttach()生命周期方法中,而后调用这个接口方法来实现和activity的通讯。

       example following: 

       

public class HeadlinesFragment extends ListFragment {
    OnHeadlineSelectedListener mCallback;

    // Container Activity must implement this interface
    public interface OnHeadlineSelectedListener {
        public void onArticleSelected(int position);
    }

    @Override
    public void onAttach(Activity activity) {
        super.onAttach(activity);
        
        // This makes sure that the container activity has implemented
        // the callback interface. If not, it throws an exception
        try {
            mCallback = (OnHeadlineSelectedListener) activity;
        } catch (ClassCastException e) {
            throw new ClassCastException(activity.toString()
                    + " must implement OnHeadlineSelectedListener");
        }
    }
    
    ...
}

     如今这个fragment能够和activity之间通讯了,经过调用onArticleSelected()方法(或者接口中的其余方法)。

     例以下面的方法将list的点击事件传递给父activity。

   @Override
    public void onListItemClick(ListView l, View v, int position, long id) {
        // Send the event to the host activity
        mCallback.onArticleSelected(position);
    }

     实现接口

    为了从fragment中接收事件回调,承接fragment的activity必须实现这个fragment中的接口,

public static class MainActivity extends Activity
        implements HeadlinesFragment.OnHeadlineSelectedListener{
    ...
    
    public void onArticleSelected(int position) {
        // The user selected the headline of an article from the HeadlinesFragment
        // Do something here to display that article
    }
}

     向fragment传输消息

      承接的activity能够向fragment传递消息经过捕获fragment的实例,能够经过findFragmentById()来捕获fragment实例,而后直接调用fragment的公共方法。

      例如,想象一下,展现在上面的activity可能包含一个fragment,而这个fragment展现的内容依赖于activity回调方法所返回的数据。在这种状况下,这个activity能够传递接收到的数据给这个fragment,以此来展现内容。

public static class MainActivity extends Activity
        implements HeadlinesFragment.OnHeadlineSelectedListener{
    ...

    public void onArticleSelected(int position) {
        // The user selected the headline of an article from the HeadlinesFragment
        // Do something here to display that article

        ArticleFragment articleFrag = (ArticleFragment)
                getSupportFragmentManager().findFragmentById(R.id.article_fragment);

        if (articleFrag != null) {
            // If article frag is available, we're in two-pane layout...

            // Call a method in the ArticleFragment to update its content
            articleFrag.updateArticleView(position);
        } else {
            // Otherwise, we're in the one-pane layout and must swap frags...

            // Create fragment and give it an argument for the selected article
            ArticleFragment newFragment = new ArticleFragment();
            Bundle args = new Bundle();
            args.putInt(ArticleFragment.ARG_POSITION, position);
            newFragment.setArguments(args);
        
            FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();

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

            // Commit the transaction
            transaction.commit();
        }
    }
}
相关文章
相关标签/搜索