Android native Android ActionBar Tab (sliding) navigation, androidactionbar

Android native Android ActionBar Tab (sliding) navigation, androidactionbar
Content

• Environment
• Project Structure
• Demonstration 1: ActionBar Tab navigation
• Demonstration 2: ActionBar Tab with sliding navigation

 
This article demonstrates the Tab navigation. The first demonstration is the basic Tab navigation, and the second is the Tab navigation with sliding.

 
In addition, I personally think that through this example, I can know how to create and initialize the Fragment and put the Fragment in the "container. The container can be either LinearLayout, RelativeLayout, or ViewGroup. This is similar to the implementation of initializing Web application pages, which has plagued me for a long time. I cannot write my own Android APP without solving this problem.
 
Fragment. This idea is good. It is added to Android 3.0. With Fragment, You Can modularize the Activity. It seems that the current page uses the concept of div (layer). I think this probably draws on the concept of photoshop layer.

Download Demo Environment

• Windows 2008 R2 64-bit
• Eclipse ADT V22.6.2, Android 4.4.2 (API 19)
• SAMSUNG GT-8618, Android OS 4.1.2

 

Project Structure

Figure 1 project structure figure 2 Main Program Interface

1, the only thing you need to note is that,DummiyFragment1AndDummiyFragment2Although the content is identical, they inherit different classes.DummiyFragment1InheritanceAndroid. app. Fragment, AndDummiyFragment2InheritanceAndroid. support. v4.Fragment.

 

Demo ActionBar Tab navigation

Figure 3 Tab navigation

The core code is as follows:

public class ActionBarTabNavTest extends Activity implements

        ActionBar.TabListener {

    private static final String SELECTED_ITEM = "selected_item";

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_tabnav);

        final ActionBar actionBar = getActionBar();

// Set the Navigation Mode of the ActionBar: Tab navigation

        actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

// Add three Tab pages in sequence and add event listeners for the three Tab labels

        actionBar

. AddTab (actionBar. newTab (). setText ("first page"). setTabListener (this ));

        actionBar

. AddTab (actionBar. newTab (). setText ("second page"). setTabListener (this ));

        actionBar

. AddTab (actionBar. newTab (). setText ("Third page"). setTabListener (this ));

    }

    @Override

    public void onRestoreInstanceState(Bundle savedInstanceState) {

        if (savedInstanceState.containsKey(SELECTED_ITEM)) {

// Select the Fragment page corresponding to the previously saved index

            getActionBar().setSelectedNavigationItem(

                    savedInstanceState.getInt(SELECTED_ITEM));

        }

    }

// Save the index of the currently selected Fragment page to Bundle

    @Override

    public void onSaveInstanceState(Bundle outState) {

        outState.putInt(SELECTED_ITEM, getActionBar()

                .getSelectedNavigationIndex());

    }

    @Override

    public void onTabUnselected(ActionBar.Tab tab,

            FragmentTransaction fragmentTransaction) {

    }

// This method is triggered when the specified Tab is selected.

    @Override

    public void onTabSelected(ActionBar.Tab tab,

            FragmentTransaction fragmentTransaction) {

// Create a new Fragment object

        Fragment fragment = new DummyFragment1();

// Create a Bundle object for passing parameters to Fragment

        Bundle args = new Bundle();

        args.putInt(DummyFragment2.ARG_SECTION_NUMBER, tab.getPosition() + 1);

// Input parameters to fragment

        fragment.setArguments(args);

// Get the FragmentTransaction object

        FragmentTransaction ft = getFragmentManager().beginTransaction();

// Use fragment to replace the Activity iner component in the Activity

        ft.replace(R.id.container, fragment);

// Submit the transaction

        ft.commit();

    }

    @Override

    public void onTabReselected(ActionBar.Tab tab,

            FragmentTransaction fragmentTransaction) {

    }

}

 

Demo ActionBar Tab with sliding navigation

Figure 4 Tab navigation

The core code is as follows:

public class ActionBarTabSwipeNavTest extends FragmentActivity implements

        ActionBar.TabListener {

    ViewPager viewPager;

    ActionBar actionBar;

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_tabswipenav);

// Obtain the ActionBar object

        actionBar = getActionBar();

// Obtain ViewPager

        viewPager = (ViewPager) findViewById(R.id.pager);

// Create a FragmentPagerAdapter object that provides multiple Fragment for ViewPager

        FragmentPagerAdapter pagerAdapter = new FragmentPagerAdapter(

                getSupportFragmentManager()) {

// Obtain the Fragment at the position

            @Override

            public Fragment getItem(int position) {

                Fragment fragment = new DummyFragment2();

                Bundle args = new Bundle();

                args.putInt(DummyFragment2.ARG_SECTION_NUMBER, position + 1);

                fragment.setArguments(args);

                return fragment;

            }

// The return value I of this method indicates the total number of Fragment contained by the Adapter.

            @Override

            public int getCount() {

                return 3;

            }

// The return value of this method determines the title of each Fragment.

            @Override

            public CharSequence getPageTitle(int position) {

                switch (position) {

                case 0:

Return "first page ";

                case 1:

Return "Page 2 ";

                case 2:

Return "Page 3 ";

                }

                return null;

            }

        };

// Set ActionBar to use Tab navigation

        actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

// Traverse all Fragment contained in the pagerAdapter object.

// Create a Tab for each Fragment

        for (int i = 0; i < pagerAdapter.getCount(); i++) {

            actionBar

                    .addTab(actionBar.newTab()

                            .setText(pagerAdapter.getPageTitle(i))

                            .setTabListener(this));

        }

// Set the FragmentPagerAdapter for the ViewPager component

        viewPager.setAdapter(pagerAdapter); // ①

// Bind an event listener to the ViewPager component

        viewPager

                .setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {

// This method is triggered when the Fragment displayed by ViewPager changes

                    @Override

                    public void onPageSelected(int position) {

                        actionBar.setSelectedNavigationItem(position);

                    }

                });

    }

    @Override

    public void onTabUnselected(ActionBar.Tab tab,

            FragmentTransaction fragmentTransaction) {

    }

// This method is triggered when the specified Tab is selected.

    @Override

    public void onTabSelected(ActionBar.Tab tab,

            FragmentTransaction fragmentTransaction) {

        viewPager.setCurrentItem(tab.getPosition()); // ②

    }

    @Override

    public void onTabReselected(ActionBar.Tab tab,

            FragmentTransaction fragmentTransaction) {

    }

}

 

Download Demo

Which tab navigation bar or button can be used for the layout under the android program?

Before android4.0, you can use TabHost or TabActivity. After android4.0, The ActionBar will include the tab control.

How does one slide the android navigation bar (slide the slider along with the page), and there is a demo?

Simple Actionbar with ViewPager. In eclipse, you select a new Activity, blank activity, and then select ActionBar tabs with ViewPager in Navigation type. This will generate a demo for you.