Fragment

一简介

Fragment是一种可以嵌入在Activity当中的UI片段，它能让程序更加合理和充分地利用大屏幕空间，在平板上应用广泛。

二静态添加Fragment

xml leftFragme

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="Button"
        android:textAllCaps="false"/>

</LinearLayout>

xml rightFragment

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#00ff00">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="This is right fragment"
        android:textSize="25sp"/>

</LinearLayout>

新建两个fragment类继承Fragment

class LeftFragment : Fragment(){

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

class RightFragment: Fragment(){

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

在MainActivity的布局中引入

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:orientation="horizontal">

    <fragment
        android:id="@+id/leftFragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:name="com.example.kotlin_fragment.staticfragment.LeftFragment"/>

    <fragment
        android:id="@+id/rightFragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:name="com.example.kotlin_fragment.staticfragment.RightFragment"/>

</LinearLayout>

效果图

staticfragment.png

三动态添加Fragment

步骤

创建待添加的Fragment实例
获取FragmentManager，在Activity中可以直接调用getSupportFragmentManager()方法获取
开启一个事务，通过调用fragmentManager的beginTransaction()方法获取一个容器
向容器内添加或者替换Fragment，一般使用replace()方法实现，需要传入容器的id(Fragment的父布局)和待添加的Fragment实例
提交事务，调用commit()方法来完成

class MainActivity : AppCompatActivity() {

    private lateinit var button: Button

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        button = findViewById(R.id.button)
        replaceFragment(RightFragment())
        setListener()
    }

    private fun setListener() {
        button.setOnClickListener {
            replaceFragment(AnotherRightFragment())
        }
    }

    private fun replaceFragment(fragment: Fragment) {
        val fragmentManager = supportFragmentManager
        val fragmentTransaction = fragmentManager.beginTransaction()
        fragmentTransaction.replace(R.id.rightLayout, fragment)
        /**
         *addToBackStack: 用于将事务添加到返回栈当中
         * 它接收一个名字用于描述返回栈的状态，一般传入null就ok
         */
        fragmentTransaction.addToBackStack(null)
        fragmentTransaction.commit()
    }
}

四 Fragment和Activity之间的交互

为了方便Fragment和Activity之间进行交互，FragmentManager提供了一个类似于findViewById()的方法，专门用于从布局文件中获取Fragment的实例

代码如下所示：

val fragment = supportFragmentManager.findFragmentById(R.id.leftFrgament) as LeftFragment

调用FragmentManager的findFragmentById()方法，可以在Activity中得到相应Fragment的实例，然后就能轻松地调用Fragment里的方法了

那么在Fragment中又该如何调用Activity里的方法呢？

在每个Fragment中都可以通过调用getActivity()方法来得到和当前Fragment相关联的Activity实例，例如：
if(activity != null){
    val mainActivity = activity as MainActivity
}
这里由于getActivity()方法有可能返回null，因此我们需要先进行一个判空处理，有了Activity的实例，就能调Activity里面的方法了；另外当Fragment中需要使用Context对象时，也可以使用getActivity()方法，因为获取到的Activity本身就是一个Context对象。

那么不同的Fragment之间怎么通信呢？

思路非常简单：首先在一个Fragment中可以得到与它相关联的Activity，然后再通过这个Activity去获取另外一个Fragment的实例。

五 Fragment的生命周期

Activity有的生命周期Fragment都有，附加的如下：

onAttach(): 当Fragment和Activity建立关联时回调

onCreateView(): 为Fragment创建视图(加载布局)时调用

onActivityCreate(): 确保与Fragment相关联的Activity已经创建完毕时调用

onDestroyView(): 当与Fragment关联的视图被移除时调用

onDetach(): 当Fragment和Activity解除关联时调用

Fragment生命周期图如下：

fragment.jpg

六动态加载布局的技巧

让程序能够根据设备的分辨率或屏幕大小，在运行时决定加载哪个布局
比如如果是手机，则采用单页模式，平板则采用双页模式
需要借助限定符来实现

修改layout下面activity_main.xml文件

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:orientation="horizontal">

