【问题标题】:Getting DrawerLayout to Slide over the ActionBar让 DrawerLayout 在 ActionBar 上滑动
【发布时间】:2013-06-01 17:15:19
【问题描述】:

我在一个活动中有一个滑动抽屉菜单,它有一个带有一些选项卡的操作栏。

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

这就是现在的样子……

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

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

编辑:请参阅下面的 Google Play 音乐应用程序屏幕截图,该应用程序正是我所需要的。请参阅下面的@CommonsWare 的回答,他确实同意我可能违反约定。但是考虑到 Play Music 应用程序,它可能也不是那么罕见。

【问题讨论】:

  • 您是如何设法将导航抽屉的至少一部分放在上面的某些内容中,但它在内容下方
  • @pt123:不确定你的意思。当我使用 ViewPager 和 PagerTabStrip 时,一切都很好。请参阅以下 CommonsWare 的答案,表示正确。如果还是不行,我建议发布一个带有一些代码和屏幕截图的新问题。
  • 感谢回复,已整理完毕
  • stackoverflow.com/questions/23783496/… 我希望这能解决你的问题。
  • 您可以在stackoverflow.com/a/43817281/6112256 看到我的解决方案,并且效果很好。

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


【解决方案1】:

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

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

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

下面是它的截图。

【讨论】:

  • 谢谢巴拉吉!并不是说我需要立即使用它,但是您提出的示例是否依赖于 ActionBarSherlock?没有它可以做到吗?只是检查。
  • @archit 是的,它依赖于 ActionBarSherlock,是的,随着谷歌发布更新的支持库,项目可以在没有它的情况下开发
  • @Balaji 不使用ActionBarSherlock怎么实现?
  • @SheharyarNaseer 希望您了解 google 的 v7 appcompat 库,这是您要找的吗?
  • @Balaji 我已经实现了这个 UI,但我遇到了一个描述 here 的问题。你能帮我吗
【解决方案2】:

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

执行以下任一操作:

  • 从操作栏选项卡切换到 ViewPager 和选项卡式指示器(PagerTabStripTabPageIndicator 来自 ViewPageIndicator)

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

  • fork DrawerLayout 并修改它以适合

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

我知道我在这里可能违反了一些约定和 UI 模式

Correct.

【讨论】:

  • 鉴于上述设计确实背离了惯例(我宁愿不这样做),我确实有这样做的理由,其中滑动抽屉菜单充当顶级导航,并且选项卡是应用程序部分中的导航。我宁愿不强迫用户上一级才能访问顶级导航。对更好的导航方案有什么建议吗?
  • 到目前为止,我唯一看到在操作栏选项卡旁边实现滑动抽屉菜单的地方是新的 Google Play 音乐应用程序(在我的图书馆部分),它确实按预期工作,与菜单在选项卡上滑动,而不是在它们下方。
  • @Archit:Google Play 音乐未使用操作栏标签。它在LinearLayout 周围使用HorizontalScrollView 和一组TextView 小部件用于ViewPager 上方的“我的图书馆”选项卡。我不确定 Play Music 选项卡中的其他什么地方使用了——这是我看到的唯一地方。如果您想要 Google Play 音乐方法,我会使用 ViewPager 和合适的指标。
  • 这就是导航抽屉现在在材料设计中的工作方式,因此没有违反任何规则。
【解决方案3】:

也检查这个库http://www.androidviews.net/2013/04/pager-sliding-tabstrip/ 这家伙做得很好。您可以将它与导航抽屉一起使用,并且效果很好。

【讨论】:

  • 我确实遵循了您在类似问题上发布的答案。 :-) 我最终选择了 PagerTabStrip,它很好地满足了我的目的。但是谢谢你的链接!
【解决方案4】:

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

【讨论】:

    【解决方案5】:

    这可以在没有第三方库的情况下完成。查看 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/ 对我来说就像一个魅力。 :)

    【讨论】:

      【解决方案6】:

      我遇到了同样的问题,但我找到的唯一解决方案是在内部片段(而不是 fragmentActivity)中使用选项卡。我不知道这是否是最好的解决方案,我唯一遇到的问题是设置这个标签的样式,其余的,它工作得很好

      【讨论】:

      • 您可以尝试使用 PagerTabStrip,这是我最终使用的。我不太确定您可以对 PagerTabStrip 重新设置多少样式,但它工作得很好。您可以获得所有漂亮的滑动视图,并且点击它们也可以。
      【解决方案7】:

      我设法通过在 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);              
                          ..
      
                          }
      

      如果您有一些带有标签的片段,而其他没有标签的片段,请不要忘记在没有标签的片段的 CreateView 上删除标签。

       getActionBar().removeAllTabs();
      

      【讨论】:

      • 这是一个有趣的 hack ......通过稍微改变你的设计以适应上面 CommonsWare 的答案,你可能仍然会得到更好的服务。但仍然是一个有趣的 hack!
      • 这很好,但删除标签,我只想让菜单滑过操作标签
      • @Xenione 不确定您是否仍有问题。无论如何,可以在下面找到另一个完美的解决方案stackoverflow.com/a/26772874/2814778 :)
      【解决方案8】:

      Actionbar Navigaton Drawer 和 SwipeTabs 不能同时使用。您应该通过简单的 Tabhosts 使用 Actionbar 和 swipetabs 来实现 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>
      

      【讨论】:

        【解决方案9】:

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

        【讨论】:

          【解决方案10】:

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

          getActionBar().setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); 
          

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

          希望对你有帮助。

          【讨论】:

            猜你喜欢
            • 2013-08-04
            • 1970-01-01
            • 1970-01-01
            • 2019-06-14
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多