【问题标题】:mimicking the navigation drawer of youtube/gmail app模仿 youtube/gmail 应用程序的导航抽屉
【发布时间】:2013-08-21 10:22:58
【问题描述】:

背景

最近几个月,Google 发布了带有导航抽屉(又名滑动菜单)的Youtube app

它有许多我希望在我正在开发的应用上拥有的很酷的功能。

特点是:

  1. 触摸任意位置开始滑动。

  2. 切换模式时操作栏“向上”按钮上的移动图标。

  3. 滑动菜单时,内容区域(右侧区域,而不是菜单本身)保持不动,而不是滚动。

  4. 操作栏保持不动,而不是滚动。

  5. 内容区域(右侧区域,不是菜单本身)在滚动时会改变颜色,而不是菜单本身。

这里是显示我在说什么的屏幕截图:

滑动前:

滑动后:

目前,我知道 2 个主要的库负责使用导航抽屉:

问题

官方库和slidingMenu 库都没有像youtube 应用程序那样结合所有这些功能。

例如,官方库没有能力#1(这就是我发布this thread的原因),所以我使用了slidingMenu库。

但是,slidingMenu 库没有(或者是吗?)能力 #2 和 #3 。

这两个库都没有足够的文档/示例来说明可以做什么,因此很难使用它们或向它们添加新功能。

我试过的

目前,我使用的是slidingMenu库,所以这是我准备slidingMenu的代码:

activity.setBehindContentView(slidingMenuRootView);
mSlidingMenu = activity.getSlidingMenu();
mSlidingMenu.setShadowWidthRes(R.dimen.slidingmenu_shadow_width);
mSlidingMenu.setShadowDrawable(R.drawable.slidingmenu_shadow);
mSlidingMenu.setBehindOffsetRes(R.dimen.slidingmenu_offset);
mSlidingMenu.setFadeEnabled(true);
mSlidingMenu.setFadeDegree(1.0f);
mSlidingMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);
activity.setSlidingActionBarEnabled(false);

问题

我怎样才能让滑动菜单(或导航抽屉)像在 youtube 应用程序上一样,这意味着与我提到的所有功能相结合?


可能的解决方案

编辑:使用menuDrawer library(github 链接here),我已经成功实现了我提到的所有功能。这是一个示例代码:

public class ActionBarSherlockSample extends SherlockActivity {

    private MenuDrawer mDrawer;

    @Override
    protected void onCreate(final Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        getSupportActionBar();
        mDrawer = MenuDrawer.attach(this, MenuDrawer.Type.OVERLAY);
        final TextView menuView = new TextView(this);
        menuView.setTextColor(0xFFFFFFFF);
        menuView.setText("As the drawer opens, the drawer indicator icon becomes smaller.");
        menuView.setGravity(Gravity.CENTER);
        mDrawer.setMenuView(menuView);
        mDrawer.setTouchMode(MenuDrawer.TOUCH_MODE_FULLSCREEN);
        mDrawer.setOnDrawerStateChangeListener(new OnDrawerStateChangeListener() {

            @Override
            public void onDrawerStateChange(final int oldState, final int newState) {
                Log.d("AppLog", "oldState:" + oldState + " newState:" + newState);
            }

            @Override
            public void onDrawerSlide(final float openRatio, final int offsetPixels) {
            }
        });
        final TextView contentView = new TextView(this);
        contentView
                .setText("This sample uses ActionBarSherlock to display an ActionBar on older platforms. The drawer indicator, "
                        + "as per the design guidelines, is visible in the top left corner.");
        contentView.setGravity(Gravity.CENTER);
        mDrawer.setContentView(contentView);
        mDrawer.setSlideDrawable(R.drawable.ic_drawer);
        mDrawer.setDrawerIndicatorEnabled(true);
    }

    @Override
    public boolean onOptionsItemSelected(final MenuItem item) {
        switch (item.getItemId()) {
        case android.R.id.home:
            mDrawer.toggleMenu();
            break;
        }
        return super.onOptionsItemSelected(item);
    }
}

【问题讨论】:

  • 将 jefferstin 滑动菜单与 actionBarSherlock 一起使用
  • [The] slidingMenu library doesn't have (or is it?) ability #2 and #3。你能更好地解释#2吗?使用slidingMenu 库可以实现#3。
  • @SanketKachhela 我问过如何使用这些功能。我怎样才能使用这个库来实现它们?请把它写成答案...
  • @vikram about #2 ,尝试打开 youtube 应用程序或 gmail 应用程序,它们有一个 3 条水平线的图标(未显示在我放置的屏幕截图中),它们根据状态移动滑动菜单。关于#3,你能告诉我怎么做吗?

标签: android actionbarsherlock android-actionbar slidingmenu navigation-drawer


【解决方案1】:

使用这个MenuDrawer

滑出式菜单实现,允许用户在应用中的视图之间导航。

特点:

  • 菜单可以沿所有四个边缘定位。
  • 支持附加始终可见、不可拖动的菜单,这在平板电脑上很有用。
  • 菜单可以包含内容和整个窗口。
  • 允许通过拖动边缘、整个屏幕或根本不打开抽屉。
  • 可用于 XML 布局。
  • 显示当前可见屏幕的指示器

【讨论】:

  • 它看起来像一个不错的库,但是您没有展示任何代码来展示如何实现我提到的所有功能。遗憾的是,我们已经使用slidingMenu 库编写了很多代码(包括打开和关闭滑动菜单时要做什么等...),所以我需要确保移动到这个库很容易而是。
  • 在进一步查看这个库之后,我觉得它是一个非常好的库,我推荐使用它,因为我已经成功使用了我提到的所有功能。我希望我能够使用它,因为它可以让事情变得更容易。现在,遗憾的是,我仍然需要使用slidingMenu 库。
  • 可以在here找到示例使用代码
  • 是的,我知道。我写过我已经测试过它并且效果很好。我现在将开始研究它,希望它能够完成我以前使用过的一切。我现在将更新我的问题,以包括如何使用您推荐的库获得我提到的所有功能的说明。
  • 由于某种原因,我在使用 maven 导入库时遇到问题。你知道如何使用 maven 来导入库吗?我也找不到如何在 xml 中使用它的示例。
猜你喜欢
  • 1970-01-01
  • 2016-04-18
  • 1970-01-01
  • 2017-04-15
  • 1970-01-01
  • 2012-07-07
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多