2013-11-25 5 views
4

В компании, в которой я работаю, есть приложение iOS, в котором есть два скользящих меню: один слева, который используется для навигации, а один справа, который отображает контекстную информацию и действия приложения. Приложение iOS имеет вид, похожий на ActionBar, который скользит с основной областью содержимого при отображении любого из меню (что означает, что оно скрыто). Из-за опубликованного guidelines для использования навигационного ящика мы рассматриваем обновление пользовательского интерфейса в версии Android для соответствия (насколько это возможно). Имея это в виду, мой дизайнер пользовательского интерфейса попросил пару рабочих демонстраций, которые можно поставить перед пользователями, чтобы получить обратную связь. Ей предлагается три образца:Приложение для Android с двумя меню

  1. тот, у которого есть стационарная панель действий по верхней части. Оба меню будут перекрывать основную область содержимого, но не панель действий. Это будет следовать опубликованным рекомендациям.

    enter image description here

  2. один, который функционирует как текущее приложение Facebook. ActionBar (или эквивалент) считается частью основной области содержимого и будет закрыт/сдвинут, когда откроется любой ящик.

    enter image description here enter image description here

  3. тот, который представляет собой гибрид два предыдущих: в меню навигации слева должно скользить под панелью действий (следуя инструкции). Правильный ящик выскользнет из панели действий. Этот сценарий похож на текущее приложение Evernote.

    enter image description here enter image description here

До сих пор я был возиться с SlidingMenu и функциональной демо для # 1 и # 2. Основываясь на том, что я прочитал here, я смог бы выполнить # 1, используя официальный Android navigation drawer. Тем не менее, я не смог получить ничего, что можно было бы использовать для демонстрации №3. Не похоже, что DrawerLayout можно заставить работать поверх ActionBar, так что он отсутствует.

Возможно ли использовать два ящика (используя SlidingMenu): тот, который работает с ActionBar, и тот, который этого не делает? Если нет, есть ли альтернативные решения, которые будут работать, или мне нужно взглянуть на то, чтобы перевернуть мое собственное решение?

ответ

1

Таким образом, это возможно, используя SlidingMenu. По существу, я в конечном итоге создание двух объектов SliderMenu:

public class SlidingMenuEvernoteActivity extends SlidingFragmentActivity { 

    @Override 
    public void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 

    setContentView(R.layout.sliding_menu_main); 
    setBehindContentView(R.layout.sliding_menu_red); 
    setSlidingActionBarEnabled(false); 

    SlidingMenu leftMenu = getSlidingMenu(); 
    leftMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_MARGIN); 
    leftMenu.setMode(SlidingMenu.LEFT); 
    getSupportFragmentManager() 
      .beginTransaction() 
      .replace(R.id.sliding_menu_main, new ListFragment()) 
      .commit(); 

    SlidingMenu rightMenu = new SlidingMenu(this); 
    rightMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_MARGIN); 
    rightMenu.setMode(SlidingMenu.RIGHT); 
    rightMenu.setMenu(R.layout.sliding_menu_blue); 
    rightMenu.attachToActivity(this, SlidingMenu.SLIDING_WINDOW); 
    getSupportFragmentManager() 
      .beginTransaction() 
      .replace(R.id.sliding_menu_blue, new ListFragment()) 
      .commit(); 
    } 
} 

Примечание: поскольку активность распространяется SlidingFragmentActivity, нет никакой необходимости создавать два SlidingMenu объекты вручную. Первый автоматически создается в обратном вызове.

А вот соответствующие файлы разметки:

* sliding_menu_main.xml *

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" android:layout_height="match_parent" 
    android:clickable="true" 
    android:id="@+id/sliding_menu_main"> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="Hello World!" 
     android:id="@+id/textView" 
     android:layout_gravity="center" /> 
</FrameLayout> 

* sliding_menu_red.xml *

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/sliding_menu_red" 
    android:orientation="vertical" android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="#ff001c"> 

</LinearLayout> 

* sliding_menu_blue.xml *

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/sliding_menu_blue" 
    android:orientation="vertical" android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="#0028ff"> 

</LinearLayout> 
3

Перед тем, как попасть в мой ответ, я просто уточнить различные типы ящиков мы имеем здесь

Вариант 1 является стандартным Navigation Drawer где содержание приводится в верхней части основного макета

вариант 2 является 3-й участник навигация ящик Sliding Menu который размножается именно то, что приложение Facebook делает и имеет множество опций для настройки

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

можно использовать 2 выдвижных ящика, чтобы получить эффект №3, что бы я сделал, это использовать SlidingPaneLayout, а затем импортировать библиотеку Sliding Menu и использовать ее только в правильном меню, так что у вас есть ваш экран действий, когда вы открываете правый ящик.Это может быть не совсем то, что вы хотите, где находится над панелью действий, но ее закрытие.

+0

Интересно. Я не рассматривал использование SlidingPaneLayout. Спасибо за предложение – kierse