    <fragment
        android:id="@+id/leftFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:name="com.example.kotlin_fragment.staticfragment.LeftFragment"/>

</LinearLayout>

在res目录下新建layout-large文件夹，在这个文件夹下也新建activity_main.xml布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:orientation="horizontal">

    <fragment
        android:id="@+id/leftFragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:name="com.example.kotlin_fragment.staticfragment.LeftFragment"/>

    <fragment
        android:id="@+id/rightFragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="3"
        android:name="com.example.kotlin_fragment.staticfragment.RightFragment"/>

</LinearLayout>

可以看到，layout/activity_main布局只包含了一个Fragment，即单页模式，而layout-large/activity_main布局包含了两个Fragment，即双页模式。其中，large就是一个限定符，那些屏幕被认为是large的设备就会自动加载layout-large文件夹下的布局，小屏幕的设备则还是会加载layout文件夹下的布局。

使用最小宽度限定符

有时候我们希望可以更加灵活地为不同设备加载布局，不管它们是不是被系统认定为large，这时就可以使用最小宽度限定符。

最新宽度限定符允许我们对屏幕的宽度指定一个最小值(以dp为单位)，然后以这个最小值为临界点，屏幕宽度大于等于这个值的设备就加载一个布局，屏幕宽度小于这个值的设备就加载另一个布局。

在res目录下新建layout-sw600dp文件夹，然后在这个文件夹下新建activity_main.xml布局。
这就意味着，当程序运行在屏幕宽度大于等于600dp的设备上时，会加载layout-sw600dp/activity_main布局，小于则加载默认的layout/activity_main。

七实践：一个简易版的新闻应用

标题fragment
xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/newsTitleRecyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</LinearLayout>

单双页模式下显示的内容不同双页只显示标题点击跳转到内容

class NewsTitleFragment: Fragment(){

    private var isTwoPane = false
    private lateinit var mNewsTitleRecyclerView: RecyclerView
    private lateinit var mNewsAdapter: NewsAdapter

    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        val view = inflater.inflate(R.layout.news_title_frag,container,false)
        mNewsTitleRecyclerView = view.findViewById(R.id.newsTitleRecyclerView)
        return view
    }

    override fun onActivityCreated(savedInstanceState: Bundle?) {
        super.onActivityCreated(savedInstanceState)
        //如果 是双页模式 加载的另一个布局 那个布局是有newsContentLayout这个控件的
        isTwoPane = activity?.findViewById<View>(R.id.newsContentLayout) != null
        val layoutManager = LinearLayoutManager(activity)
        mNewsTitleRecyclerView.layoutManager = layoutManager
        mNewsAdapter = NewsAdapter(getNews())
        mNewsTitleRecyclerView.adapter = mNewsAdapter
    }

    private fun getNews(): List<News> {
        val newsList = ArrayList<News>()
        for (i in 1..50){
            val news = News("this is news title $i",getRandomLengthString("this is news content $i. "))
            newsList.add(news)
        }
        return newsList
    }

    private fun getRandomLengthString(s: String): String {
        val n = (1..20).random()
        val builder = StringBuilder()
        repeat(n){

            builder.append(s)
        }
        return builder.toString()
    }

    inner class NewsAdapter(val mNewList: List<News>):
        RecyclerView.Adapter<NewsAdapter.ViewHolder>() {

        inner class ViewHolder(itemView: View): RecyclerView.ViewHolder(itemView) {
            val newsTitle: TextView = itemView.findViewById(R.id.newsTitle)
        }

        override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
            val itemView = LayoutInflater.from(parent.context).inflate(R.layout.news_item, parent,false)
            val holder = ViewHolder(itemView)
            holder.itemView.setOnClickListener {
                val news = mNewList[holder.adapterPosition]
                if (isTwoPane){
                    //如果是双页模式 则刷新NewsContentFragment中的内容
                    if (activity != null){
                        val fragmentActivity = activity as FragmentBestPractice
                        val fragment = fragmentActivity.supportFragmentManager.findFragmentById(R.id.newsContentFrag) as NewsContentFragment
                        fragment.refresh(news.title, news.content)
                    }else{
                        //如果是单页模式 则直接启动NewsContentActivity
                        NewsContentActivity.actionStart(parent.context, news.title,news.content)
                    }
                }
            }
            return holder
        }

