Android Tutorial: Android Fragment Tab Example | Bottom Fragment Tab

http://androidcodeblogspot.blogspot.in/2014/02/android-fragment-tab-example-bottom.html

Android Fragment Tab Example | Bottom Fragment Tab | Custom Tab Item

Hello Friends Today I will write code for Fragment Tab at Bottom .

Step 1 : Create a project BottomTabFragment

Step 2 :  MainActivity.java

package com.smart.sms;

import android.os.Bundle;
import android.content.Context;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentTabHost;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.TabHost.TabSpec;

public class MainActivity extends FragmentActivity {

private static final String TAB_1_TAG = "tab_1";
private static final String TAB_2_TAG = "tab_2";
private static final String TAB_3_TAG = "tab_3";

private FragmentTabHost mTabHost;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
InitView();
}
@Override
protected void onDestroy() {
// TODO Auto-generated method stub
super.onDestroy();

}

private void InitView() {
mTabHost = (FragmentTabHost)findViewById(android.R.id.tabhost);
mTabHost.setup(this, getSupportFragmentManager(), R.id.realtabcontent);

mTabHost.addTab(setIndicator(MainActivity.this,mTabHost.newTabSpec(TAB_1_TAG),
R.drawable.tab_indicator_gen,"Audio",R.drawable.genres_icon),Tab1Container.class,null);
mTabHost.addTab(setIndicator(MainActivity.this,mTabHost.newTabSpec(TAB_2_TAG),
      R.drawable.tab_indicator_gen,"Video",R.drawable.genres_icon),Tab2Container.class,null);
mTabHost.addTab(setIndicator(MainActivity.this,mTabHost.newTabSpec(TAB_3_TAG),
      R.drawable.tab_indicator_gen,"Latest",R.drawable.genres_icon),Tab3Container.class,null);

}

@Override
public void onBackPressed() {
boolean isPopFragment = false;
String currentTabTag = mTabHost.getCurrentTabTag();

if (currentTabTag.equals(TAB_1_TAG)) {
isPopFragment = ((BaseContainerFragment)getSupportFragmentManager().findFragmentByTag(TAB_1_TAG)).popFragment();
} else if (currentTabTag.equals(TAB_2_TAG)) {
isPopFragment = ((BaseContainerFragment)getSupportFragmentManager().findFragmentByTag(TAB_2_TAG)).popFragment();
}
else if (currentTabTag.equals(TAB_3_TAG)) {
isPopFragment = ((BaseContainerFragment)getSupportFragmentManager().findFragmentByTag(TAB_3_TAG)).popFragment();
}

if (!isPopFragment) {
finish();
}
}

private TabSpec setIndicator(Context ctx, TabSpec spec,
int resid, String string, int genresIcon) {
View v = LayoutInflater.from(ctx).inflate(R.layout.tab_item, null);
v.setBackgroundResource(resid);
TextView tv = (TextView)v.findViewById(R.id.txt_tabtxt);
ImageView img = (ImageView)v.findViewById(R.id.img_tabtxt);

tv.setText(string);
img.setBackgroundResource(genresIcon);
return spec.setIndicator(v);
}

}

Step 3 : activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical" >

<FrameLayout

android:id="@+id/realtabcontent"

android:layout_width="match_parent"

android:layout_height="0dip"

android:layout_weight="1" />

<android.support.v4.app.FragmentTabHost

android:id="@android:id/tabhost"

android:layout_width="match_parent"

android:layout_height="wrap_content"

<FrameLayout

android:id="@android:id/tabcontent"

android:layout_width="0dip"

android:layout_height="0dip"

android:layout_weight="0" />

</android.support.v4.app.FragmentTabHost>

</LinearLayout>

Step 3.1 : Create a drawable folder in res and create tab_indicator_gen.xml ,download image from here

Step 3.2 : tab_indicator_gen.xml

<?xml version="1.0" encoding="utf-8"?>

</selector>

Step 4 : tab_item.xml

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:orientation="vertical"

<TextView

android:id="@+id/txt_tabtxt"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_below="@+id/img_tabtxt"

android:layout_marginTop="2dp"

android:textSize="13dp"

android:layout_centerHorizontal="true"

android:text="Medium Text"

android:textColor="@android:color/white"

android:textStyle="bold"

android:textAppearance="?android:attr/textAppearanceMedium" />

<ImageView

android:id="@+id/img_tabtxt"

android:layout_width="33dp"

android:layout_height="30dp"

android:layout_centerHorizontal="true"

android:layout_marginTop="10dp"

</RelativeLayout>

Step 5 : BaseContainerFragment.java

package com.smart.sms;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentTransaction;

import android.util.Log;

public class BaseContainerFragment extends Fragment {

public void replaceFragment(Fragment fragment, boolean addToBackStack) {

FragmentTransaction transaction = getChildFragmentManager().beginTransaction();

if (addToBackStack) {

transaction.addToBackStack(null);

}

transaction.replace(R.id.container_framelayout, fragment);

transaction.commit();

getChildFragmentManager().executePendingTransactions();

}

public boolean popFragment() {

Log.e("Ritesh", "pop fragment: " + getChildFragmentManager().getBackStackEntryCount());

boolean isPop = false;

if (getChildFragmentManager().getBackStackEntryCount() > 0) {

isPop = true;

getChildFragmentManager().popBackStack();

}

return isPop;

}

Step 6 : container_framelayout.xml

<?xml version="1.0" encoding="utf-8"?>

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:id="@+id/container_framelayout"

android:layout_width="match_parent"

android:layout_height="match_parent">

</FrameLayout>

Step 7 : Tab1Container.java

package com.smart.sms;

import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class Tab1Container extends BaseContainerFragment {

private boolean IsViewInited;

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
Log.e("Ritesh", "Tab1");
return inflater.inflate(R.layout.container_fragment, null);
}

@Override
public void onActivityCreated(Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
if (!IsViewInited) {
IsViewInited = true;
initView();
}
}

private void initView() {
replaceFragment(new AudioFragment(), false);
}

}

