How to Make Android Apps 26
In this tutorial I’ll create an Android Tab Layout example program. It will show how easy it is to create the tabs and then open new fragments on screen when they are clicked. Everything works easily when we use the callback interface TabListener.
In the next video we’ll make it so we can swipe through our fragments. All of the code used can be found below under the video.
If you like videos like this, it helps to tell Google with a click here [googleplusone]
Code From the Video
If you get an error use this AndroidManifest.xml file
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.newthinktank.derekbanas.androidtabs" > <application android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@android:style/Theme.Holo" > <activity android:name=".MainActivity" android:label="@string/app_name" > <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> </application> </manifest> |
tab_fragment_1.xml
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <!-- Do the same for tab_fragment_2 and tab_fragment_3 --> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Tab Fragment 1" android:textSize="16sp"/> </LinearLayout> |
TabFragment1.java
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
package com.newthinktank.derekbanas.androidtabs; import android.app.Fragment; import android.os.Bundle; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; // Do the same for TabFragment2 and TabFragment3 // Just change R.layout.tab_fragment_1 public class TabFragment1 extends Fragment{ @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View rootView = inflater.inflate(R.layout.tab_fragment_1, null); return rootView; } } |
activity_main.xml
|
1 2 3 4 5 |
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/fragmentContainer" android:layout_width="match_parent" android:layout_height="match_parent" /> |
TabListener.java
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
package com.newthinktank.derekbanas.androidtabs; import android.app.ActionBar; import android.app.Fragment; import android.app.FragmentTransaction; // The TabListener is a callback interface which is invoked when a tab action occurs public class TabListener implements ActionBar.TabListener { // Fragment that gets passed so we can switch fragments when a tab is clicked Fragment fragment; // Receive the fragment we will place in activity_main public TabListener(Fragment fragment) { this.fragment = fragment; } // Replace the current fragment with the one passed @Override public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) { ft.replace(R.id.fragmentContainer, fragment); } // Remove the fragment when a tab is unselected @Override public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction ft) { ft.remove(fragment); } @Override public void onTabReselected(ActionBar.Tab tab, FragmentTransaction ft) { } } |
MainActivity.java
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 |
package com.newthinktank.derekbanas.androidtabs; import android.app.ActionBar; import android.app.Activity; import android.app.Fragment; import android.os.Bundle; public class MainActivity extends Activity{ ActionBar.Tab tab1, tab2, tab3; // Fragments that will load when the tabs are clicked Fragment fragment1 = new TabFragment1(); Fragment fragment2 = new TabFragment2(); Fragment fragment3 = new TabFragment3(); @SuppressWarnings("deprecation") @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ActionBar actionBar = getActionBar(); // Set the current navigation mode to tabs actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); // Add titles to tabs tab1 = actionBar.newTab().setText("Tab1"); tab2 = actionBar.newTab().setText("Tab2"); tab3 = actionBar.newTab().setText("Tab3"); // Set tab listeners which provide callbacks for tab events // A callback informs another class when an action occurs tab1.setTabListener(new TabListener(fragment1)); tab2.setTabListener(new TabListener(fragment2)); tab3.setTabListener(new TabListener(fragment3)); // Adds tabs to the actionbar actionBar.addTab(tab1); actionBar.addTab(tab2); actionBar.addTab(tab3); } } |
Leave a Reply