让DrawerLayout滑过ActionBar

时间:2013-06-05 20:44:00

标签: android android-actionbar android-ui android-tabs slidingdrawer

我在活动中有一个滑动抽屉菜单,其中有一个操作栏,上面有一些标签。

我想让滑动抽屉滑过标签,而不是它们下方。

这就是它现在的样子......

Sliding menu under action bar tabs

关于如何做到这一点的任何想法?

注意:我知道我可能在这里破坏了一些约定和UI模式,如果它根本不起作用,我会看一些替代方案。但我想先让它工作。

编辑:请参阅下面的Google Play音乐应用屏幕截图,该应用完全符合我的要求。请参阅下面@ CommonsWare的答案,他确实同意我可能违反惯例。但是,鉴于播放音乐应用程序,它可能也不是那么罕见。

Proper navigation with tabs sliding correctly

10 个答案:

答案 0 :(得分:22)

您可以使用以下库来获取类似于Google Play音乐应用的导航模型。

  • ActionBarSherlock(github)
  • 嵌套片段(github)
  • PagerSlidingTabStrip(github)
  • NavigationDrawer(Android开发者网站)
  • 最新支持v4库

我在github上创建了一个项目Navigation Drawer with Tab Strip Example,看看它。

下面是它的截图。

Navigation-drawer-page-sliding-tab-strip

答案 1 :(得分:11)

  

关于如何做到这一点的任何想法?

执行以下任何操作:

  • 从操作栏标签切换,可能转到ViewPager,并从ViewPageIndicator中选中标签指示符PagerTabStripTabPageIndicator

  • 查看现有的第三方抽屉实施是否尚未更新为新的UI标准

  • 分叉DrawerLayout并修改它以适合

  • 从头开始滚动您自己的导航抽屉

  

我知道我可能会破坏一些约定和UI模式

Correct

答案 2 :(得分:3)

同时检查此库http://www.androidviews.net/2013/04/pager-sliding-tabstrip/ 那家伙做得很好。您可以将它与导航抽屉一起使用,它可以很好地工作。

答案 3 :(得分:3)

最后,在这个博客中,通过滑动标签实现导航抽屉的简洁方法 http://www.paulusworld.com/technical/android-navigationdrawer-sliding-tabs

答案 4 :(得分:1)

这可以在没有第三方库的情况下完成。查看Google的滑动标签示例

     SlidingTabsBasic:   http://developer.android.com/samples/SlidingTabsBasic/project.html
     SlidingTabsColors:  http://developer.android.com/samples/SlidingTabsColors/project.html

另外,请查看这个很棒的链接:http://manishkpr.webheavens.com/android-sliding-tabs-example/ 对我来说就像一个魅力。 :)

答案 5 :(得分:0)

我遇到了同样的问题,但我找到的唯一解决方案是在内部片段中使用制表符(而不是fragmentActivity)。我不知道这是不是最好的解决方案,我唯一的问题是设计这个标签,其余的,它完美地运作

答案 6 :(得分:0)

我设法通过在OnDrawerClosed和onDrawerOpened函数中设置navigationMode来实现此要求。这是一个临时修复,因为标签实际上不会立即消失。

  public void onDrawerClosed(View view) {
          getActionBar().setTitle(mTitle);
          if(getActionBar().getTabCount()>0) //Add tabs when the fragment has it
          getActionBar().setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);               
                        ...
                    }

   public void onDrawerOpened(View drawerView) {
            getActionBar().setTitle(mDrawerTitle);
            getActionBar().setNavigationMode(ActionBar.NAVIGATION_MODE_STANDARD);              
                    ..

                    }

如果您有一些带有选项卡的片段,而没有它的其他片段,请不要忘记删除没有选项卡的片段的创建查看。

 getActionBar().removeAllTabs();

答案 7 :(得分:0)

Actionbar Navigaton Drawer和SwipeTabs无法同时使用。您应该使用Actionbar和swipetabs通过简单的Tabhost实现Navigation Drawer。您可以将Tabhost用于选项卡,并将片段用于每个选项卡的内部视图。应通过viewpager使用片段来提供滚动/滑动效果。通过他们的方法将选项卡和viewpager相互连接

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<TabHost
    android:id="@+id/tabHost"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

        <HorizontalScrollView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:fillViewport="true"
            android:scrollbars="none" >

            <TabWidget
                android:id="@android:id/tabs"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" >
            </TabWidget>
        </HorizontalScrollView>

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="match_parent"
            android:layout_height="match_parent" >

            <android.support.v4.view.ViewPager
                android:id="@+id/viewPager_home"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </FrameLayout>
    </LinearLayout>
</TabHost>

答案 8 :(得分:0)

播放音乐不使用标准的ActionBar.Tab 然后,您可以通过扩展Horizo​​ntalScrollView来实现自己的选项卡容器 并与ViewPager一起工作

答案 9 :(得分:0)

我在抽屉的片段里面使用了标签。 我解决了这个问题,添加

getActionBar().setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); 
<{1>}中的

onDrawerClosed()方法中的getActionBar().setNavigationMode(ActionBar.NAVIGATION_MODE_STANDARD);

我希望这会对你有所帮助。