使用自定义视图复制ActionBar选项卡

时间:2012-09-12 16:22:26

标签: android android-actionbar actionbarsherlock

我想要一个带有自定义导航的ActionBar,其中自定义视图看起来像标准操作栏标签。我知道这听起来像重新发明轮子,但这意味着我们可以将菜单按钮放在与标签相同的行上,如下所示。这是一个设计要求,实际上为这个应用程序提供了比标准的android行为更多的UI意义。 How I would like the tabs to look

我尝试过使用ActionBarSherlock的IcsLinearLayout,如下所示:

<IcsLinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="fill_parent"
          android:orientation="horizontal"
          android:layout_height="50dip">
         <Button
             android:id="@+id/tab_1"
             android:layout_height="match_parent"
             android:gravity="center"
             android:layout_width="wrap_content"
             android:textStyle="bold"
             android:text="TAB_1"
             android:background="@drawable/abs__item_background_holo_light"
             />
        <Button
            android:id="@+id/tab_2"
            android:layout_height="match_parent"
            android:gravity="center"
            android:layout_width="wrap_content"
            android:textStyle="bold"
            android:text="TAB_2"
            android:background="@drawable/abs__item_background_holo_light"
             />
</IcsLinearLayout>

但是那复制了ActionButtons,我不知道如何复制Tabs。

我认为我需要:

  • 一个特殊的标签容器视图组(可能来自 ActionBarSherlock库)
  • 看起来像带有标签的标签 来自ABS库的背景资源。
  • 一些代码来表明这一点 单击视图后,它将保持选中状态(类似于 单选按钮)。

非常感谢任何指向样本或类似解决方案的指针(即使在ActionBarSherlock库中)。

2 个答案:

答案 0 :(得分:14)

//启用嵌入式标签

//pre-ICS
if (actionBarSherlock instanceof ActionBarImpl) {
    enableEmbeddedTabs(actionBarSherlock);

//ICS and forward
} else if (actionBarSherlock instanceof ActionBarWrapper) {
    try {
        Field actionBarField = actionBarSherlock.getClass().getDeclaredField("mActionBar");
        actionBarField.setAccessible(true);
        enableEmbeddedTabs(actionBarField.get(actionBarSherlock));
    } catch (Exception e) {
        Log.e(TAG, "Error enabling embedded tabs", e);
    }
}

//helper method
private void enableEmbeddedTabs(Object actionBar) {
    try {
        Method setHasEmbeddedTabsMethod = actionBar.getClass().getDeclaredMethod("setHasEmbeddedTabs", boolean.class);
        setHasEmbeddedTabsMethod.setAccessible(true);
        setHasEmbeddedTabsMethod.invoke(actionBar, true);
    } catch (Exception e) {
        Log.e(TAG, "Error marking actionbar embedded", e);
    }
}

此代码完美无缺。在我的应用程序中尝试过。 供进一步参考 - https://groups.google.com/forum/#!topic/actionbarsherlock/hmmB1JqDeCk

答案 1 :(得分:6)

通过使用层次结构查看器,我认为我们已经找到了如何做到这一点。事实证明这并不困难。您需要ABS库中的ScrollingTabContainerView,您可以为其添加标签。

How it all looks with tabs on a narrow action bar

public class MainActivity extends SherlockActivity implements ActionBar.TabListener {
/**
 * Called when the activity is first created.
 */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    ScrollingTabContainerView root = new ScrollingTabContainerView(this);
    ActionBar.Tab tab1 = getSupportActionBar().newTab();
    tab1.setText("TAB 1");

    tab1.setTabListener(this);

    ActionBar.Tab tab2 = getSupportActionBar().newTab();
    tab2.setText("TAB 2");
    tab2.setTabListener(this);

    root.addTab(tab1, 0, true);
    root.addTab(tab2, 1, false);

    getSupportActionBar().setCustomView(root);
    getSupportActionBar().setDisplayShowCustomEnabled(true);
    getSupportActionBar().setTitle("App Title");

}

@Override
public boolean onCreateOptionsMenu(Menu menu){
    menu.add("MENU ITEM 1");
    menu.add("MENU ITEM 2");
    return true;
}

@Override
public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) {
    //To change body of implemented methods use File | Settings | File Templates.
}

@Override
public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction ft) {
    //To change body of implemented methods use File | Settings | File Templates.
}

@Override
public void onTabReselected(ActionBar.Tab tab, FragmentTransaction ft) {
    //To change body of implemented methods use File | Settings | File Templates.
}

我希望这有助于某人。