I make app with tabbed page.
If i use AppCompat, I can't customize tab, but I can use
moving tab with swipe action.
If i use Holo, I can customize tab, but I can't use
moving tab with swipe action.
My Holo Theme
<resources>
<!--my custom theme-->
<style name="MyTheme"
parent="#android:style/Theme.Holo">
<item name="android:actionBarTabTextStyle">#style/MyActionBarTabText</item>
<item name="android:actionBarTabStyle">#style/MyActionBarTabStyle</item>
<item name="android:background">#FFFFFF</item>
</style>
<!--tab text style-->
<style name="MyActionBarTabText"
parent="#android:style/Widget.Holo.ActionBar.TabText">
<item name="android:textColor">#000000</item>
<item name="android:background">#drawable/tab_selector</item>
</style>
<!--tab style-->
<style name="MyActionBarTabStyle" parent="#android:style/Widget.Holo.ActionBar.TabView">
<!--<item name="android:background">#DCEBF0</item>-->
<item name="android:background">#drawable/tab_selector</item>
<item name="android:layout_width">1dp</item>
</style>
</resources>
my AppCompat Theme
<resources>
<style name="MyTheme" parent="MyTheme.Base">
</style>
<!-- Base theme applied no matter what API -->
<style name="MyTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<!--If you are using revision 22.1 please use just windowNoTitle. Without android:-->
<item name="windowNoTitle">true</item>
<!--We will be using the toolbar so no need to show ActionBar-->
<item name="windowActionBar">false</item>
<!-- Set theme colors from http://www.google.com/design/spec/style/color.html#color-color-palette-->
<!-- You can also set colorControlNormal, colorControlActivated
colorControlHighlight and colorSwitchThumbNormal. -->
<item name="windowActionModeOverlay">true</item>
</style>
</resources>
how can i customize tab and using swipe action?
or can I change only tab theme to Holo in AppCompat?
Using Appcompat, you can still do it programmatically:
Use this code in your OnCreate overwrite method (activity you want to show the tabs):
//Setting TabLayout
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab());
tabLayout.addTab(tabLayout.newTab());
tabLayout.addTab(tabLayout.newTab());
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
//Setting viewPager
final ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
final PagerAdapter adapter = new
PagerAdapter(getSupportFragmentManager(),
tabLayout.getTabCount());
viewPager.setAdapter(adapter);
viewPager.addOnPageChangeListener(new
TabLayout.TabLayoutOnPageChangeListener(tabLayout));
tabLayout.setupWithViewPager(viewPager);
and create a class to you page adapter like this:
public class PagerAdapter extends FragmentStatePagerAdapter {
int mNumOfTabs;
private String[] tabTitles = new String[]{"TAB1", "TAB2", "TAB3"};
public PagerAdapter(FragmentManager fm, int NumOfTabs) {
super(fm);
this.mNumOfTabs = NumOfTabs;
}
#Override
public CharSequence getPageTitle(int position) {
return tabTitles[position];
}
#Override
public Fragment getItem(int position) {
switch (position) {
case 0:
Tab1 tab1 = new Tab1();
return tab1;
case 1:
Tab2 tab2 = new Tab2();
return tab2;
case 2:
Tab3 tab3 = new Tab3();
return tab3;
default:
return null;
}
}
#Override
public int getCount() {
return mNumOfTabs;
}
}
This is how you define a ViewPager in your xml layout file:
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#id/tab_layout"
android:background="#drawable/gradient_grey">
Let me know if it works for you!
Related
I have a TabLayout within a CollapsingToolBar layout. There are three tabs, Tasks, Calendar and Contacts. I defined a style for the TabLayout and a text appearance for the tab text:
<style name="AppTabLayout" parent="Widget.Design.TabLayout">
<item name="tabIndicatorColor">?attr/colorAccent</item>
<item name="tabIndicatorHeight">4dp</item>
<item name="tabPaddingStart">6dp</item>
<item name="tabPaddingEnd">6dp</item>
<item name="tabBackground">?attr/selectableItemBackground</item>
<item name="tabTextAppearance">#style/AppTabTextAppearance</item>
<item name="tabSelectedTextColor">#color/cardview_dark_background</item>
</style>
<style name="AppTabTextAppearance" parent="TextAppearance.Design.Tab">
<item name="android:textSize">22sp</item>
<item name="android:textColor">#android:color/white</item>
<item name="textAllCaps">false</item>
</style>
And added them to my Tablayout:
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
style="#style/AppTabLayout"
app:tabTextAppearance="#style/AppTabTextAppearance"
app:tabMaxWidth="0dp"
app:tabMode="fixed"
app:tabGravity="fill"/>
When I run my app, ONLY the first tab text is affected (Tasks). Does anyone know why and how I'd be able to make all of them look the same?
Here is the snippet of code that sets up the Layout in my main Activity.
fragments.addAll(Arrays.asList(new Calendar(),new Tasks(),new Contacts()));
titles.addAll(Arrays.asList(getResources().getString(R.string.fragment_task_title),
getResources().getString(R.string.fragment_cal_title),getResources().getString(R.string.fragment_contacts_title)));
TabLayout tabLayout = (TabLayout)findViewById(R.id.tabs);
ViewPager viewPager = (ViewPager)findViewById(R.id.container);
ViewPagerAdapter viewPagerAdapter = new ViewPagerAdapter(getSupportFragmentManager(),fragments,titles);
viewPager.setAdapter(viewPagerAdapter);
tabLayout.setupWithViewPager(viewPager);
and here is my ViewPagerAdapterClass:
public class ViewPagerAdapter extends FragmentPagerAdapter {
ArrayList<Fragment> fragments;
ArrayList<String> titles;
public ViewPagerAdapter(FragmentManager fm, ArrayList<Fragment> fragments, ArrayList<String>titles) {
super(fm);
this.fragments = fragments;
this.titles = titles;
}
#Override
public Fragment getItem(int position) {
return fragments.get(position);
}
#Override
public int getCount() {
return fragments.size();
}
#Override
public CharSequence getPageTitle(int position) {
return titles.get(position);
}}
The possible reason is that this size that you have specified is too large. (and the text can't be shown in one line with this size)
so you can try smaller sizes to see if it applies to all tabs or not.
However if you want to have the size that you want (and don't care if the text may be in two lines), add the following line to your dimen resources.
<dimen name="design_tab_text_size_2line" tools:override="true">#dimen/font_size_tab</dimen>
I have two different styles of TabLayout in my app:
<style name="TabLayoutPower" parent="Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#android:color/white</item>
<item name="tabTextColor">#android:color/white</item>
</style>
<style name="TabLayoutFree" parent="Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#android:color/black</item>
<item name="tabTextColor">#android:color/black</item>
</style>
How can I define the default TabLayout style for a theme? I cannot find any info which item name should I use to build my theme. I'd like to add the TabLayout the same way I added my listview:
<style name="Free" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/black</item>
<item name="colorPrimaryDark">#color/black</item>
<item name="colorAccent">#color/main_red</item>
<item name="android:windowBackground">#color/main_bg_light</item>
<item name="android:listViewStyle">#style/MyListView</item>
</style>
For Support Library TabLayout, you can set tabStyle attribute in your theme:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- ... -->
<item name="tabStyle">#style/AppTheme.TabLayout</item>
</style>
<style name="AppTheme.TabLayout" parent="Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#android:color/white</item>
<item name="tabTextColor">#android:color/white</item>
</style>
If you wan to use 2 different styles for your TabLayout based on theme of your application then you should define your style inside attrs.xml
here is the Sample code for that
First you create an attrs.xml file ( Like this )
<?xml version="1.0" encoding="utf-8"?>
<resources>
<attr name="textColor" format="reference|color" />
<attr name="backColor" format="reference|color" />
<attr name="myTabStyle" format="reference" />
</resources>
define various theme as per your requirements inside styles.xml
Note: i have used 3 different themes for demo
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="tabStyle">#style/TabLayoutPower</item>
<item name="textColor">#android:color/white</item>
<item name="backColor">#color/colorPrimary</item>
</style>
<style name="AppTheme2" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#android:color/holo_green_dark</item>
<item name="colorPrimaryDark">#android:color/white</item>
<item name="colorAccent">#android:color/holo_blue_dark</item>
<item name="textColor">#android:color/white</item>
<item name="tabStyle">#style/TabLayoutFree</item>
<item name="backColor">#FF00</item>
</style>
<style name="AppTheme3" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#ff00</item>
<item name="colorPrimaryDark">#ff0</item>
<item name="colorAccent">#0a91d4</item>
<item name="tabStyle">#style/TabLayoutNew</item>
<item name="textColor">#FF00</item>
<item name="backColor">#android:color/white</item>
</style>
<style name="TabLayoutPower" parent="Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#android:color/white</item>
<item name="tabTextColor">#android:color/white</item>
</style>
<style name="TabLayoutFree" parent="Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#android:color/holo_blue_bright</item>
<item name="tabTextColor">#android:color/holo_blue_bright</item>
</style>
<style name="TabLayoutNew" parent="Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#android:color/holo_green_dark</item>
<item name="tabTextColor">#android:color/holo_green_dark</item>
</style>
</resources>
Now use this style in your TabLayout like this inside layout.xml files
Use like this style="?myTabStyle" it will select style based on current theme of your application
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/btnThemeOne"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Theme One" />
<Button
android:id="#+id/btnThemeTwo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Theme Two" />
<Button
android:id="#+id/btnThemeThree"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Theme Three" />
</LinearLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
style="?myTabStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
android:background="#color/colorAccent"
app:tabMode="fixed" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</LinearLayout>
sample code of TabsActivity to change theme
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
import java.util.ArrayList;
import java.util.List;
public class TabsActivity extends AppCompatActivity {
PrefManager prefManager;
private TabLayout tabLayout;
private ViewPager viewPager;
private Button btnThemeOne, btnThemeTwo, btnThemeThree;
#Override
protected void onCreate(Bundle savedInstanceState) {
prefManager = new PrefManager(this);
getTheme().applyStyle(prefManager.getTheme(), true);
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tabs);
btnThemeOne = findViewById(R.id.btnThemeOne);
btnThemeOne.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Toast.makeText(TabsActivity.this, "Applying theme one", Toast.LENGTH_SHORT).show();
prefManager.setTheme(R.style.AppTheme);
recreate();
}
});
btnThemeTwo = findViewById(R.id.btnThemeTwo);
btnThemeTwo.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Toast.makeText(TabsActivity.this, "Applying theme two", Toast.LENGTH_SHORT).show();
prefManager.setTheme(R.style.AppTheme2);
recreate();
}
});
btnThemeThree = findViewById(R.id.btnThemeThree);
btnThemeThree.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Toast.makeText(TabsActivity.this, "Applying theme three", Toast.LENGTH_SHORT).show();
prefManager.setTheme(R.style.AppTheme3);
recreate();
}
});
viewPager = findViewById(R.id.viewpager);
setupViewPager(viewPager);
tabLayout = findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
}
private void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new OneFragment(), "ONE");
adapter.addFragment(new OneFragment(), "TWO");
adapter.addFragment(new OneFragment(), "THREE");
viewPager.setAdapter(adapter);
}
class ViewPagerAdapter extends FragmentPagerAdapter {
private final List<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();
public ViewPagerAdapter(FragmentManager manager) {
super(manager);
}
#Override
public Fragment getItem(int position) {
return mFragmentList.get(position);
}
#Override
public int getCount() {
return mFragmentList.size();
}
public void addFragment(Fragment fragment, String title) {
mFragmentList.add(fragment);
mFragmentTitleList.add(title);
}
#Override
public CharSequence getPageTitle(int position) {
return mFragmentTitleList.get(position);
}
}
}
PrefManager class to save theme info
import android.content.Context;
import android.content.SharedPreferences;
public class PrefManager {
// Shared preferences file name
private final String PREF_NAME = "theme-pref";
private final String THEME = "theme";
SharedPreferences pref;
SharedPreferences.Editor editor;
public PrefManager(Context context) {
pref = context.getSharedPreferences(PREF_NAME, 0);
editor = pref.edit();
}
public int getTheme() {
return pref.getInt(THEME, R.style.AppTheme);
}
public void setTheme(int themeId) {
editor.putInt(THEME, themeId);
editor.commit();
}
}
you can check the output video of above code
https://www.youtube.com/watch?v=uup072IDGd0
You can find that name in Android theme -
<item name="android:tabWidgetStyle">#style/Your.Style</item>
<style name="Base.Widget.Design.TabLayout" parent="">
<item name="tabSelectedTextColor">#android:color/white</item>
<item name="tabTextColor">#android:color/white</item>
</style>
<style name="Free" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/black</item>
<item name="colorPrimaryDark">#color/black</item>
<item name="colorAccent">#color/main_red</item>
<item name="android:windowBackground">#color/main_bg_light</item>
<item name="android:listViewStyle">#style/MyListView</item>
<item name="android:tabWidgetStyle">#style/Base.Widget.Design.TabLayout</item>
</style>
is it possible for actionbar and it's stacked bar(one that contain navigation tabs) to share same background image? one that starts from actionbar and ends at stacked bar?
currently the way am implementing this, am ending up having action bar with it own image and stacked bar with its own.
my styles.xml
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="android:actionMenuTextColor">#color/app_yellow</item>
<item name="android:windowActionBarOverlay">true</item>
<!-- Support library compatibility -->
<item name="actionBarStyle">#style/MyActionBar</item>
<item name="actionMenuTextColor">#color/app_yellow</item>
</style>
<!-- ActionBar styles -->
<style name="MyActionBar" parent="#style/Widget.AppCompat.Light.ActionBar">
<item name="android:titleTextStyle">#style/MyActionBarTitleText</item>
<item name="android:actionBarTabTextStyle">#style/MyActionBarTabText</item>
<item name ="android:actionBarTabStyle">#style/MyTabStyle</item>
<item name="background">#drawable/actionbar</item>
</style>
<!-- individual ActionBar tabs style -->
<style name="MyTabStyle" parent ="Widget.AppCompat.Light.ActionBar.TabView">
<item name ="background">#android:color/transparent</item>
<item name ="android:background">#android:color/transparent</item>
</style>
in my activity
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ActionBar actionBar = getSupportActionBar();
// Specify that tabs should be displayed in the action bar.
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
actionBar.setLogo(R.mipmap.ic_launcher);
actionBar.setDisplayUseLogoEnabled(true);
actionBar.setDisplayShowHomeEnabled(true);
actionBar.setStackedBackgroundDrawable(getResources().getDrawable(R.drawable.actionbar));
From Michael De Soto guidance(see his comment above), i was able to have actionbar and stacked bar share same background image by using a toolbar that has
actionbar details(e.g icons,titles) in views(textview for titles, imageviews for icons etc)
Stacked bar details(basically tabs) in a tablayout.
Here how i implemented it guys
my activity xml
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:id="#+id/mainActivityBar"
android:layout_alignParentTop="true"
android:background="#drawable/actionbar"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetEnd="0dp"
app:contentInsetRight="0dp"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="President"
android:id="#+id/appname_1"
android:background="#android:color/transparent"
android:textColor="#ffffff"
android:layout_marginLeft="20dp" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
style="#style/myCustomTabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:layout_below="#+id/appname_1"
android:layout_alignParentEnd="true"
android:layout_alignParentStart="false"
android:layout_alignParentLeft="false"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="false"
android:layout_alignLeft="#+id/appname_1"
app:tabGravity="fill"
app:tabMode="scrollable"/>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
added the following in my styles.xml
<style name="mainActivityTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="android:windowNoTitle">true</item>
<item name="android:textColorSecondary">#android:color/white</item>
<!--We will be using the toolbar so no need to show ActionBar-->
<item name="android:windowActionBar">false</item>
</style>
<style name="myCustomTabLayout" parent="Widget.Design.TabLayout">
<item name="tabIndicatorColor">?attr/colorAccent</item>
<item name="tabIndicatorHeight">2dp</item>
<item name="tabSelectedTextColor">?android:textColorPrimary</item>
</style>
Finally, my activity
public class MainActivity extends AppCompatActivity {
private SectionsPagerAdapter mSectionsPagerAdapter;
TabLayout tabLayout;
private ViewPager mViewPager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar =(Toolbar) findViewById(R.id.mainActivityBar);
setSupportActionBar(toolbar);
tabLayout = (TabLayout) findViewById(R.id.tabs);
// Create the adapter that will return a fragment for each of the three
// primary sections of the activity.
mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
// Set up the ViewPager with the sections adapter.
mViewPager = (ViewPager) findViewById(R.id.pager);
mViewPager.setAdapter(mSectionsPagerAdapter);
mViewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
tabLayout.setupWithViewPager(mViewPager);
}
public class SectionsPagerAdapter extends FragmentStatePagerAdapter {
public SectionsPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
// getItem is called to instantiate the fragment for the given page.
switch (position) {
case 0:
return Item1fragment.newInstance();
case 1:
return Item2fragment.newInstance();
case 2:
return Item3fragment.newInstance();
}
return null;
}
#Override
public int getCount() {
// Show 3 total pages.
return 3;
}
#Override
public CharSequence getPageTitle(int position) {
Locale l = Locale.getDefault();
switch (position) {
case 0:
return "Item1;
case 1:
return "Item2";
case 2:
return "Item3";
}
return "";
}
}
}
Thanks for your indepth answer OP. For those coming here in future, if you want to display the back button on the toolbar, it will push all the subsequent views in the Toolbar to the side by about 50dp, even when aligned below, even when using app:contentInsetStart="0dp". Because of this, I have just gone for the transparent backgrounds and having a view behind them.
I have used this library and its title text shows in upper case I have referred
this
this
but not getting the correct output.
<style name="AppTheme" parent="#style/Theme.AppCompat.Light">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primary_dark</item>
<item name="colorAccent">#color/accent</item>
<item name="android:textColorPrimary">#color/text_color</item>
<item name="drawerArrowStyle">#style/DrawerArrowStyle</item>
<item name="android:actionBarTabTextStyle">#style/tab</item>
<item name="actionBarTabTextStyle">#style/tab</item>
<item name="android:windowBackground">#color/window_background</item>
<item name="colorControlNormal">#color/accent</item>
<item name="colorControlActivated">#color/secondary_text</item>
<item name="colorControlHighlight">#color/secondary_text</item>
<item name="android:homeAsUpIndicator">#drawable/ic_menu</item>
</style>
and
<style name="tab" parent="#style/Widget.AppCompat.Light.ActionBar.TabText">
<item name="android:textAllCaps">false</item>
</style>
fragment.java:
tabHost = (MaterialTabHost) v.findViewById(R.id.tabHost);
adapter = new TabsPagerAdapter(getChildFragmentManager(), entity);
pager = (ViewPager) v.findViewById(R.id.pager_entitiy_detail);
pager.setOffscreenPageLimit(adapter.getCount());
pager.setAdapter(adapter);
adapter.notifyDataSetChanged();
pager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
#Override
public void onPageSelected(int position) {
tabHost.setSelectedNavigationItem(position);
Log.e("DashDetail", "");
}
});
// insert all tabs from pagerAdapter data
for (int i = 0; i < adapter.getCount(); i++) {
tabHost.addTab(
tabHost.newTab()
.setText(adapter.getPageTitle(i))
.setTabListener(this)
);
}
used above code for tab host and in adapter setting text but not getting lower case text.
Try this in your for loop of adding tabs
try this
TextView tv = (TextView) tabHost.getTabWidget().getChildAt(i).findViewById(android.R.id.title);
tv.setAllCaps(false);
like this:--
for (int i = 0; i < adapter.getCount(); i++) {
tabHost.addTab(
tabHost.newTab()
.setText(adapter.getPageTitle(i))
.setTabListener(this)
TextView tv = (TextView) tabHost.getTabWidget().getChildAt(i).findViewById(android.R.id.title);
tv.setAllCaps(false);
);
or You can do it like below in your PagerAdapter
#Override
public CharSequence getPageTitle(int position) {
Locale l = Locale.getDefault();
switch (position) {
case 0:
return "ONE".toLowerCase();
}
return null;
}
I hope it may help.
thank you ,i have done what suggest in answer as shown above but still not worked so i have made changes in library by go through it code and analyse it. and i found that there is mentioned .toUpperCase() and i remove from there and it works.
I want to customize the sherlock actionbar and its tab.
As I have to show an app icon image in approximate 100-150dp size and bottom the app icon i have to display tab.
Just like this way
So I tried this code in styles
<style name="Theme.Style.Login" parent="#style/Theme.Sherlock.Light">
<!-- For API level <11--->
<item name="actionBarStyle">#style/Theme.white_style</item>
<item name="actionBarTabStyle">#style/customLoginActionBarTabStyle</item>
<item name="actionBarTabBarStyle">#style/customLoginActionBarTabDividerStyle</item>
<!-- For API level <11--->
<!-- For API level >=11--->
<item name="android:actionBarTabBarStyle">#style/customLoginActionBarTabStyle</item>
<item name="android:actionBarStyle">#style/Theme.white_style</item>
<item name="android:actionBarTabBarStyle">#style/customLoginActionBarTabDividerStyle</item>
<!-- For API level >=11--->
</style>
<!-- Signup Login Tab Style theme -->
<style name="customLoginActionBarTabStyle" parent="#style/Widget.Sherlock.Light.ActionBar.TabView">
<item name="android:background">#drawable/actionbar_tabs_selector_loginsignup</item>
</style>
<style name="customLoginActionBarTabDividerStyle" parent="#style/Widget.Sherlock.ActionBar.TabBar">
<item name="divider">#null</item>
<item name="android:divider">#null</item>
</style>
<style name="Theme.white_style" parent="#style/Theme.Sherlock.Light">
<item name="actionBarSize">#dimen/loginactionbar</item>
<item name="android:actionBarSize">#dimen/loginactionbar</item>
</style>
and so on.
And here is my activity code
public class SignupLoginActivity extends SherlockActivity implements ActionBar.TabListener {
public static int THEME = R.style.Theme_Style_Login;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setTheme(THEME);
setContentView(R.layout.main);
ActionBar actionBar = getSupportActionBar();
actionBar.setCustomView(R.layout.login_actionbar_customeview);
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setLogo(null);
View homeIcon = findViewById(
Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB ?
android.R.id.home : R.id.abs__home);
((View) homeIcon.getParent()).setVisibility(View.GONE);
((View) homeIcon).setVisibility(View.GONE);
/*
* For adding tab
*/
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
for (int i = 1; i <= 2; i++) {
ActionBar.Tab tab = actionBar.newTab();
tab.setText("Tab " + i);
tab.setTabListener(this);
actionBar.addTab(tab);
}
}
#Override
public void onTabSelected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
}
#Override
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
}
#Override
public void onTabReselected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
}
}
So in this case I am able to increase Actionbar height but ActionBar Tab are not showing so how to achieve the result which i want.
Finally I achived the desire solution by this way
<!-- For API Level <11 -->
<style name="Theme.Style.Login" parent="#style/Theme.Sherlock.Light">
<item name="actionBarTabStyle">#style/customLoginActionBarTabStyle</item>
<item name="actionBarDivider">#null</item> // This will remove divider between tabs
<item name="actionBarTabTextStyle">#style/customeLoginTabTextStyle</item> // This will increase tab text size
<item name="actionBarSize">#dimen/loginactionbar</item> // This will increase actionbar size
</style>
<!-- For API Level <11 -->
<!-- For API Level >=11 -->
<style name="Theme.Style.Login" parent="#style/Theme.Sherlock.Light">
<item name="android:actionBarTabStyle">#style/customLoginActionBarTabStyle</item>
<item name="actionBarDivider">#null</item> // This will remove divider between tabs
<item name="android:actionBarTabTextStyle">#style/customeLoginTabTextStyle</item> // This will increase tab text size
<item name="android:actionBarSize">#dimen/loginactionbar</item> // This will increase actionbar size
</style>
<!-- For API Level >=11 -->
<!-- For API Level >=14 -->
<style name="Theme.Style.Login" parent="#style/Theme.Sherlock.Light">
<item name="android:actionBarTabStyle">#style/customLoginActionBarTabStyle</item>
<item name="android:actionBarDivider">#null</item> // This will remove divider between tabs
<item name="android:actionBarTabTextStyle">#style/customeLoginTabTextStyle</item> // This will increase tab text size
<item name="android:actionBarSize">#dimen/loginactionbar</item> // This will increase actionbar size
</style>
<!-- For API Level >=14 -->
<!-- Signup Login Tab Style theme -->
<style name="customLoginActionBarTabStyle" parent="#style/Widget.Sherlock.Light.ActionBar.TabView">
<item name="android:background">#drawable/actionbar_tabs_selector_loginsignup</item>
<item name="android:paddingTop">20dp</item>
</style>
<style name="customeLoginTabTextStyle" parent="Widget.Sherlock.ActionBar.TabText">
<item name="android:textColor">#color/countryname</item>
<item name="android:textSize">#dimen/logintabtxtsize</item>
</style>