可是如果在平板上也这么设计，那么新闻标题列表将会被拉长至填充满整个平板的屏幕，而 新闻的标题一般都不会太长，这样将会导致界面上有大量的空白区域，如图4.2所示。

News类的代码还是比较简单的，title字段表示新闻标题，content字段表示新闻内容。 接着新建布局文件news_content_frag.xml,用于作为新闻内容的布局：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android: ■tayout_width="match_parent" android:layout_height="match_parent">

<LinearLayout

android:id="@+id/visibility_layout"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical"

android:visibility="invisible" >

<TextView

android:id="@+id/news_title"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:gravity="center"

android:padding="10dp"

android:textSize="20sp" />

<View

android:layout_width="match_parent"

android:layout_height="ldp"

android: background=,,#000" />

<TextView

and roid: id="(a+id/news_content"

android:layout_width="match_parent"

android:layout_height="0dp"

android:layout_weight="l"

android:padding="15dp" android:textSize="18sp" />

</LinearLayout>

<View

android:layout_width="ldp" android:layout_height="match_parent" android:layout_alignParentLeft="true" android:background="#000" />

</RelativeLayout>

新闻内容的布局主要可以分为两个部分，头部部分显示新闻标题，正文部分显示新闻内容， 中间使用一条细线分隔开。这里的细线是利用View来实现的，将View的宽或高设置为ldp,再 通过background属性给细线设置一下颜色就可以了。这里我们把细线设置成黑色。

然后再新建一个NewsContentFragment类，继承自Fragment,代码如下所示：

public class NewsContentFragment extends Fragment (

private View view;

(QOverride

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedlnstanceState) (

view = inflater.inflate(R.layout.newscontentfrag, container, false); return view;

}

public void refresh(String newsTitle, String newsContent) {

View visibilityLayout = view.findViewById(R.id.visibilitylayout); visibilityLayout.setvisibility(View.VISIBLE);

Textview newsTitleText = (Textview) view.findViewByld (R.id.newstitle); Textview newsContentText = (Textview) view.findViewById(R.id.newscontent); newsTitleText. setText (newsTitle); // 刷新新闻的标题 newsContentText. setText (newsContent); // 刷新新闻的内容

}

}

首先在onCreateView()方法里加载了我们刚刚创建的news content frag布局，这个没什么 好解释的。接下来又提供了一个refreshO方法，这个方法就是用于将新闻的标题和内容显示在 界面上的。可以看到，这里通过findViewByldO方法分别获取到新闻标题和内容的控件，然后 将方法传递进来的参数设置进去。

这样我们就把新闻内容的碎片和布局都创建好了，但是它们都是在双页模式中使用的，如果 想在单页模式中使用的话，我们还需要再仓U建一个活动。右击com.example.fragmentbestpractice 包—New —>ActivityEmpty Activity ,新建一个 NewsContentActivity ,并将布局名指定成 news content,然后修改news content.xml中的代码，如下所示:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_pa rent" android:layout_height="matchparent">

<fragment

android:id=”@+id/news_content_f「agment”

android:name="com.example.fragmentbestpractice.NewsContentFragment" android:layout_width="match_parent"

android :layout_height=,lmatch_parent"

/> ~

v/Linea「Layout〉

这里我们充分发挥了代码的复用性，直接在布局中引入了 NewsContentFragment,这样也 就相当于把news content frag布局的内容自动加了进来。

然后修改NewsContentActivity中的代码，如下所示：

public class NewsContentActivity extends AppCompatActivity {

public static void actionstart(Context context, String newsTitle, String newsContent) {

Intent intent = new Intent(context, NewsContentActivity.class);

intent.putExtra("newstitle", newsTitle);

intent.putExtra("news content", newsContent); context.startActivity(intent);

}

@0verride protected void onCreate(Bundle savedlnstanceState) { super.onCreate(savedlnstanceState); setContentView(R.layout.newscontent);

String newsTitle = getlntent?) .getStringExtraf "news title"); // 获取传入的新 闻标题 —

String newsContent = getlntent().getStringExtra( "news content"); // 获取传入 的新闻内容

NewsContentFragment newsContentFragment = (NewsContentFragment) getSupportFragmentManager().findFragmentById(R.id.newscontentf ragment); newsContentFragment.ref resh(newsTitle, newsContent); //刷新 NewsContentFragment 界面

}

}

