【Android】Jetpack全组件实战开发短视频应用App(三)

这一篇我们将使用

Navigation

App

Navigation

官网地址
快速入门

导航组件由以下三个关键部分组成：

Navigation

这里我们直接使用AS自带的模板创建一个

Activity

看下它的布局，很简单就是两部分，底部的

BottomNavigationView

fragment

fragment

NavHostFragment

Fragment

public class NavHostFragment extends Fragment implements NavHost {
	......
	@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    final Context context = getContext();
    //实例化NavController，它才是真正处理导航的，并且把FragmentNavigator实例化添加到SimpleNavigatorProvider 
    mNavController = new NavController(context);
   mNavController.getNavigatorProvider().addNavigator(createFragmentNavigator());
}
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container,
   @Nullable Bundle savedInstanceState) {
   FrameLayout frameLayout = new FrameLayout(inflater.getContext());
   frameLayout.setId(getId());
   return frameLayout;
    }
//onViewCreated传入当前的根布局以及NavController实例，并且给根布局设置一个tag，所以在每次findNavController的时候都会通过这个tag取唯一的实例，如果取不到会循环从父布局在去找。
@Override
public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);
        if (!(view instanceof ViewGroup)) {
           throw new IllegalStateException("created host view " + view + " is not a ViewGroup");
        }
        View rootView = view.getParent() != null ? (View) view.getParent() : view;
        Navigation.setViewNavController(rootView, mNavController);
}
    public static void setViewNavController(@NonNull View view,
            @Nullable NavController controller) {
        view.setTag(R.id.nav_controller_view_tag, controller);
    }
	......
}

通过上面源码我们知道

NavHostFragment

NavController

navigate

    
public void navigate(int resId, Bundle args, NavOptions navOptions) {
    //回退栈为null返回NavGraph
    //不为null返回回退栈中的最后一项
    NavDestination currentnode = mBackStack.isEmpty() ? mGraph : mBackStack.peekLast();
    if (currentNode == null) {
        throw new IllegalStateException("no current navigation node");
    }
    int destId = resId;
    //获取resId对应的NavAction
    final NavAction navAction = currentNode.getAction(resId);
    if (navAction != null) {
        if (navOptions == null) {
            navOptions = navAction.getNavOptions();
        }
        //通过NavAction获取目的地id
        destId = navAction.getDestinationId();
    }
    //若destId为0而navOptions又不为null则弹出到该navOptions的指定的页面
    if (destId == 0 && navOptions != null && navOptions.getPopUpTo() != 0) {
        popBackStack(navOptions.getPopUpTo(), navOptions.isPopUpToInclusive());
        return;
    }
    //为0报错
    if (destId == 0) {
        throw new IllegalArgumentException("Destination id == 0 can only be used" + " in conjunction with navOptions.popUpTo != 0");
    }
    //找到准备前往的目的地
    NavDestination node = findDestination(destId);
    if (node == null) {
        final String dest = NavDestination.getDisplayName(mContext, destId);
        throw new IllegalArgumentException("navigation destination " + dest
                + (navAction != null
                ? " referenced from action " + NavDestination.getDisplayName(mContext, resId)
                : "")
                + " is unknown to this NavController");
    }
    if (navOptions != null) {
        //是否清除回退栈
        if (navOptions.shouldClearTask()) {
            popBackStack(0, true);
            mBackStack.clear();
        } else if (navOptions.getPopUpTo() != 0) {
            //导航之前弹出栈到指定栈
            // 是否将该页面也弹出
            popBackStack(navOptions.getPopUpTo(), navOptions.isPopUpToInclusive());
        }
    }
    //进行导航
    node.navigate(args, navOptions);
}

这里我们还需要介绍两个类

NavDestination

NavGraph

NavGraph

NavDestination

NavDestination

接下来说说我们

activity_main

BottomNavigationView

用它的话你需要添加依赖

implementation 'com.Google.Android.material:material:1.1.0'

我们需要给他配置一个

menu

我们回到

MainActivity

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        BottomNavigationView navView = findViewById(R.id.nav_view);
        // Passing each menu ID as a set of Ids because each
        // menu should be considered as top level destinations.
        AppBarConfiguration appBarConfiguration = new AppBarConfiguration.Builder(
                R.id.navigation_home, R.id.navigation_dashboard, R.id.navigation_notifications)
                .build();
        NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment);
        NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration);
        NavigationUI.setupWithNavController(navView, navController);
    }
}

主要是在

NavigationUI.setupWithNavController(navView, navController);

 public static void setupWithNavController(
            @NonNull final BottomNavigationView bottomNavigationView,
            @NonNull final NavController navController) {
        bottomNavigationView.setOnNavigationItemSelectedListener(
                new BottomNavigationView.OnNavigationItemSelectedListener() {
                    @Override
                    public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                        return onNavDestinationSelected(item, navController);
                    }
                });
        final WeakReference weakReference =
                new WeakReference(bottomNavigationView);
        navController.addOnDestinationChangedListener(
                new NavController.OnDestinationChangedListener() {
                    @Override
                    public void onDestinationChanged(@NonNull NavController controller,
                            @NonNull NavDestination destination, @Nullable Bundle arguments) {
                        BottomNavigationView view = weakReference.get();
                        if (view == null) {
                            navController.removeOnDestinationChangedListener(this);
                            return;
                        }
                        Menu menu = view.getMenu();
                        for (int h = 0, size = menu.size(); h < size; h++) {
                            MenuItem item = menu.getItem(h);
                            if (matchDestination(destination, item.getItemId())) {
                                item.setChecked(true);
                            }
                        }
                    }
                });
    }

这里分别监听了

BottomNavigationView

NavController

NavController

BottomNavigationView

    public static boolean onNavDestinationSelected(@NonNull MenuItem item,
            @NonNull NavController navController) {
        NavOptions.Builder builder = new NavOptions.Builder()
                .setLaunchSingleTop(true)
                .setEnterAnim(R.anim.nav_default_enter_anim)
                .setExitAnim(R.anim.nav_default_exit_anim)
                .setPopEnterAnim(R.anim.nav_default_pop_enter_anim)
                .setPopExitAnim(R.anim.nav_default_pop_exit_anim);
        if ((item.getOrder() & Menu.CATEGORY_SECONDARY) == 0) {
            builder.setPopUpTo(findStartDestination(navController.getGraph()).getId(), false);
        }
        NavOptions options = builder.build();
        try {
            //TODO provide proper api instead of using Exceptions as Control-Flow.
            navController.navigate(item.getItemId(), null, options);
            return true;
        } catch (IllegalArgumentException e) {
            return false;
        }
    }

最终还是会调用

navController.navigate(item.getItemId(), null, options);

这里跟我们要实现的效果很像，但是还有些问题，一个是我们想动态添加底部，不在xml写死；我们在点击底部item的时候不要这个放大缩小动画；切换的时候

Fragment

replace