Как реализовать DrawerLayout с видимой ручкой

Я успешно применил NavigationDrawer для своего приложения.

В моем приложении отображается ящик, который открывается в левой части экрана.

Моя проблема: мне нужно добавить кнопку слева. Эта кнопка может быть нажата или нажата, чтобы открыть левый ящик. Это я могу сделать.

Но кнопка должна выглядеть как, это часть ящика, которая будет переполняться на экран.

Это означает, что кнопка должна скользить одновременно, когда ящик открывается и закрывается.

ЗАКРЫТОЕ СОСТОЯНИЕ:

enter image description here

ОТКРЫТИЕ СОСТОЯНИЯ

enter image description here

Я попробовал добавить кнопку в макет левого ящика, но кажется, что вы не можете заставить вещи появляться за пределами своих границ, и ящик всегда будет полностью скрыт, когда вы его закроете.

Теперь я пытаюсь добавить его, чтобы добавить кнопку в основной DrawerLayout и сделать ее выровненной справа от левого ящика... Но не повезло... Похоже, что DrawerLayout не может иметь больше двух дети...

Любая помощь будет оценена.

Я использую библиотеку поддержки (v4)

[EDIT] И я поддерживаю уровень API 8... Поэтому не могу использовать ImageView.setTranslationX или View.OnAttachStateChangeListener

Ответ 1

Я нашел способ сделать это довольно легко благодаря библиотеке Aniqroid, написанной Mobistry (SO pseudo)

Я использую класс SlidingTray, который является копией android SlidingDrawer, но позволяет помещать ящик в любой угол экрана.

Я объявил элемент через xml

<com.sileria.android.view.SlidingTray 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/drawer"
    android:layout_width="match_parent"
    android:layout_height="270dp"
    android:content="@+id/content"
    android:handle="@+id/handle" >

    <ImageView
        android:id="@+id/handle"
        android:layout_width="320dp"
        android:layout_height="24dp"
        android:background="@drawable/tray_btn" />

    <LinearLayout
        android:id="@+id/content"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="fill_vertical"
        android:orientation="vertical" >
    </LinearLayout>

</com.sileria.android.view.SlidingTray>

И просто нужно было позвонить

Kit.init(this);

в моей основной Activity до раздувания макета.

Я благодарю разработчиков aniqroid!

https://code.google.com/p/aniqroid/

Ответ 2

Это довольно сложно.

Я думаю, что это похоже на то, что делается с дескриптором ящика в новом приложении Google Maps. Не верьте мне на слово, не уверен.:)

Я написал переключатель, который остается на краю представления содержимого Activity. Когда перетаскивается DrawerLayout, я переводил представление по оси x на количество минимального дочернего элемента (это DrawerLayout контентное представление) минус тень (если таковая имеется). Поскольку теневое изображение + контентное представление DrawerLayout дает полную измеренную ширину всего ящика.

Я быстро умножаю скользящее смещение и минимальный ребенок и нахожу x-перевод.

[Изменить: код был удален для удобства чтения и был перемещен по ссылке, приведенной ниже)

В вашей деятельности:

mDrawerToggle = new DrawerLayoutEdgeToggle(
    this, 
    mDrawerLayout, 
    R.drawable.ic_launcher, 
    R.drawable.ic_launcher,
    Gravity.LEFT, 
    true) {

        @Override
        public void onDrawerClosed(View view) {
            super.onDrawerClosed(view); //must call super
        }

        @Override
        public void onDrawerOpened(View view) {
            super.onDrawerOpened(view); //must call super
        }

        @Override
        public void onDrawerSlide(View view, float slideOffset) {
            super.onDrawerSlide(view, slideOffset); //must call super

        }
    };
mDrawerLayout.setDrawerListener(mDrawerToggle);

Креативность: Вы можете добавить больше косметики, например, расстояние от ActionBar, которое вы можете установить в качестве поля для дескриптора.

Также вы можете подражать "эффекту одиночной молнии", перемещая рукоятку вверх/вниз вдоль влево/вправо, просто переведя на ось Y.:)

Изменить: Его доступно на моем GitHub здесь

Изменить 2. Для тех, кто не может получить дескриптор в начале, просто используйте mDrawerToggle.setVerticalPostionOffset(0)