可以看到，在onCreateO方法中我们通过Intent获取到了传入的新闻标题和新闻内容，然 后调用 FragmentManager 的 findFragmentById()方法得到了 NewsContentFragment 的实例， 接着调用它的refreshO方法，并将新闻的标题和内容传入，就可以把这些数据显示出来了。注 意这里我们还提供了一个actionStartO方法，还记得它的作用吗？如果忘记的话就再去阅读 一遍2.6.3小节卩巴。

接下来还需要再创建一个用于显示新闻列表的布局，新建news title frag.xml,代码如下 所示：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:orientation="vertical"

android:layout_width="match_parent"

android: layout_height="inatch_parent,,>

<android.support.v7.widget.RecyclerView

android: id="(a+id/news_title_recycler_view"

android:layout_width="matchparent" android:layout_height="match_pa rent" /> ~ ~

</LinearLayout>

这个布局的代码就非常简单了，里面只有一个用于显示新闻列表的RecyclerViewo既然要用 到RecyclerView,那么就必定少不了子项的布局。新建news item.xml作为RecyclerView子项的 布局，代码如下所示：

<TextView xmlns:android="http://schemas.android.com/apk/res/android"

android:id="@+id/news_title"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:singleLine="true"

android:ellipsize="end"

android:textSize="18sp"

android:paddingLeft="10dp"

android:paddingRight="10dp"

android:paddingTop="15dp" android:paddingBottom="15dp" />

子项的布局也非常简单，只有一个Text Vie Wo仔细观察TextView,你会发现其中有几个属 性是我们之前没有学过的。android:padding表示给控件的周围加上补白，这样不至于让文本 内容会紧靠在边缘上。android: singleLine设置为true表示让这个TextView只能单行显示。 android:ellipsize用于设定当文本内容超出控件宽度时，文本的缩略方式，这里指定成end 表示在尾部进行缩略。

既然新闻列表和子项的布局都已经创建好了，那么接下来我们就需要一个用于展示新闻列表 的地方。这里新建NewsTitleFragment作为展示新闻列表的碎片，代码如下所示：

