07-碎片的使用

  • 什么是碎片

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

1.碎片的简单实用

使用碎片搭建一个简单静态界面

第一步：创建左边碎片界面布局

添加一个水平居中的按钮

<?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/left_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="LeftButton"
        />
</LinearLayout>

第二步：创建右边碎片界面布局

添加一个背景颜色为绿色的布局，并加入一个标签

<?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:textSize="20sp"
        android:text="这是右边的碎片"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"/>

</LinearLayout>

第三步：创建LeftFragment类

让LeftFragment类继承自support-v4库中的Fragment类。

package com.example.anwser_mac.fragmenttest;

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

/**
 * Created by anwser_mac on 2017/4/6.
 */

public class LeftFragment extends Fragment {

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        //重写onCreateView方法，然后通过infalte()方法将刚才定义的left_fragment布局加载进来
        View view = inflater.inflate(R.layout.left_fragmen, container, false);
        return view;
    }
}

第四步：创建RightFragment类

同第三步

package com.example.anwser_mac.fragmenttest;

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

/**
 * Created by anwser_mac on 2017/4/6.
 */

public class RightFragment extends Fragment {

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.right_fragment, container, false);
        return view;
    }
}

第五步：修改activity_main.xml中的代码

将创建的碎片，加入到界面布局文件

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

    <fragment
        android:id="@+id/left_fragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:name="com.example.anwser_mac.fragmenttest.LeftFragment"
        android:layout_weight="1"/>

    <fragment
        android:id="@+id/right_fragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:name="com.example.anwser_mac.fragmenttest.RightFragment"
        android:layout_weight="1"/>

</LinearLayout>
  • 运行结果如下
2017-04-06_13-58-21.png

![Uploading 2017-04-06_17-24-28_256277.gif . . .]

2.动态添加碎片

碎片真正强大之处在于它可以在程序运行时动态地添加到活动当中。根据具体的情况添加碎片，可以将程序界面定制得更加多样化。

第一步：在1项目的基础上再创建一个碎片用来切换显示

<?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:background="#ffff00"
    android:orientation="vertical">

    <TextView
        android:id="@+id/another_textview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:textSize="20sp"
        android:text="这是右边的另一个碎片"/>

</LinearLayout>

第二步：创建对应的Fragment类

package com.example.anwser_mac.fragmenttest;

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

/**
 * Created by anwser_mac on 2017/4/6.
 */

public class AnotherRightFragment extends Fragment {

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.another_right_fragment, container, false);
        return view;
    }
}

第三步： 修改界面布局文件

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

    <fragment
        android:id="@+id/left_fragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:name="com.example.anwser_mac.fragmenttest.LeftFragment"
        android:layout_weight="1"/>

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

    </FrameLayout>
</LinearLayout>

第四步：修改Activity的代码如下

package com.example.anwser_mac.fragmenttest;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main_layout);
        //给按钮添加一个点击事件
        Button button = (Button) findViewById(R.id.left_button);
        button.setOnClickListener(this);
        replaceFragment(new RightFragment());
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {

            case R.id.left_button:
                TextView textView = (TextView) findViewById(R.id.right_textview);
                //判断哪个碎片需要进行切换
                if (textView != null) {
                    replaceFragment(new AnotherRightFragment());
                } else {
                    replaceFragment(new RightFragment());
                }
        }
    }

    ///切换右边显示的碎片
    //fragment : 要切换的碎片
    private void replaceFragment(Fragment fragment) {

        FragmentManager fragmentManager = getSupportFragmentManager();
        FragmentTransaction tansaction = fragmentManager.beginTransaction();
        tansaction.replace(R.id.right_layout, fragment);
        tansaction.commit();
    }
}
  • 运行效果如下：
2017-04-06_17-24-28.gif

综上，动态添加碎片可以分为以下5个步骤

  1. 创建待添加的碎片实例。
  2. 获取FragmentManager（在活动中可以直接通过调用getSupportFragmentManager()方法得到）
  3. 开启一个事务，通过调用beginTransaction()方法开启。
  4. 向容器内添加或替换碎片，一般使用replace()方法实现，需要传入容器的id和待添加的碎片实例。

