Android achieves breadcrumb effect and supports Fragment linkage

Android achieves breadcrumb effect and supports Fragment linkage

Since the design map UI sister gave contains the breadcrumb effect, I went to Github for a tour, there is no special suitable, can only be implemented by myself.

Take a look at the renderings:

Add fragments one by one and press the Return key to go back one by one:

Now look at the scenario where you add fragments one by one and select TAB:

The demo address

BreadCrumbsView

use

1. Introduce BreadCrumbsView into the layout

<com.tinytongtong.breadcrumbs.BreadCrumbsView
        android:id="@+id/breadCrumbs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
Copy the code

2. Set the listener of the BreadCrumbsView

breadCrumbsView.setOnTabListener(new BreadCrumbsView.OnTabListener() {
    @Override
    public void onAdded(BreadCrumbsView.Tab tab) {
        Log.e("BreadCrumbsView"."BreadCrumbsView.OnTabListener#onAdded tab:" + tab.getIndex());
        addFragment(tab);
    }

    @Override
    public void onActivated(BreadCrumbsView.Tab tab) {
        Log.e("BreadCrumbsView"."BreadCrumbsView.OnTabListener#onActivated tab:" + tab.getIndex());
    }

    @Override
    public void onRemoved(BreadCrumbsView.Tab tab) {
        Log.e("BreadCrumbsView"."BreadCrumbsView.OnTabListener#onRemoved tab:"+ tab.getIndex()); removeLastFragment(); }});Copy the code

BreadCrumbsView. OnTabListener# onAdded way is through BreadCrumbsView# addTab (tabName, value) method to add the TAB after a successful triggered the callback, here need fragments can be added, See the addFragment method example below:

private void addFragment(BreadCrumbsview.tab Tab) {// TODO: 2020/5/26 3:26pm Add your own Fragment here, Tab#getValue returns the data that was passed in when you created the Tab. You can create your own Fragment based on this data
    Fragment fragment = BlankFragment.newInstance(String.format("I am the %d Fragment", tab.getIndex()), "" + tab.getIndex());
    getSupportFragmentManager()
            .beginTransaction()
            .add(R.id.container, fragment, String.valueOf(tab.getIndex()))
            .show(fragment)
            .addToBackStack(null)
            .commit();
    fragments.add(fragment);
}
Copy the code

BreadCrumbsView. OnTabListener# onActivated way is through by clicking on the switch to the already existing TAB, change the TAB to activate again will call this method, it can do some refresh corresponding to the operation of the fragments.

TAB BreadCrumbsView. OnTabListener# onRemoved method to remove after the start of the operation, here generally call removeLastFragment () method can, here to see the code sample:

/** * Remove the last Fragment, display the penultimate Fragment */ private voidremoveLastFragment() {
    if (fragments != null && fragments.size() > 1) {
        getSupportFragmentManager().popBackStackImmediate();
        fragments.removeLast();
        FragmentManager fragmentManager = getSupportFragmentManager();
        fragmentManager.beginTransaction()
                .show(fragments.getLast())
                .commit();
        fragmentManager.executePendingTransactions();
    }
}
Copy the code

3. Improve the method of adding and deleting

To add a TAB, the BreadCrumbsView#addTab(String content, Map

value) method is needed.
,>

The value contains information attached to the TAB. When creating a Fragment, you can use tab.getValue() to retrieve the data passed in before.

4. Change as needed

The current BreadCrumbsView container is realized by RecyclerView. The width of item is the package content, and the maximum width is one-third of the screen width, which can be changed as needed.

Fragment removal operations are now removed one by one from the Fragment stack. If there is a better way, please contact us.