public class NewsTitleFragment extends Fragment {

private boolean isTwoPane;

(QOverride

public View onCreateView(LayoutInflater inflater, ViewGroup container,

Bundle savedlnstanceState) {

View view = inflater.inflate(R.layout.newstitlefrag, container, false); return view;

}

(aOverride

public void onActivityCreated(Bundle savedlnstanceState) (

super,onActivityCreated(savedlnstanceState);

if (getActivity().findViewByld(R.id.newscontentlayout) != null) { isTwoPane = true; //可以找到news content layout布局时，为双页模式

} else {

isTwoPane = false; // 找不到 news content layout 布局时，为单页模式

} " "

}

}

可以看到，NewsTitleFragment中并没有多少代码，在onCreateView()方法中加载了 news_title项ag布局，这个没什么好说的。我们注意看一下onActivityCreated()方法，这个方 法通过在活动中能否找到一个id为news content layout的View来判断当前是双页模式还是单 页模式，因此我们需要让这个id为news content layout的View只在双页模式中才会出现。

那么怎样才能实现这个功能呢？其实并不复杂，只需要借助我们刚刚学过的限定符就可以 了。首先修改activity main.xml中的代码，如下所示：

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

<fragment

and roid: id="(a+id/news_title_f ragment"

android: name=" com. example. f ragmentbestpractice. NewsTitleFragment"

android:layout_width="match_parent"

android: layout_height=,,match_parent"

</FrameLayout>

上述代码表示，在单页模式下，只会加载一个新闻标题的碎片。

然后新建layout・sw600dp文件夹，在这个文件夹下再新建一个activity_main.xml文件，代码 如下所示：

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

<fragment

android:id="@+id/news_title_fragment"

android:name="com.example.fragmentbestpractice.NewsTitleFragment" android:layout_width="0dp"

android:layout_height="match_parent"

android:layout_weight="l" />

<FrameLayout

android: id="(a+id/news_content_layout"

android:layout_width="0dp"

android:layout_height="match_parent"

android:layout_weight=,,3,' >

<fragment

android:id="@+id/news_content_fragment"

android:name="com.example.fragmentbestpractice.NewsContentFragment" android:layout_width="match_parent" android:layout_height=,,match_parent" />

</FrameLayout>

</LinearLayout>

可以看出，在双页模式下我们同时引入了两个碎片，并将新闻内容的碎片放在了一个Frame- Layout布局下，而这个布局的id正是news_content_layout0因此，能够找到这个id的时候就是 双页模式，否则就是单面模式。

现在我们已经将绝大部分的工作都完成了，但还剩下至关重要的一点，就是在NewsTitle- Fragment中通过RecyclerView将新闻列表展示出来。我们在NewsTitleFragment中新建一个 内部类NewsAdapter来作为RecyclerView的适配器，如下所示：

public class NewsTitleFragment extends Fragment {

private boolean isTwoPane;

class NewsAdapter extends RecyclerView.Adapter<NewsAdapter.ViewHolder> {

private List<News> mNewsList;

class ViewHolder extends RecyclerView.ViewHolder {

TextView newsTitleText;

public ViewHolder(View view) { super(view);

newsTitleText = (Textview) view.findViewById(R.id.news_tit'le);

} 一

}

public NewsAdapter(List<News> newsList) { mNewsList = newsList;

}

@0verride

public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { View view = Layoutlnflater.from(parent.getContext())

.inflate(R.layout.news_item, parent, false); final ViewHolder holder = new ViewHolder(view); view.setOnClickListener(new View.OnClickListener() { (^Override public void onClick(View v) {

News news = mNewsList.get(holder.getAdapterPosition()); if (isTwoPane) {

//如果是双页模式，则刷新NewsContentFragment中的内容 NewsContentFragment newsContentFragment =

(NewsContentFragment) getFragmentManager()

.findFragmentByld(R.id.news_content_f ragment); newsContentFragment.refresh(news.getTitle(), news ・ getContent());

} else {

//如果是单页模式，则直接启动NewsContentActivity NewsContentActivity. actionStart(getActivity(), news.getTitle(), news ・ getContent());

}

}

})；

return holder;

©Override

public void onBindViewHolder(ViewHolder holder, int position) { News news = mNewsList.get(position); holder.newsTitleText.setText(news.getTitleO);

}

©Override

public int getItemCount() { return mNewsList.size();

}

}

}

RecyclerView的用法你已经相当熟练了，因此这个适配器的代码对你来说应该没有什么难 度吧？需要注意的是，之前我们都是将适配器写成一个独立的类，其实也是可以写成内部类的， 这里写成内部类的好处就是可以直接访问NewsTitleFragment的变量，比如isTwoPane0

观察一下onC「eateViewHolder()方法中注册的点击事件，首先获取到了点击项的News实 例，然后通过isTwoPane变量来判断当前是单页还是双页模式，如果是单页模式，就启动一个 新的活动去显示新闻内容，如果是双页模式，就更新新闻内容碎片里的数据。

现在还剩最后一步收尾工作，就是向RecyclerView中填充数据了。修改NewsTitleFragment 中的代码，如下所示：

public class NewsTitleFragment extends Fragment {

@0verride

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedlnstanceState) {

View view = inflater.inflate(R.layout.newstitlefrag, container, false);

RecyclerView newsTitleRecyclerView = (RecyclerView) view.findViewByld (R. id. news__title_recycler_view);

LinearLayoutManager layoutManager = new LinearLayoutManager(getActivity()); newsTitleRecyclerView.setLayoutManager(layoutManager);

NewsAdapter adapter = new NewsAdapter(getNews()); newsTitleRecyclerView.setAdapter(adapter);

return view;

}

private List<News> getNev/s () {

List<News> newsList = new ArrayList<>(); for (int i = 1; i <= 50; i++) {

News news = new News();

news.setTitle("This is news title " + i); news. setContent (getRandomLengthContent ("This is news content " + i + u));

newsList・ add(news);

return newsList;

private String getRandomLengthContent(String content) { Random random = new Random();

int length = random.nextlnt(20) + 1; StringBuilder builder = new StringBuilder();

for (int i = 0; i < length; i++) { builder.append(content);

}

return builder.toString();

可以看到，onCreateView()方法中添加了 RecyclerView标准的使用方法，在碎片中使用 RecyclerView和在活动中使用几乎是一模一样的，相信没有什么需要解释的。另外，这里调用 了 getNewsO方法来初始化50条模拟新闻数据，同样使用了一个getRandomLengthContent () 方法来随机生成新闻内容的长度，以保证每条新闻的内容差距比较大，相信你对这个方法肯定不 会陌生了。

这样我们所有的编写工作就已经完成了，赶快来运行一下吧！首先在手机模拟器上运行，效 果如图4.14所示。

可以看到许多条新闻的标题，然后点击第一条新闻，会启动一个新的活动来显示新闻的内容, 效果如图4.15所示。

FragmentBestPractice

Thts is news title 1

接下来将程序在平板模拟器上运行，同样点击第一条新闻，效果如图4.16所示。