3. 在碎片中模拟返回栈

在前面的练习中已经实现了动态添加返回栈，但是当切换了几次之后，按下back键程序会直接退出。所以如果需要给碎片提供一个返回栈的效果，需要调用FragmentTransaction中提供的addToBackStack()方法，可以用于将一个事务添加到返回栈中。

    ///切换右边显示的碎片
    //fragment : 要切换的碎片
    private void replaceFragment(Fragment fragment) {

        FragmentManager fragmentManager = getSupportFragmentManager();
        FragmentTransaction tansaction = fragmentManager.beginTransaction();
        tansaction.replace(R.id.right_layout, fragment);
        tansaction.addToBackStack(null);
        tansaction.commit();
    }

4.碎片和活动之间进行通信

  1. 在活动中调用碎片中的方法

    通过FragmentManager提供的findFragmentById()方法，获得碎片实例，从而调用碎片中的方法

    RightFragment rightFragment = (RightFragment) getFragmentManager().findFragmentById(R.id.right_fragment);

  2. 在碎片中调用活动中的方法

在碎片中可以通过调用getActivity()方法来得到和当前碎片相关联的活动实例

```

MainActiviy activity = (MainActivity) getActivity;


####5.碎片的生命周期
> 碎片和活动一样都有自己的生命周期

1. **运行状态** 

 >当一个碎片时可见的，并且它所关联的活动正处于运行状态时，该碎片也处于运行状态。
 
2. 暂停状态

 > 当一个活动进入暂停状态时（由于另一个未沾满屏幕的活动被添加到了栈顶），与它相关联的可见碎片就会进入到暂停状态。
 
3. 停止状态
 > 当一个活动进入停止状态时，与它相关联的碎片就会进入到停止状态，通过调用FragmentTransaction的remove()、replace()方法将碎片从活动中移除；或者在事务提交前调用了addToBackStack()方法，这时的碎片也会进入到停止状态，总的来说。进入停止状态的碎片对用户来说时完全不可见的。有可能会被系统回收。
 
4. 销毁状态
 > 当活动被销毁时，与它相关联的碎片就会进入到销毁状态。或者通过调用FragmentTransaction的remove()、replace()方法将碎片从活动中移除、也或者在事务提交前调用了addToBackStack()方法。
 
#####5.1碎片的状态回调

1. onAttach() 

 >当碎片和活动建立关联的时候调用。
2. onCreateView()
 > 为碎片创建视图(加载布局)时调用
3. onActivityCreated()
 > 确保与碎片相关联的活动一定已经创建完毕的时候调用。
4. onDestroyView()
 > 当与碎片关联的视图被移除的时候调用。
5. onDetach()
 > 当碎片和活动解除关联的时候调用。
 
- 下图展示了，添加碎片时，活动级碎片的回调顺序
 
![2017-04-06_16-25-38.png](http://upload-images.jianshu.io/upload_images/2897594-d0b4537c76f4b7de.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

- 》另外还有一点需要注意的是：在碎片中也
可以通过onSaveInstanceState()方法来保存数据。

----

####6.动态加载布局的技巧

6.1 使用限定符 
 
 > 通常在平板中采用的是双页模式，在手机采用的是单页模式，限定符的作用就是系统根据屏幕的大小，来加载不同的界面布局文件。从而达到自动分页的效果

第一步：如下图所示，创建一个根activity布局文件同名的large布局文件


![2017-04-06_17-41-38.png](http://upload-images.jianshu.io/upload_images/2897594-42a38627ff6e80d3.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

第二步：写入在平板下的布局代码
   
   

<?xml version="1.0" encoding="utf-8"?>

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

<fragment
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:name="com.example.anwser_mac.fragmenttest.LeftFragment"
    android:id="@+id/left_fragment"/>

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

<!--<fragment-->
    <!--android:layout_width="0dp"-->
    <!--android:layout_height="match_parent"-->
    <!--android:layout_weight="1"-->
    <!--android:name="com.example.anwser_mac.fragmenttest.RightFragment"-->
    <!--android:id="@+id/right_fragment"/>-->

</LinearLayout>


第三步： 同时也要记得将原来的界面布局改为单页的界面布局。

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

<fragment
    android:id="@+id/left_fragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:name="com.example.anwser_mac.fragmenttest.LeftFragment"/>
    <!--android:layout_weight="1"/>-->

<!--<FrameLayout-->
    <!--android:id="@+id/right_layout"-->
    <!--android:layout_width="0dp"-->
    <!--android:layout_height="match_parent"-->
    <!--android:layout_weight="1">-->

<!--</FrameLayout>-->

</LinearLayout>

- 在不同设备下运行效果分别如下。

![
![Uploading 2017-04-06_17-34-42_845768.png . . .]
](http://upload-images.jianshu.io/upload_images/2897594-83b233c3e75f01ad.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)


- 下图是一些常见的限定符，图片来自《第一行代码》

![2017-04-06_17-34-42.png](http://upload-images.jianshu.io/upload_images/2897594-9d74d989ae814fda.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)


6.2 使用最小宽度限定符
>最小宽度限定符允许我们对屏幕的宽度制定一个最小值（以dp为单位），然后以这个最小值为临界点，屏幕宽度大于这个值的设备就加载一个布局。屏幕宽度小于这个值就加载另一个布局。

- 如下图所示，新建一个**layout_sw600dp**的文件，在这个文件中搭建布局。也就意味着当屏幕宽度大于600dp的时候会加载这个文件；当屏幕小于600dp的时候默认加载main_layout文件。


![2017-04-06_17-41-38.png](http://upload-images.jianshu.io/upload_images/2897594-df915cdedfc841ed.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
  • 人面猴
    序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
    沈念sama阅读 203,456评论 5赞 477
  • 死咒
    序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
    沈念sama阅读 85,370评论 2赞 381
  • 救了他两次的神仙让他今天三更去死
    文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
    开封第一讲书人阅读 150,337评论 0赞 337
  • 道士缉凶录：失踪的卖姜人
    文/不坏的土叔 我叫张陵，是天一观的道长。 经常有香客问我，道长，这世上最难降的妖魔是什么？ 我笑而不...
    开封第一讲书人阅读 54,583评论 1赞 273
  • 港岛之恋（遗憾婚礼）
    正文 为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
    茶点故事阅读 63,596评论 5赞 365
  • 恶毒庶女顶嫁案：这布局不是一般人想出来的
    文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
    开封第一讲书人阅读 48,572评论 1赞 281
  • 城市分裂传说
    那天，我揣着相机与录音，去河边找鬼。 笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。 我是一名探鬼主播，决...
    沈念sama阅读 37,936评论 3赞 395
  • 双鸳鸯连环套：你想象不到人心有多黑
    文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
    开封第一讲书人阅读 36,595评论 0赞 258
  • 万荣杀人案实录
    序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
    沈念sama阅读 40,850评论 1赞 297
  • 护林员之死
    正文 独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,601评论 2赞 321
  • 白月光启示录
    正文 我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,685评论 1赞 329
  • 活死人
    序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
    沈念sama阅读 33,371评论 4赞 318
  • 日本核电站爆炸内幕
    正文 年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
    茶点故事阅读 38,951评论 3赞 307
  • 男人毒药：我在死后第九天来索命
    文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,934评论 0赞 19
  • 一桩弑父案，背后竟有这般阴谋
    文/苍兰香墨 我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,167评论 1赞 259
  • 情欲美人皮
    我被黑心中介骗来泰国打工， 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。 一个月前我还...
    沈念sama阅读 43,636评论 2赞 349
  • 代替公主和亲
    正文 我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
    茶点故事阅读 42,411评论 2赞 342

推荐阅读更多精彩内容