        override fun getItemCount() = mNewList.size

        override fun onBindViewHolder(holder: ViewHolder, position: Int) {
            val news = mNewList[position]
            holder.newsTitle.text = news.title
        }

    }

}

内容fragment
xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    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:gravity="center"
            android:padding="10dp"
            android:textSize="20sp"/>

        <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:padding="15dp"
            android:textSize="18sp"/>

    </LinearLayout>

    <View
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:layout_alignParentStart="true"
        android:background="#000"/>


</RelativeLayout>

class NewsContentFragment : Fragment(){

    private lateinit var mContentLayout: LinearLayout
    private lateinit var mNewsTitle: TextView
    private lateinit var mNewsContent: TextView

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

    private fun initView(view: View) {
        mContentLayout = view.findViewById(R.id.contentLayout)
        mNewsTitle = view.findViewById(R.id.newsTitle)
        mNewsContent = view.findViewById(R.id.newsContent)
    }

    fun refresh(title: String, content: String){
        mContentLayout.visibility = View.VISIBLE
        mNewsTitle.text = title
        mNewsContent.text = content
    }
}

双页模式下跳转过来的内容activity

class NewsContentActivity : AppCompatActivity(){

    companion object{
        fun actionStart(context: Context, title: String, content: String){
            val intent = Intent(context, NewsContentActivity::class.java).apply {
                //apply 函数提供调用对象上下文 返回调用对象
                putExtra("news_title",title)
                putExtra("news_content", content)
            }
            context.startActivity(intent)
        }
    }

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_news_content)

        initView();
    }

    private fun initView() {
        val title = intent.getStringExtra("news_title")
        val content = intent.getStringExtra("news_content")
        if (title != null && content != null){
            val fragment = supportFragmentManager.findFragmentById(R.id.newsContentFrag) as NewsContentFragment
            fragment.refresh(title, content)
        }
    }

}

xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <fragment
        android:id="@+id/newsContentFrag"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:name="com.example.kotlin_fragment.practice.NewsContentFragment"/>

</LinearLayout>

适配的主界面
默认的layout

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/newsTitleLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <fragment
        android:id="@+id/newsTitleFrag"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:name="com.example.kotlin_fragment.practice.NewsTitleFragment"/>

</FrameLayout>

large的layout

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <fragment
        android:id="@+id/newsTitleFrag"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:name="com.example.kotlin_fragment.practice.NewsTitleFragment"/>

    <FrameLayout
        android:id="@+id/newsContentLayout"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="3">

        <fragment
            android:id="@+id/newsContentFrag"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:name="com.example.kotlin_fragment.practice.NewsContentFragment"/>

    </FrameLayout>

</LinearLayout>

主activity

class FragmentBestPractice : AppCompatActivity(){

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_news_project)
    }

}

效果图

fragment2.png

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 221,635评论 6赞 515
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 94,543评论 3赞 399
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 168,083评论 0赞 360
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 59,640评论 1赞 296
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 68,640评论 6赞 397
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 52,262评论 1赞 308
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 40,833评论 3赞 421
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 39,736评论 0赞 276
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 46,280评论 1赞 319
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 38,369评论 3赞 340
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 40,503评论 1赞 352
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 36,185评论 5赞 350
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 41,870评论 3赞 333
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 32,340评论 0赞 24
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 33,460评论 1赞 272
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 48,909评论 3赞 376
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 45,512评论 2赞 359

Fragment

一 简介

二 静态添加Fragment

三 动态添加Fragment

步骤

四 Fragment和Activity之间的交互

五 Fragment的生命周期

六 动态加载布局的技巧

使用最小宽度限定符

七 实践：一个简易版的新闻应用

推荐阅读更多精彩内容

一简介

二静态添加Fragment

三动态添加Fragment

六动态加载布局的技巧

七实践：一个简易版的新闻应用