初探 NavigationController ----页面切换更简单

本节 我总结了 Jetpack中的Navigation组件的简单实用方法 ， 视频链接

效果图

所需要的类

实现步骤

准备Fragment 类 以及对应的XML布局文件

这里与之前实现底部导航栏类似，不过我们将控件的绑定放到了 OnActivityCreate 中，

HomeFragement

public class HomeFragment extends Fragment {


    public HomeFragment() {
        // Required empty public constructor
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_home, container, false);
    }

    @Override
    public void onActivityCreated(@Nullable Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        getView().findViewById(R.id.button).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //********************这里 进行页面切换 **************************
                NavController controller = Navigation.findNavController(v);
                //这里的参数id 是 在编写完 NavGraph，后会自动生成
                controller.navigate(R.id.action_homeFragment_to_detailFragment);
            }
        });
    }
}

DetailFragement

public class DetailFragment extends Fragment {


    public DetailFragment() {
        // Required empty public constructor
    }


    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_detail, container, false);
    }

    @Override
    public void onActivityCreated(@Nullable Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        getView().findViewById(R.id.button2).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                 //********************这里 进行页面切换 **************************
                NavController controller = Navigation.findNavController(v);
                controller.navigate(R.id.action_detailFragment_to_homeFragment);
            }
        });
    }
}

准备NavGraph

右击res–New–Android Resource File ，在Resource Type中 选择 Navigation

准备NavHost

在Activity _main 中 放置一个，NavHostFragement

编写Fragment中 点击事件

详见 上述代码

编写顶部bar的返回事件，修改标题栏名称

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //标题栏改为 fragment 名称
        NavController controller = Navigation.findNavController(this, R.id.navHost);
        NavigationUI.setupActionBarWithNavController(this, controller);
    }

    /**
     * 返回按钮事件
     *
     * @return
     */
    @Override
    public boolean onSupportNavigateUp() {
        NavController controller = Navigation.findNavController(this, R.id.navHost);
        return controller.navigateUp();
//        return super.onSupportNavigateUp();
    }
}

总结

1. NavController 的构造方法有两种

第一种 只有一个参数 View，在Onclick方法中使用

NavController controller = Navigation.findNavController(v);

第二种 有两个参数 ，第一个是Activity 第二个是NavHost 的布局id

NavController controller = Navigation.findNavController(this, R.id.navHost);

2. ToolBar 返回事件 的编写

需要重写 onSupportNavigateUp() 回调函数

@Override
public boolean onSupportNavigateUp() {
    NavController controller = Navigation.findNavController(this, R.id.navHost);
    return controller.navigateUp();
}

3. 标题栏 改为 fragment的名称，在onCreate 方法中 加

NavController controller = Navigation.findNavController(this, R.id.navHost);
NavigationUI.setupActionBarWithNavController(this, controller);