Слайд в стиле Facebook для Android

Новое приложение Facebook и его навигация так круты. Я просто пытался увидеть, как это может быть воспроизведено в моем приложении.

У кого-нибудь есть подсказка, как этого можно добиться?

При нажатии на верхнюю левую кнопку отображается слайд страницы и следующий экран:

YouTube видео

Я сам с этим поиграл, и лучший способ, который я смог найти, - это использовать FrameLayout и положить пользовательский HorizontalScrollView (HSV) поверх меню. Внутри HSV находятся ваши приложения Views, но есть прозрачный View как первый дочерний элемент. Это означает, что когда HSV имеет нулевое смещение прокрутки, меню будет отображаться на экране (и все равно будет удивительно активным).

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

Код здесь, и две нижние кнопки (называемые HorzScrollWithListMenu и HorzScrollWithImageMenu) в действии Launch показывают лучшие меню, которые я мог придумать:

Android-слайд-меню демо

Снимок экрана с эмулятора (средняя прокрутка):

Скриншот с устройства (полная прокрутка). Обратите внимание, что мой значок не такой широкий, как значок меню Facebook, поэтому представление меню и представление «приложение» не выровнены.

В этом проекте библиотеки я реализовал слайд-навигацию в стиле Facebook .

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

Внутри репозитория вы можете найти демо-проект, в котором рассказывается, как использовать lib для реализации навигации, подобной Facebook. Вот короткое видео с записью демо-проекта .

Также эта библиотека должна быть совместима с этим шаблоном ActionBar, потому что она основана на транзакциях операций и TranslateAnimations (не на транзакциях фрагментов и пользовательских представлениях).

В настоящее время основная проблема заключается в том, чтобы заставить его хорошо работать для приложений, которые поддерживают как портретный, так и ландшафтный режим. Если у вас есть какие-либо отзывы, пожалуйста, предоставьте их через github.

Всего наилучшего,
Алекс

Вот еще один библиотека и, кажется, лучшая на мой взгляд. Я не писал это ..

ОБНОВИТЬ:

Этот код, кажется, работает лучше всего для меня, и он перемещает всю панель действий, как приложение G +.

Как Google удалось это сделать? Слайд ActionBar в приложении Android

Я думаю, что приложение facebook не написано в нативном коде (я имею в виду нативный код, используя макеты в Android), но они использовали для него webview и использовали некоторые библиотеки javascript ui, такие как sencha . Это может быть легко достигнуто с помощью Sencha Framework.

Вот еще одна (очень хорошая) библиотека с открытым исходным кодом!

Хорошая особенность этого в том, что он легко интегрируется с ActionBarSherlock.

Вот ссылка на проект GitHub

Вот ссылка на скачивание Google Play

Я только что реализовал аналогичное представление для моего собственного проекта. Вы можете проверить это здесь

Вот пример экрана приложения на основе библиотеки, которую я написал:

Это пользовательское представление легко использовать как элемент макета XML. Вот пример:

    <shared.ui.actionscontentview.ActionsContentView
      android:id="@+id/content"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      app:actions_layout="@layout/actions"
      app:content_layout="@layout/content" />

Если у вас возникнут какие-либо вопросы по использованию библиотеки ActionsContentView, я могу написать небольшую статью в проектах Wiki.

Некоторые преимущества этой библиотеки:

• возможность просмотра слайдов одним касанием
• легко настроить размер панели действий в XML
• поддержка всех версий Android SDK, начиная с 2.0 и выше

Есть одно ограничение:

• все горизонтальные виды прокрутки не будут работать в границах этого вида

С наилучшими пожеланиями, Стивен

С версией 13 пакета поддержки Android (май 2013 г.) есть DrawerLayout для создания Навигационного Ящика, который можно вытянуть из края окна. И навигационный ящик - теперь образец дизайна.

библиотека поддержки v4

шаблон дизайна навигационного ящика

