Stacked ActionBar Tab with Custom View Not Displaying Properly

问题

When using action bar tabs, sometimes they are displayed as "stacked" when tab content is too large for the display. A problem arises when I use a custom view for the tab content, it causes the selected tab to not be displayed in the dropdown, and once a tab is selected, the dropdown goes away, and small, empty tabs appear.

Here is a screenshot of the dropdown, before selecting an item: (note that the content of the tab is not displayed, even when the tab is selected)

Also, after selecting the item, the tabs are no longer stacked, and the content of the tabs is empty:

Here is my code, (note that I am using a custom view for the tabs just to demonstrate the problem)

public class ExampleActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        final TextView selectedTabText = new TextView(this);
        setContentView(selectedTabText);

        ActionBar.TabListener listener = new ActionBar.TabListener() {
            @Override
            public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) {
                TextView customView = (TextView) tab.getCustomView();
                selectedTabText.setText(customView.getText());
            }

            @Override
            public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction ft) {

            }

            @Override
            public void onTabReselected(ActionBar.Tab tab, FragmentTransaction ft) {

            }
        };

        ActionBar actionBar = getActionBar();
        actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
        addTab(actionBar, listener, "Tab one with a very long name");
        addTab(actionBar, listener, "Tab two with a very long name");
        addTab(actionBar, listener, "Tab three with a very long name");
        addTab(actionBar, listener, "Tab four with a very long name");
    }

    private void addTab(ActionBar actionBar, ActionBar.TabListener listener, String text) {
        ActionBar.Tab tab = actionBar.newTab();
        TextView textView = new TextView(this);
        textView.setText(text);
        tab.setCustomView(textView);
        tab.setTabListener(listener);
        actionBar.addTab(tab);
    }
}

回答1:

This is a known bug, and has already been reported to the bug tracker:

https://code.google.com/p/android/issues/detail?id=41392

In order to work around this, I disabled the actionbar collapsing behavior with a nasty hack. The following method should be called from the onStart activity method:

/**
 * SUPER hack to disable tab collapsing with smaller screens, which doesn't allow custom tab bar views to be used
 * https://code.google.com/p/android/issues/detail?id=41392
 */
private void disableCollapsibleTabs() {
    try {
        ActionBar actionBar = getActionBar();
        Field actionViewField = actionBar.getClass().getDeclaredField("mTabScrollView");
        actionViewField.setAccessible(true);
        Object mTabScrollView =  actionViewField.get(actionBar);

        Method setAllowCollapse = mTabScrollView.getClass().getDeclaredMethod("setAllowCollapse", boolean.class);
        setAllowCollapse.setAccessible(true);
        setAllowCollapse.invoke(mTabScrollView, false);

    } catch (Exception e) {
        Log.e("", "Error while disabling actionbar collapsible tabs", e);
    }
}

回答2:

Edit: Ended up using

<android.support.design.widget.TabLayout
    android:id="@+id/tabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/tint" />`

and not the deprecated Tabs of ActionBar. This will not collapse the tabbar on orientation change but it seems apps of google and facebook do the same(i guess).

Update: Seems it didn't work, it was just a side effect. It seems to be a timing problem -> when the code in onConfigurationChanged needs a bit time, the problem seems to be gone. This really dirty hack finally worked but it is not a solution(and not recommended, perhaps a hint for somebody else to find it):

@Override
public void onConfigurationChanged(Configuration newConfig) {

    try {
        Thread.sleep(100);
    } catch (InterruptedException e) {
        e.printStackTrace();
    }
   super.onConfigurationChanged(newConfig);

}

For me this worked when called in my Fragment. Hope it helps.

@Override
public void onConfigurationChanged(Configuration newConfig) {
    final ActionBar actionBar = getActivity()).getSupportActionBar();
    actionBar.invalidateOptionsMenu();
}

回答3:

Just reset your custom Tab when onConfigurationChanged method called. It is worked for me. Hope it helps.

@Override
public void onConfigurationChanged(Configuration newConfig) {

    try {
        Thread.sleep(100);
        actionBar.getTabAt(0).setCustomView(/*your custom view*/);
    } catch (InterruptedException e) {
        e.printStackTrace();
    }
    super.onConfigurationChanged(newConfig);


}

来源：https://stackoverflow.com/questions/21392818/stacked-actionbar-tab-with-custom-view-not-displaying-properly

标签

android

android-actionbar