XML创建Fragment

最新推荐文章于 2025-07-30 16:10:35 发布

原创最新推荐文章于 2025-07-30 16:10:35 发布 · 617 阅读

0 ·

CC 4.0 BY-SA版权

Android 专栏收录该内容

16 篇文章

订阅专栏

本文介绍了一种在Android应用中实现双Fragment布局的方法。通过LinearLayout水平排列两个Fragment，并使用layout_weight属性分配宽度比例，实现了两个Fragment并排显示的效果。第一个Fragment加载了图片并设置背景颜色为红色，第二个Fragment则显示文本并设置背景为灰色。

1：主Activity的xml布局：

    <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal"
        tools:context="com.ju.day18.MainActivity">
<fragment
        android:id="@+id/fragment"
                android:name="com.ju.day18.MyFragment"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="match_parent"
                />
<fragment
        android:id="@+id/fragment2"
                android:name="com.ju.day18.MyFragment2"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="match_parent"
                android:layout_toRightOf="@+id/fragment"
                />
</LinearLayout>

2:创建Fragment类并继承fragment：

public class MyFragment extends Fragment {
    private ImageView pic;
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment, null);
        pic = (ImageView) view.findViewById(R.id.pic);
        ImageLoader.getInstance().displayImage("http://img1.touxiang.cn/uploads/20120902/02-055331_356.jpg",pic,MyApplication.getOption());
        return view;
    }
}

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

3：fragment1布局：

    <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        tools:context="com.ju.day18.MainActivity"
        android:background="#f00">
<TextView
        android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="3453453"/>
<ImageView
        android:id="@+id/pic"
                android:layout_width="150dp"
                android:layout_height="150dp"
                />
</LinearLayout>

4：fragment2布局：

   <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        tools:context="com.ju.day18.MainActivity"
        android:background="#c3c3c3">
<TextView
        android:layout_width="150dp"
                android:layout_height="150dp"
                android:text="第二个"
                />
</LinearLayout>