Step8 : Tab2Container.java

package com.smart.sms;

import android.os.Bundle;

import android.util.Log;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

public class Tab2Container extends BaseContainerFragment {

private boolean IsViewInited;

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

Log.e("Ritesh", "Tab2");

return inflater.inflate(R.layout.container_fragment, null);

}

@Override

public void onActivityCreated(Bundle savedInstanceState) {

super.onActivityCreated(savedInstanceState);

if (!IsViewInited) {

IsViewInited = true;

initView();

}

private void initView() {

replaceFragment(new VideoFragment(), false);

}

Step 9: Tab3Container.java

package com.smart.sms;

import android.os.Bundle;

import android.util.Log;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

public class Tab3Container extends BaseContainerFragment {

private boolean IsViewInited;

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

Log.e("Ritesh", "Tab3");

return inflater.inflate(R.layout.container_fragment, null);

}

@Override

public void onActivityCreated(Bundle savedInstanceState) {

super.onActivityCreated(savedInstanceState);

if (!IsViewInited) {

IsViewInited = true;

initView();

}

private void initView() {

replaceFragment(new LatestFragment(), false);

}

Step 10: AudioFragment.java

package com.smart.sms;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.TextView;

public class AudioFragment extends Fragment{

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container,

Bundle savedInstanceState) {

// TODO Auto-generated method stub

return inflater.inflate(R.layout.audio, container, false);

}

@Override

public void onActivityCreated(Bundle savedInstanceState) {

// TODO Auto-generated method stub

super.onActivityCreated(savedInstanceState);

TextView tv=(TextView)getActivity().findViewById(R.id.textset);

tv.setText("Audio");

}

Step 11 : audio.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<TextView
android:id="@+id/textset"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textColor="#00FF00"
android:gravity="center"
android:textSize="35sp"
android:background="@android:color/black"
android:textStyle="bold"

android:textAppearance="?android:attr/textAppearanceLarge" />

</RelativeLayout>

Step 12 : LatestFragment.java

package com.smart.sms;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.TextView;

public class LatestFragment extends Fragment{

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container,

Bundle savedInstanceState) {

// TODO Auto-generated method stub

return inflater.inflate(R.layout.audio, container, false);

}

@Override

public void onActivityCreated(Bundle savedInstanceState) {

// TODO Auto-generated method stub

super.onActivityCreated(savedInstanceState);

TextView tv=(TextView)getActivity().findViewById(R.id.textset);

tv.setText("Latest");

}

Step 13 : VideoFragment.java

package com.smart.sms;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.view.LayoutInflater;

import android.view.View;

import android.view.View.OnClickListener;

import android.view.ViewGroup;

import android.widget.TextView;

public class VideoFragment extends Fragment implements OnClickListener{

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container,

Bundle savedInstanceState) {

// TODO Auto-generated method stub

return inflater.inflate(R.layout.audio, container, false);

}

@Override

public void onActivityCreated(Bundle savedInstanceState) {

// TODO Auto-generated method stub

super.onActivityCreated(savedInstanceState);

TextView tv=(TextView)getActivity().findViewById(R.id.textset);

tv.setText("Video");

tv.setOnClickListener(this);

}

@Override

public void onClick(View arg0) {

// TODO Auto-generated method stub

((BaseContainerFragment)getParentFragment()).replaceFragment(new VideoDescription(), true);

}

Step 14: VideoDescription.java

package com.smart.sms;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.TextView;

public class VideoDescription extends Fragment{

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container,

Bundle savedInstanceState) {

// TODO Auto-generated method stub

return inflater.inflate(R.layout.audio, container, false);

}

@Override

public void onActivityCreated(Bundle savedInstanceState) {

// TODO Auto-generated method stub

super.onActivityCreated(savedInstanceState);

TextView tv=(TextView)getActivity().findViewById(R.id.textset);

tv.setText("Video Description");

}

Step 15 : AndroidManifest

<?xml version="1.0" encoding="utf-8"?>

<manifest xmlns:android="http://schemas.android.com/apk/res/android"

package="com.smart.sms"

android:versionCode="1"

android:versionName="1.0" >

<uses-sdk

android:minSdkVersion="8"

android:targetSdkVersion="8" />

<application

android:allowBackup="true"

android:icon="@drawable/ic_launcher"

android:label="@string/app_name"

android:theme="@style/AppTheme" >

<activity

android:name="com.smart.sms.MainActivity"

android:label="@string/app_name" >

<intent-filter>

</intent-filter>

</activity>

</application>

</manifest>

Step 16 : Run The Project

Android Tutorial

Monday 8 June 2015

Android Fragment Tab Example | Bottom Fragment Tab | Custom Tab Item

Android Fragment Tab Example | Bottom Fragment Tab | Custom Tab Item

No comments:

Post a Comment

Blog Archive

Total Pageviews

Google Ad