Android Action Bar : Custom tabs and overflow
I'm having a hard time implementing custom-styled tabs for action bar: I need to make tabs (I mean buttons) use custom graphics for both normal and selected states.
I've been able to kill all the native styling using
<style name="customActionBarTabStyle">
<item name="android:background">#00000000</item>
</style>
and then use Tab.setIcon() to make the tabs look the way I need, but I need them to rea开发者_开发百科ct to switching (by switching between two Drawables - for on and off state).
I've tried creating a Drawable selector like this:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="@drawable/btn_on" />
<item android:drawable="@drawable/btn_off" />
</selector>
but the tabs don't switch to pressed mode when selected.
Also, I've tried calling Tab.setIcon() in TabListener.onTabSelected() and .onTabUnselected() - no luck either.
Does anyone know a good solution to this one?
Also, I need to display a custom view instead of overflow menu - I've already googled up a bunch of "hints" to rethink my UI to "follow the Android way" but the problem is the UI is not actualy mine to rethink - it's customer's :) so I'd really like to find a way to workaround ActionBar's customization shortcomings.
Any suggestions are much appreciated, thanks in advance.
Try using state_selected instead of state_pressed, just trying to do something similar here (changing the background images for the tabs completely) and it seems like that the action bar tabs only enter selected true/false but not the pressed state...
EDIT: Seems like the background property enters that state, but not the text color used on the tabs...
i think that you'll have to use android:selectableItemBackground have a look at this it may help.
Good luck
Just to make the solution more present:
@taf said the solution: you need to set the android:duplicateParentState="true"
in the parent layout you use as a custom view for your tab.
Here is my code and the icon change when selected a tab, and change back when unselected.
public class MainActivity extends FragmentActivity implements ActionBar.TabListener{
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_ACTION_BAR);
setContentView(R.layout.activity_main);
// Set up the action bar.
final ActionBar actionBar = getActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
actionBar.setBackgroundDrawable(null);
icons = new int[] {
R.drawable.ic_facebook,
R.drawable.ic_facebook,
R.drawable.ic_facebook,
R.drawable.ic_facebook,
};
icons_selected = new int[] {
R.drawable.ic_launcher,
R.drawable.ic_launcher,
R.drawable.ic_launcher,
R.drawable.ic_launcher,
};
// For each of the sections in the app, add a tab to the action bar.
for (int i = 0; i < mSectionsPagerAdapter.getCount(); i++) {
// Create a tab with text corresponding to the page title defined by
// the adapter. Also specify this Activity object, which implements
// the TabListener interface, as the callback (listener) for when
// this tab is selected.
actionBar.addTab(
actionBar.newTab()
.setText(mSectionsPagerAdapter.getPageTitle(i))
.setIcon(icons[i])
.setTabListener(this)
);
}
}
and this
@Override
public void onTabSelected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction){
getActionBar().getSelectedTab().setIcon(icons_selected[tab.getPosition()]);
}
@Override
public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction) {
getActionBar().getSelectedTab().setIcon(icons[tab.getPosition()]);
}
@Override
public void onTabReselected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction) {
}
精彩评论