ActionBar 在 pre-ICS 设备上溢出

Question

我正在开发一个需要与 Android 2.2+ 兼容的应用程序，它使用 ActionBarSherlock 在 ICS 之前的设备上自定义 ActionBar。

我只在 2.2 和 2.3 设备上遇到了一个问题，即使内容适合设备屏幕，ActionBar 的内容也会溢出。像这样的：

我已经（在模拟器上）测试了运行 Android 4.0 的设备屏幕尺寸（320x480 上的 mdpi），它工作正常，所以我认为问题与 ActionBarSherlock 有关。

我也尝试过大幅减少我的图标文件，但即使图像更小，内容仍然溢出。

这是我的 styles.xml 文件：

<style name="AppBaseTheme" parent="Theme.Sherlock.Light.DarkActionBar">
</style>

<style name="AppTheme" parent="AppBaseTheme">
    <item name="actionBarStyle">@style/AppBaseTheme.ActionBarStyle</item>
    <item name="actionBarTabStyle">@style/AppBaseTheme.ActionBarTabStyle</item>
    <item name="actionBarTabBarStyle">@style/AppBaseTheme.ActionBarTabBarStyle</item>
</style>

<style name="AppBaseTheme.ActionBarStyle" parent="Widget.Sherlock.Light.ActionBar.Solid.Inverse">
    <item name="background">@drawable/action_bar_background</item>
    <item name="android:background">@drawable/action_bar_background</item>
</style>

<style name="AppBaseTheme.ActionBarTabStyle" parent="Widget.Sherlock.Light.ActionBar.TabView.Inverse">
    <item name="background">@android:color/transparent</item>
    <item name="android:background">@android:color/transparent</item>

    <item name="android:paddingLeft">0dip</item>
    <item name="android:paddingRight">0dip</item>
</style>

<style name="AppBaseTheme.ActionBarTabBarStyle" parent="Widget.Sherlock.Light.ActionBar.TabBar.Inverse">
    <item name="background">@drawable/action_bar_tab_divider</item>
    <item name="android:background">@drawable/action_bar_tab_divider</item>

    <item name="divider">@drawable/sp</item>
    <item name="android:divider">@drawable/sp</item>
</style>

文件@drawable/action_bar_background 是320px 宽，@drawable/action_bar_tab_divider 和@drawable/sp 都是1px 宽。

这是在我的主要活动中创建标签的代码：

ActionBar actionBar = super.getSupportActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

this.createTab(actionBar, R.drawable.action_bar_tab_home_off);
this.createTab(actionBar, R.drawable.action_bar_tab_news_off);
this.createTab(actionBar, R.drawable.action_bar_tab_videos_off);
this.createTab(actionBar, R.drawable.action_bar_tab_guide_off);


private void createTab(ActionBar actionBar, int resource) {
    Tab t = actionBar.newTab();

    t.setTabListener(this);
    t.setIcon(resource);

    actionBar.addTab(t);
}

有什么想法吗？

Answer 1

其中一个问题是操作视图“标签栏”会自动将图像缩放到预定大小，因此即使您将图标设置为超大或超小，它也应该在操作栏中填充大致相同的空间。

TabBar/TabView 也被设计为溢出，你已经发现了^.^ 它适用于一次打开 10 到 20 个不同选项卡的应用程序，用户可以滚动浏览它们的列表。不仅如此，标签视图也很难使用固定的、非滚动的图标列表，因为 Android 设备有各种形状和大小。

两个选项可能适合您的需求。使用布局内的图标创建您自己的RelativeLayout 或LinearLayout。这样您每次都可以选择操作栏的大小 =) 您可以将操作栏停靠在任何Activity 的顶部或底部。

如果这不是一个选项，您可以将图标添加到顶部 ActionBar 菜单本身，它不会滚动。但是，您的图标可能并不都适合主要的ActionBar，这会导致任何溢出的图标被放置到溢出菜单下拉菜单中。 =(

要删除选项卡之间的分隔线间距，请将以下代码另存为可绘制文件夹中的新 xml 文件，例如 dividerdrawable.xml：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="line" >
    <size
        android:width="0px"
        android:color="@android:color/black"
        android:dashWidth="0px"
        android:dashGap="0px" />
</shape>

然后使用该drawable作为标签分隔符。

<item name="divider">@drawable/dividerdrawable</item>