Android Navigation + Fragment 制作APP主页面导航（步骤 + 源码）

添加位置如下图所示：

添加好之后，点击Sync进行项目同步，同步时会自动下载这些依赖库并配置到你的项目中。

添加完了依赖，就得先来简单介绍一下这个Navigation了，Navigation分为三大件：导航图、NavHost、NavController。

为了方便我介绍下面的三个概念，这里假设有A、B、C三个Fragment。

现在要从A切换到B

导航图：读取这个切换目标及路径

NavHost：包含A、B、C的容器，用于显示Fragment。

NavController：在得知切换目标时，控制NavHost去显示B这个Fragment。

这么一说，你是否有一些理解了呢？

2. 添加导航图

---

鼠标右键点击res → New → Android Resource File

然后会弹出一个窗体，在这个窗体里面设置文件名称，并选择文件类型，然后点击OK。

然后查看这个nav_graph.xml，你会发现有报错

不过先不用担心，因为这个里面是用来指向Fragment的，但是现在没有，那就创建。

然后先在com.llw.navigation下新建一个fragment包。

然后建一个Fragment类，这里命名我就用ABCDE来命名了，实际开发中是肯定不能这样的。

然后在layout新建一个布局fragment_a.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:gravity=“center”

android:orientation=“vertical”>

<TextView

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“A Fragment”

android:textColor=“#000”

android:textSize=“24sp” />

布局有了，然后进入到AFragment中绑定这个布局的id。

public class AFragment extends Fragment {

@Nullable

@Override

public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {

return inflater.inflate(R.layout.fragment_a, container, false);

}

}

那么这个AFragment就弄好了，同样按照上面的步骤创建BCDE的Fragment，这个重复的步骤我就不写了，因为有注水的涉嫌。

注意之前fragment_a.xml中我放了一个TextView用来表示这个是A，那么其他的xml中也要放置对应的BCDE，这样你切换的时候才能看到区别。

好了，下面可以打开这个nav_graph.xml进行Fragment的添加，在navigation标签下增加对AFragment的添加。

<fragment

android:id=“@+id/afragment”

android:name=“com.llw.navigation.fragment.AFragment”

android:label=“afragment”

tools:layout=“@layout/fragment_a” />

上面的也很简单，id表示它在导航图的标识，name指明这个Fragment的路径，包名+类名。label就是标签而已。layout就是绑定这个Fragment对应的布局。

这里你肯定回想，刚才不是在AFragment的onCreateView方法的返回中指明这这个布局吗？

那么这里又添加是为什么，因为你如果在导航图中指明了某一个Fragment的布局，那么在代码中就可以不用指明，也可以两者都指明，但至少要有一个地方指明，所以我这样写是可以的。为了让看的人更了解而已，虽然是多此一举。

那么这个nav_graph.xml的其他的Fragment也要添加，如下所示

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

<navigation xmlns:android=“http://schemas.android.com/apk/res/android”

xmlns:app=“http://schemas.android.com/apk/res-auto”