Сделал обзор существующей реализации и превратил ее в проект библиотеки плюс пример приложения. Также добавлен синтаксический анализ XML, а также автоопределение, возможно, существующей панели действий, поэтому она работает как со встроенной, так и со вспомогательной панелью действий, такой как ActionBarSherlock.

Этот также сдвигает панель действий!

Все это - библиотечный проект вместе с примером приложения, который описан в «Скользящем меню для Android», как приложения Google и Facebook . Спасибо Scirocco за первоначальную идею и код!

Это просто и элегантно: https://github.com/akotoe/android-slide-out-menu.git

Снимок:

Я думаю, что библиотека не упоминается:

jfeinstein10 / SlidingMenu

github url:https://github.com/jfeinstein10/SlidingMenu

• отлично работает с панелью действий ActionBarSherlock, которая помогает в обратной совместимости !
• Поддержка правого слайда, а не только слайд с помощью кнопки!

Пока не могу прокомментировать ответ, данный @Paul Grime, в любом случае я представил в его проекте github исправление проблемы с мерцанием ....

Я выложу исправление здесь, возможно, кому-то это нужно. Вам просто нужно добавить две строки кода. Первый ниже вызова anim.setAnimationListener:

anim.setFillAfter(true);

И второй после вызова app.layout ():

app.clearAnimation();

Надеюсь это поможет :)

Я реализовал это с AbsoluteLayout и простым контроллером слайдов, который перемещает представление в отрицательное смещение, чтобы скрыть.

Если кому-то интересно, могу почистить код / ​​макет и выложить. Я знаю, что AbsoluteLayout устарела, но это была очень прямолинейная реализация. Вид слева / Вид справа, и, когда «открываешься скольжением», просто переместите вид слева от смещения -X на ширину устройства - все, что вы хотите показать на правом просмотре

Здравствуйте, это лучший пример демонстрационного приложения, которое предоставляет слайд-меню на Facebook. Проверьте код здесь

Как часть моей общей библиотеки Android (ACL) я реализовал собственный SideBar. Основные преимущества:

1. Боковую панель можно установить в любую позицию: слева, сверху, снизу, справа
2. Как основной вид, так и скользящий вид кликабельны
3. Боковая панель может быть частично показана
4. Стилируемые атрибуты для SideBar упрощают изменение его стиля
5. Артефакт в репо Maven
6. Часть большой библиотеки

Исходный код: https://github.com/serso/android-common/tree/master/views/src/main/java/org/solovyev/android/view/sidebar

Использование: https://github.com/serso/android-common/blob/master/samples/res/layout/acl_view_layout.xml

Недавно я работал над версией моего скользящего меню. Он использует популярную Android-библиотеку J.Feinstein SlidingMenu.

Пожалуйста, проверьте исходный код на GitHub:

https://github.com/baruckis/Android-SlidingMenuImplementation

Загрузите приложение прямо на устройство, чтобы попробовать:

https://play.google.com/store/apps/details?id=com.baruckis.SlidingMenuImplementation

Код должен быть понятен из-за комментариев. Надеюсь это будет полезно! ;)

Я нашел самый простой способ для этого и его работы. Используйте простой навигационный ящик и вызовите box.setdrawerListner () и используйте метод mainView.setX () в методе hookSlide ниже или скопируйте мой код.

XML-файл

 <android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000" >

<RelativeLayout
    android:id="@+id/content_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#ffffff">

  <ImageView
      android:layout_width="40dp"
      android:layout_height="40dp"
      android:id="@+id/menu"
      android:layout_alignParentTop="true"
      android:layout_alignParentLeft="true"
      android:layout_marginTop="10dp"
      android:layout_marginLeft="10dp"
      android:src="@drawable/black_line"
      />
</RelativeLayout>


<RelativeLayout
    android:id="@+id/left_drawer"
    android:layout_width="200dp"
    android:background="#181D21"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    >
    </RelativeLayout>
 </android.support.v4.widget.DrawerLayout>

