原 手把手入门Fragment (1)

1Android发布的前两个版本只适配小尺寸的手机。开发适配小尺寸手机app只需要考虑怎么将控件布局到Activity中，怎样打开一个新的Activity等就可以了。然而Android3.0开始支持平板，屏幕尺寸增大到10寸。使得原本适用与屏幕较小的手运行的好好的项目在平板上被拉伸或者空隙过大，导致屏幕适配成了难题

Android 3.0引入了Fragment(碎片)的概念，其目的就是类能够优雅的实现上述邮件例子中的屏幕适配问题,下面我们就来学习一下，他和Activity有点相似,同样都能够包含布局，同样都有他自己的生命周期，先看看他能派上什么用场，Fragment(碎片)是来充分的利用平板屏幕的空间,想象一下正在写一个功能，其中一个界面是用RecyclerView展示新闻的列表，当你点击其中一个标题，就打开这个标题的详情页。如果是手机设计的时候，可以将详情页写在另一个活动上，如图:
但是说如果在平板上这么设计,那么每一个列表项就都会被拉长,如图：
因此更好的设计方案是将两个页面分别放入两个碎片中，再在同一个活动中引入，这样就充分的利用了屏幕的空间，如图：
1.1 讲了这么多现在来真正入手一下,首先创建一个平板模拟器，创建方法如下，只需把手机的分辨率改成1024x600即可。创建一个FragmentTest项目,在一个活动中添加两个碎片，并让碎片平分屏幕，新建left_fragment.xml代码如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
	android:id="@+id/button"
    android:text="@string/button"
    android:layout_gravity="center_horizontal"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />
</LinearLayout>

新建一个right_fragment.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:background="#00ff00"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">
      <TextView
        android:layout_gravity="center_horizontal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="18sp"
        android:text="@string/this_is_right_fragment"/>
</LinearLayout>

接着新建两个类 LeftFragment和RightFragment，继承Fragment,注意要继承v4包下的。
LeftFragment 代码如下,另一个类似，布局文件换一下

public class LeftFragment extends Fragment {
    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container,
                             @Nullable Bundle savedInstanceState) {
                View view=inflater.inflate(R.layout.left_fragment,container,false);
                return view;
    }
}

接下来修改一下activity_main.xml的代码就好，把两个view已经初始化的fragment显示就行了
代码：

<?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"
    >
    
    <fragment
        android:id="@+id/left_fragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:name="com.example.fragmenttest1.LeftFragment"/>
        <fragment
            android:id="@+id/right_fragment"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:name="com.example.fragmenttest1.RightFragment"/>
</LinearLayout>

在模拟器上运行：
这样，第一个实例就做好了,看上去可能没什么碎片的感觉，但是把其中的内容改掉一点，就可以发现其中的奥秘所在
新建一个another_right_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">
<TextView
    android:text="@string/another_fragment"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/text_view1"
    android:layout_gravity="center_horizontal"/>
</LinearLayout>

新建一个AntherRightFragment类将布局文件和其绑定：

public class AnotherRightFrament extends Fragment {
    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
            View view=inflater.inflate(R.layout.another_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: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:layout_weight="1"
        android:name="com.example.fragmenttest1.LeftFragment"/>
       <FrameLayout
           android:layout_width="0dp"
           android:layout_weight="1"
           android:layout_height="match_parent"
           android:id="@+id/right_layout">
       </FrameLayout>
</LinearLayout>

通过FrameLayout布局，动态的添加fragment到right_layout可以实现，FrameLayout的特性想必大家都知道，接下来修改MainActivity代码：

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Button button=findViewById(R.id.button);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                replace(new AnotherRightFrament());
            }
        });
        replace(new RightFragment());
    }
    private void replace(Fragment fragment) {
    //通过FragmentManager获得一个FragmentManger实例
    //开启一个事务，通过replace方法并将参数补齐，
    //最后是用commit提交
        FragmentManager fragmentManager=getSupportFragmentManager();
        FragmentTransaction fragmentTransaction=fragmentManager.beginTransaction();
        fragmentTransaction.replace(R.id.right_layout,fragment);
        fragmentTransaction.commit();
    }
}

我们来运行一下
点击之后的效果:
就先写到这，下一篇带大家走入Fragment！