开发者

Android Action Bar : Custom tabs and overflow

开发者 https://www.devze.com 2023-02-18 19:53 出处:网络
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'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) {
    }
0

精彩评论

暂无评论...
验证码 换一张
取 消