Як реалізувати спеціальну розбірну панель інструментів в android?


80

Використовуючи цей підручник для реалізації шаблону гнучкого простору (того, що має панель інструментів, що згортається).

Я намагаюся домогтися подібного ефекту, як у діяльності Lollipop Contacts , яка на початку, входячи до активності, подання є лише частиною заголовка зображення:

введіть тут опис зображення

Потім користувач може прокрутити макет під зображенням, щоб показати більше його, поки він не досягне максимуму:

введіть тут опис зображення

У моєму додатку я не можу змусити його працювати.

Що трапляється, так це те, що при введенні активності заголовок зображення представлений у максимальному розмірі, розмірі AppBarLayout, так само, як макет вище, і на відміну від діяльності Lollipop Contacts , де він відображає лише частину зображення.

Це код, який встановлює висоту AppBarLayout (я хочу, щоб ширина екрану була максимальною висотою):

int widthPx = getResources().getDisplayMetrics().widthPixels;
AppBarLayout appbar = (AppBarLayout)findViewById(R.id.appbar);
appbar.setLayoutParams(new CoordinatorLayout.LayoutParams(CoordinatorLayout.LayoutParams.MATCH_PARENT, widthPx));

І це код, який встановлює RecyclerView. Спробував скористатися scrollToPosition, думав, що це підніме вигляд RecyclerView, але це зовсім не впливає:

mRecyclerView = (RecyclerView) findViewById(R.id.activity_profile_bottom_recyclerview);

    mRecyclerView.setHasFixedSize(true);

    // use a linear layout manager
    mLayoutManager = new LinearLayoutManager(this);

    mRecyclerView.setLayoutManager(mLayoutManager);

    // specify an adapter (see also next example)
    if(mAdapter == null){
        mAdapter = new ProfileAdapter(this, user, inEditMode);
        mRecyclerView.setAdapter(mAdapter);
    }

    mRecyclerView.scrollToPosition(mAdapter.getItemCount() - 1); // itemCount is 4

Це макет xml:

<android.support.v4.widget.DrawerLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/activity_profile"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">

<android.support.design.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">
    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="0dp" // set programatically
        android:fitsSystemWindows="true"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleMarginBottom="32dp"
            app:expandedTitleMarginEnd="64dp"
            app:expandedTitleMarginStart="48dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">
            <ImageView
                android:id="@+id/header"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/header"
                android:fitsSystemWindows="true"
                android:scaleType="centerCrop"
                app:layout_collapseMode="parallax" />
            <android.support.v7.widget.Toolbar
                android:id="@+id/anim_toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/activity_profile_bottom_recyclerview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 

    </android.support.design.widget.CoordinatorLayout>

    <include layout="@layout/navigation_view"/>
</android.support.v4.widget.DrawerLayout>

Примітка. Якщо я вручну прокручую вниз, RecyclerView опускається і показує більшу частину зображення, воно просто не працюватиме через код.

Я думаю, що scrollToPosition не є рішенням, хтось має якусь ідею?

Думка про використання прапора enterAlwaysCollapsed, можливо, як згадувалося тут у розділі CoordinatorLayout та Appbar з minHeight:

enterAlwaysCollapsed: Коли у вашому поданні оголошено minHeight, і ви використовуєте цей прапор, ваш подання увійде лише на мінімальній висоті (тобто, "згорнуте"), лише повторно розширившись до повної висоти, коли прокручуваний вигляд досягне своєї вершини.

Отже, я встановив прапорець scroll | enterAlwaysCollapsed на мою панель інструментів і minHeight у моєму RecyclerView, що не спрацювало. Потім я спробував перенести minHeight в інші макети, такі як AppBarLayout, нічого не вийшло. Це просто стискало зображення іноді без цілого виду.



2
Дякую @karaokyo, це насправді спрацювало. Все ще намагаюся з’ясувати, чи є й інші рішення.
Jjang

@karaokyo не могли б ви перевірити це, будь ласка? stackoverflow.com/questions/33069081 / ...
Jjang


Я б використовував MotionLayout для цього. Див. Приклади на https://github.com/android/views-widgets-samples/tree/master/ConstraintLayoutExamples
Лін Лін

Відповіді:


1

AppBarComponentНадає метод .setExpanded(boolean expanded), який дозволяє вам розширити AppBarComponent.

Але майте на увазі, що цей метод покладається на те, що цей макет є безпосереднім потомком CoordinatorLayout.

Ви можете прочитати це для отримання додаткової інформації.

Якщо ви хочете анімувати на власний зсув, спробуйте скористатися setTopAndBottomOffset(int)методом.

CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) appBar.getLayoutParams();
final AppBarLayout.Behavior behavior = (AppBarLayout.Behavior) params.getBehavior();
if (behavior != null) {
    ValueAnimator valueAnimator = ValueAnimator.ofInt();
    valueAnimator.setInterpolator(new DecelerateInterpolator());
    valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator animation) {
            behavior.setTopAndBottomOffset((Integer) animation.getAnimatedValue());
            appBar.requestLayout();
        }
    });
    valueAnimator.setIntValues(0, -900);
    valueAnimator.setDuration(400);
    valueAnimator.start();
}
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.