Android第一行代码——快速入门 Kotlin 编程（5.5 Fragment 的最佳实践：一个简易版的新闻应用）

目录

5.5        Fragment 的最佳实践：一个简易版的新闻应用

---

5.5        Fragment 的最佳实践：一个简易版的新闻应用

        现在你已经将关于Fragment 的重要知识点掌握得差不多了，不过在灵活运用方面可能还有些欠 缺，因此下面该进入我们本章的最佳实践环节了。

        前面提到过，Fragment 很多时候是在平板开发当中使用的，因为它可以解决屏幕空间不能充分利用的问题。那是不是就表明，我们开发的程序都需要提供一个手机版和一个平板版呢？确实 有不少公司是这么做的，但是这样会耗费很多的人力物力财力。因为维护两个版本的代码成本很高：每当增加新功能时，需要在两份代码里各写一遍；每当发现一个bug 时，需要在两份代码里各修改一次。因此，今天我们最佳实践的内容就是教你如何编写兼容手机和平板的应用程序。

        还记得我们在本章开始的时候提到的一个新闻应用吗？现在我们就运用本章所学的知识来编写 一个简易版的新闻应用，并且要求它可以兼容手机和平板。新建好一个 FragmentBestPractice 项目，然后开始动手吧！

        由于待会在编写新闻列表时会使用到 RecyclerView ，因此首先需要在app/build.gradle 当中添 加依赖库，如下所示：

 implementation("androidx.recyclerview:recyclerview:1.2.1")

        接下来我们要准备好一个新闻的实体类，新建类 News，代码如下所示：

class News(val title:String,val content:String)

        News类的代码非常简单，title字段表示新闻标题，content字段表示新闻内容。接着新建布 局文件 news_content_frag.xml ，作为新闻内容的布局：

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    
    <LinearLayout
        android:id="@+id/contentLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:visibility="invisible">
        
        <TextView
            android:id="@+id/newsTitle"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:textSize="20sp"
            android:padding="10dp" />
        
        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="#000"/>
        
        <TextView
            android:id="@+id/newsContent"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:textSize="18sp"
            android:padding="15dp" />
    </LinearLayout>
    
    <View
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:background="#000"/>

</RelativeLayout>

        新闻内容的布局主要可以分为两个部分：头部部分显示新闻标题，正文部分显示新闻内容，中间使用一条水平方向的细线分隔开。除此之外，这里还使用了一条垂直方向的细线，它的作用 是在双页模式时将左侧的新闻列表和右侧的新闻内容分隔开。细线是利用 View 来实现的，将 View 的宽或高设置为1 dp ，再通过 background 属性给细线设置一下颜色就可以了，这里我们 把细线设置成黑色。

        另外，我们还要将新闻内容的布局设置成不可见。因为在双页模式下，如果还没有选中新闻列表中的任何一条新闻，是不应该显示新闻内容布局的。

        接下来新建一个 NewsContentFragment 类，继承自Fragment ，代码如下所示：

class NewsContentFragment : Fragment() {

    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        return inflater.inflate(R.layout.news_content_frag,container,false)
    }

    fun refresh(title:String,content:String){
        contentLayout.visibility = View.VISIBLE
        newsTitle.text = title  // 将传入的新闻标题显示在界面上
        newsContent.text = content //将传入的新闻内容显示在界面上
    }
}

        这里首先在 onCreateView() 方法中加载了我们刚刚创建的 news_content_frag 布局，这个没 什么好解释的。接下来又提供了一个 refresh() 方法，用于将新闻的标题和内容显示在我们刚刚定义的界面上。注意，当调用了 refresh() 方法时，需要将我们刚才隐藏的新闻内容布局设置成可见。

        这样我们就把新闻内容的 Fragment 和布局都创建好了，但是它们都是在双页模式中使用的，如 果想在单页模式中使用的话，我们还需要再创建一个 Activity 。右击 com.example.fragmentbestpractice 包→New→Activity→Empty A ctivity ，