简介
Navigation组件简化了Android应用程序中页面之间跳转的实现。在 AndroidStudio3.2中可以使用,默认情况下，Navigation组件支持fragments和Activities，也可以自定义支持类型
新建Navigation
首先添加依赖:
implementation 'android.arch.navigation:navigation-fragment:1.0.0-alpha01'
然后:
- 新建一个项目,右键单击 res 文件夹,选择 New > Android resource file
- 输入文件名,例如:"nav_graph"
- 文件类型选择 Navigation
- 点击 OK
- 5.打开此文件
效果如下图:
图一
认识编辑器
Navigation编辑器有三个部分:
图二
1.Destinations list -- 列出在Graph Editor中的所有Destinations。
- Graph Editor -- Destinations的可视化。
3.属性编辑器 - 包含Destinations和action相关的属性。
创建Destinations
在Graph Editor点击 +号 > create blank Destinations创建新的Destinations,默认为 fragment,此处我创建了两个Destinations,如图:
图三
此时Text视图中:
<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
app:startDestination="@id/firstFragment">
<!--注意:startDestination: 起始Destination,必须指定-->
<fragment
android:id="@+id/firstFragment"
android:name="com.example.king.navigationdemo.FirstFragment"
android:label="fragment_first"
tools:layout="@layout/fragment_first" />
<fragment
android:id="@+id/secondFragment"
android:name="com.example.king.navigationdemo.SecondFragment"
android:label="fragment_second"
tools:layout="@layout/fragment_second" />
</navigation>
连接Destination
点击一个Destination,其右侧会出现一个圆圈
图四
单击圆圈并按住,连接到其他的Destination:
图五
此时 Text视图中:
<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
app:startDestination="@id/firstFragment">
<fragment
android:id="@+id/firstFragment"
android:name="com.example.king.navigationdemo.FirstFragment"
android:label="fragment_first"
tools:layout="@layout/fragment_first" >
<action
android:id="@+id/action_firstFragment_to_secondFragment"
app:destination="@id/secondFragment" />
</fragment>
<fragment
android:id="@+id/secondFragment"
android:name="com.example.king.navigationdemo.SecondFragment"
android:label="fragment_second"
tools:layout="@layout/fragment_second" />
</navigation>
编辑MainActivity(此处是MainActivity)
在MainActivity的 xml 中添加:
<fragment
android:id="@+id/my_nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:navGraph="@navigation/nav_graph" />
app:defaultNavHost="true" 此属性可确保您NavHostFragment拦截系统返回按钮也可以重写AppCompatActivity.onSupportNavigateUp()方法:
@Override
public boolean onSupportNavigateUp() {
return Navigation.findNavController(this, R.id.nav_host_fragment).navigateUp();
}
此时 MainActivity 如图:
图六
开始使用
跳转到Destinations使用的是NavController这个类,可以由以下方法返回
我们在 First Fragment 中添加几个按钮并设置点击事件:
图七
<?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"
android:orientation="vertical"
tools:context=".FirstFragment">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="First fragment"
android:textColor="#000000"
android:textSize="30sp" />
<Button
android:id="@+id/button_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="button1" />
<Button
android:id="@+id/button_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="button2" />
<Button
android:id="@+id/button_3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="button3" />
<Button
android:id="@+id/button_4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="button4" />
</LinearLayout>
再点击事件中写:
@Override
public void onClick(View v) {
switch (v.getId()) {
default:
break;
case R.id.button_1:
Navigation.findNavController(v).navigate(R.id.action_firstFragment_to_secondFragment);
break;
}
}
或者使用:
mButton2.setOnClickListener(Navigation.createNavigateOnClickListener(R.id.action_firstFragment_to_secondFragment, null));
Navigation.createNavigateOnClickListener() 返回一个View.OnClickListener对象
点击运行:
运行
Navigation与 Menu 结合使用
首先依赖一下:
implementation 'android.arch.navigation:navigation-ui:1.0.0-alpha01'
再次新建一个Destinations,
<fragment
android:id="@+id/thirdFragment"
android:name="com.example.king.myapplication.ThirdFragment"
android:label="fragment_third"
tools:layout="@layout/fragment_third" />
新建 menu 文件menu_nav_drawer:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<!--此id 对应 nav_graph下 fragment id-->
<item
android:id="@id/secondFragment"
android:icon="@mipmap/ic_launcher"
android:title="SecondFragment" />
<item
android:id="@id/thirdFragment"
android:icon="@mipmap/ic_launcher"
android:menuCategory="secondary"
android:title="ThirdFragment" />
</menu>
然后把MainActivity对应的 xml 改一下:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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"
tools:context=".MainActivity">
<fragment
android:id="@+id/my_nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:navGraph="@navigation/nav_graph" />
<android.support.design.widget.NavigationView
android:id="@+id/nav_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="left"
app:menu="@menu/menu_nav_drawer" />
</android.support.v4.widget.DrawerLayout>
之后MainActivity中:
NavigationView mNavView = (NavigationView) findViewById(R.id.nav_view);
NavController navController = Navigation.findNavController(this, R.id.my_nav_host_fragment);
NavigationUI.setupWithNavController(mNavView, navController);
运行一下:
运行