Java-файл

   public class MainActivity extends AppCompatActivity {
DrawerLayout drawerLayout;
RelativeLayout mainView;
ImageView menu;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    menu=(ImageView)findViewById(R.id.menu);
    drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
    mainView=(RelativeLayout)findViewById(R.id.content_frame);

    menu.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            drawerLayout.openDrawer(Gravity.LEFT);
        }
    });

    drawerLayout.setDrawerListener(new DrawerLayout.DrawerListener() {
        @Override
        public void onDrawerSlide(View drawerView, float slideOffset) {
            mainView.setX(slideOffset * 300);
        }

        @Override
        public void onDrawerOpened(View drawerView) {

        }

        @Override
        public void onDrawerClosed(View drawerView) {

        }

        @Override
        public void onDrawerStateChanged(int newState) {

        }
    });
 }
}

Спасибо

Я собираюсь сделать некоторые смелые догадки здесь ...

Я предполагаю, что у них есть макет, который представляет меню, которое не видно. При нажатии кнопки меню они анимируют макет / вид сверху, чтобы убрать его с дороги, и просто обеспечивают видимость макета меню. Я не думал о том, чтобы это вызывало какие-либо проблемы с z-индексами в представлениях или как они это контролируют.

Android добавил навигационный ящик. Отослать это

ссылка на сайт

Вот руководство по проектированию и разработке, найденное в официальной документации Android, без необходимости добавлять неофициальную внешнюю библиотеку. Подойдет только библиотека поддержки Android. Найдите ссылки здесь.

проектировать и развивать .

Android-приложение Facebook возможно построено из фрагментов . Меню - это один фрагмент, а углубленное действие (лента новостей / события / друзья и т. Д.) - это другой фрагмент. В основном макет планшета «Master & Detail» на телефоне.

Для информации: поскольку библиотека совместимости начинается с версии 1.6, а это приложение для Facebook также работает на устройствах с Android 1.5, это невозможно сделать с помощью фрагментов.

Это можно сделать следующим образом: создайте «базовое» действие BaseMenuActivity, в которое вы поместите всю логику для onItemClickListener для списка меню и определите 2 анимации («открыть» и «закрыть»). В конце / начале анимации вы показываете / скрываете макет BaseMenuActivity (назовем его menu_layout). Макет для этого действия прост, это только список с элементами + прозрачная часть справа от вашего списка. Эта часть будет кликабельной, и ее ширина будет равна ширине вашей кнопки перемещения. С этим вы сможете нажать на этот макет, чтобы запустить анимацию, чтобы content_layout скользил влево и занимал весь экран. Для каждого параметра (т. Е. Элемента списка меню) вы создаете «ContentActivity», которое расширяет BaseMenuActivity. Затем, когда вы нажимаете на элемент списка, вы запускаете ItemSelectedContentActivity с видимым меню (которое вы закроете, как только начнете свою деятельность). Макеты для каждого ContentActivity являются FrameLayout и включают в себя и. Вам просто нужно переместить content_layout и сделать menu_layout видимым, когда вы хотите.

Это способ сделать это, и я надеюсь, что я достаточно ясно.

Я играл с этим последние несколько дней, и я придумал решение, которое довольно просто в конце концов, и которое работает до Honeycomb. Мое решение состояло в том, чтобы анимировать вид, который я хочу скользить ( FrameLayoutдля меня), и прослушивать конец анимации (в какой момент сместить левую / правую позицию вида). Я вставил свое решение здесь: Как оживить перевод View

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

реализация боковой панели меню с использованием кода Java без XML

Я не видел ни одного удивительного SimonVT / android-menudrawer, упомянутого выше в ответах. Так вот ссылка

https://github.com/SimonVT/android-menudrawer

Его очень легко использовать, и вы можете положить его слева, справа, сверху или снизу. Очень хорошо документировано с примером кода и лицензией Apache 2.0.

В июне 2012 года Google добавил «шаблоны» в плагин Eclipse ADT , и есть шаблон, называемый «поток основных / подробных данных», который делает именно это (на основе фрагментов)