it-swarm.com.ru

Как приложение контактов Android L сворачивает свою панель инструментов?

Я пытался воспроизвести способ, которым приложение «Контакты» в версии 5.0 сворачивает панель инструментов при прокрутке списка.

Галерея скриншотов, демонстрирующих желаемое взаимодействие Обратите внимание на постепенное свертывание панели инструментов, на котором отображаются поиск + последний контакт, исчезает последний контакт, сворачивается последний контакт, сворачивается поиск, оставляя только вкладки.

До сих пор у меня есть панель инструментов, расположенная над представлением реселлера в LinearLayout, и панель инструментов используется как панель действий, а не как отдельная.

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

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

getSupportActionBar().setHideOnContentScrollEnabled(true);

Который возвращает:

 Caused by: Java.lang.UnsupportedOperationException: Hide on content scroll is not supported in this action bar configuration.

Использование традиционной панели действий, размещение панели инструментов под ней и установка hideoncontentscrollenabled также не работали, прокрутка никогда не вызывала метод hide на панели действий.

- edit -- Мне удалось заставить hideOnContentScrollEnabled работать с представлением списка с традиционной панелью действий, но поведение не совпадает с приложением контактов. Это явно не тот метод, который они использовали - он просто запускает .hide () на панели действий, когда в представлении списка происходит событие броска, которое заметно отличается от приложения контактов, которое перетаскивает панель инструментов вместе с событием прокрутки .-- /редактировать --

Поэтому я отказался от этого маршрута, поместил fill_parent на высоту карты и анимировал коллапс на панели инструментов. Но как мне вызвать его так, чтобы оно следовало за событием касания, а затем возвращало событие касания в просмотр повторного использования?

activity_main.xml

<LinearLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:orientation="vertical"
    >

    <Android.support.v7.widget.Toolbar
        xmlns:Android="http://schemas.Android.com/apk/res/Android"
        Android:id="@+id/toolbar"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:minHeight="?android:attr/actionBarSize"
        Android:background="@color/colorPrimary"
        />

    <fragment Android:name="me.myapplication.FragmentTab"
          Android:id="@+id/tab_fragment"
          Android:layout_width="match_parent"
          Android:layout_height="wrap_content" />
</LinearLayout>

фрагмент_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:gravity="center_horizontal"
    Android:orientation="vertical"
    Android:padding="8dp"
    Android:background="#eeeeee"
    >

    <Android.support.v7.widget.RecyclerView
        Android:id="@+id/recycler_view"
        Android:layout_width="match_parent"
        Android:layout_height="fill_parent"
        />

</LinearLayout>

styles.xml

...
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
...

MainActivity.Java

Toolbar toolbar = (Toolbar)findViewById(R.id.toolbar);

// Disable the logo in the actionbar, as per material guidelines
toolbar.getMenu().clear();
toolbar.setTitle("My toolbar");
setSupportActionBar(toolbar);
33
Preston

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

https://github.com/ksoichiro/Android-ObservableScrollView

ПРАВКА

Google только что выпустил Android Design Library . Пожалуйста, посмотрите, как он содержит все эффекты свертывания панелей инструментов и многое другое.

17
humblerookie

Ну, я понятия не имею, как они это делают, но ... почему бы вам не взглянуть на исходный код? К счастью для нас, приложение «Контакты» по-прежнему имеет открытый исходный код на Android L (другим не так повезло, как «Контактам», например, Mail, которая больше не работает на L; или «Клавиатура», которую они прекратили обновлять с момента запуска своего «пропиетария»). Google Keyboard).

В любом случае, вот исходный код, который, я думаю, вам следует посмотреть: https://github.com/Android/platform_packages_apps_contacts/blob/master/src%2Fcom%2Fandroid%2Fcontacts%2Factivities%2FActionBarAdapter.Java

Обратите внимание на метод update(boolean skipAnimation) в строке 311, который вызывает animateTabHeightChange(int start, int end) (строка 437).

Я думаю, что вся магия происходит там ;-)

3
jrub

Никакая сторонняя библиотека не требуется сейчас! Android официально предоставляет библиотеку. Вы можете свернуть панель инструментов и сделать множество других настроек.

Проверить это блог разработчика Android

И не забудьте добавить эту зависимость в ваш файл build.gradle.

compile 'com.Android.support:design:22.2.0'

2
Apurva

По состоянию на июнь 2015 года желаемый эффект может быть достигнут с помощью так называемой CollapsingToolbarLayout новой библиотеки поддержки проектирования. 

Основываясь на примере кода здесь , я рассчитываю, что: 

  • карточка поиска является дочерней по отношению к панели инструментов
  • просмотр карты пропущенных вызовов относится к панели инструментов коллапса с атрибутом collapseMode, установленным на pin

<Android.support.design.widget.AppBarLayout
    Android:id="@+id/appbar"
    Android:layout_width="match_parent"
    Android:layout_height="112dp"
    Android:fitsSystemWindows="true"
    Android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <Android.support.design.widget.CollapsingToolbarLayout
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:minHeight="?attr/actionBarSize"
        Android:fitsSystemWindows="true"
        app:layout_scrollFlags="scroll|enterAlwaysCollapsed|enterAlways">

        <Android.support.v7.widget.Toolbar
            Android:id="@+id/toolbar"
            Android:layout_width="match_parent"
            Android:layout_height="?attr/actionBarSize"
            Android:background="?attr/colorPrimary"
            Android:fitsSystemWindows="false"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            app:layout_collapseMode="pin"
            app:layout_scrollFlags="scroll|enterAlways">

            <!-- Search layout -->
            <Android.support.v7.widget.CardView   
            </Android.support.v7.widget.CardView>

        </Android.support.v7.widget.Toolbar>

        <!-- Last call card view-->
        <Android.support.v7.widget.CardView
            app:layout_collapseMode="pin">               
        </Android.support.v7.widget.CardView>

    </Android.support.design.widget.CollapsingToolbarLayout>

</Android.support.design.widget.AppBarLayout>

<LinearLayout
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:orientation="vertical"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <Android.support.design.widget.TabLayout
        Android:id="@+id/tabs"
        Android:layout_width="match_parent"
        Android:layout_height="48dp"
        Android:background="@color/primary_color"
        app:layout_scrollFlags="scroll"/>

    <Android.support.v4.view.ViewPager
        Android:id="@+id/viewpager"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent" />

</LinearLayout>

2
appoll

Я нашел эту библиотеку, которая, кажется, делает то, что вы ищете: https://github.com/kmshack/Android-ParallaxHeaderViewPager и это https://github.com/flavienlaurent/NotBoringActionBar

Вы можете воспроизвести видео, чтобы увидеть его поведение: https://www.youtube.com/watch?v=sCP-b0a1x5Y

Возможно, это не «новый» стандартный способ сделать это с помощью ToolBar, но он может дать вам представление о проверке кода. Кажется, что он прикрепляет OnScrollListener к прокручиваемому контенту, а затем запускает изменения размера панели.

1
Alécio Carvalho

В приложении Android для Android нет простого решения «подключи и работай», которое можно использовать в своем собственном приложении.

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

https://github.com/Android/platform_packages_apps_contacts/blob/Lollipop-release/res/layout/quickcontact_activity.xml

MultiShrinkScroller - это FrameLayout, который выполняет функцию прокрутки, но главное - это LinearLayout, поэтому уменьшение высоты более высоких представлений будет «прокручивать» более низкие представления вверх. 

Ключевой файл для реализации:

https://github.com/Android/platform_packages_apps_contacts/blob/Lollipop-release/src/com/Android/contacts/widget/MultiShrinkScroller.Java

public void scrollTo(int x, int y) {
    final int delta = y - getScroll();
    boolean wasFullscreen = getScrollNeededToBeFullScreen() <= 0;
    if (delta > 0) {
        scrollUp(delta);
    } else {
        scrollDown(delta);
    }
    updatePhotoTintAndDropShadow();
    updateHeaderTextSizeAndMargin();
    //... other stuff
}

private void scrollUp(int delta) {

    // Collapse higher views first
    if (getTransparentViewHeight() != 0) {
        final int originalValue = getTransparentViewHeight();
        setTransparentViewHeight(getTransparentViewHeight() - delta);
        setTransparentViewHeight(Math.max(0, getTransparentViewHeight()));
        delta -= originalValue - getTransparentViewHeight();
    }

    // Shrink toolbar as needed
    final ViewGroup.LayoutParams toolbarLayoutParams
            = mToolbar.getLayoutParams();
    if (toolbarLayoutParams.height > getFullyCompressedHeaderHeight()) {
        final int originalValue = toolbarLayoutParams.height;
        toolbarLayoutParams.height -= delta;
        toolbarLayoutParams.height = Math.max(toolbarLayoutParams.height,
                getFullyCompressedHeaderHeight());
        mToolbar.setLayoutParams(toolbarLayoutParams);
        delta -= originalValue - toolbarLayoutParams.height;
    }

    // Finally, scroll content if nothing left to shrink
    mScrollView.scrollBy(0, delta);
}

updatePhotoTintAndDropShadow(); и updateHeaderTextSizeAndMargin(); обрабатывают изменение оттенка и текста, когда оно сворачивается, превращаясь в внешний вид обычного ActionBar/ToolBar.

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

0
David Liu

Для меня https://mzgreen.github.io/2015/06/23/How-to-hideshow-Toolbar-when-list-is-scrolling%28part3%29/ помогло. Исходный код находится здесь: https://github.com/mzgreen/HideOnScrollExample/tree/master/app/src/main .

RecycleView в вашем макете должен выглядеть следующим образом:

<Android.support.v7.widget.RecyclerView
    Android:id="@+id/recyclerView"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:layout_gravity="fill_vertical"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />

Обратите внимание, что после запуска приложения появляются 2 панели инструментов (панель действий и панель инструментов). Так что в своей деятельности. Java вы должны написать так:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    // Hide ActionBar.
    supportRequestWindowFeature(WindowCompat.FEATURE_ACTION_BAR);
    getSupportActionBar().hide();
    setContentView(R.layout.your_activity_layout);
    ...

Панель инструментов настраивается, как показано здесь: https://stackoverflow.com/a/26548766/2914140 . Я имею в виду, что он отображается без заголовка и других элементов, поэтому вы можете добавить их в макет.

0
CoolMind