Làm thế nào để triển khai Thanh công cụ có thể thu gọn tùy chỉnh trong Android?


80

Sử dụng hướng dẫn này để triển khai mẫu Không gian linh hoạt (mẫu có thanh công cụ thu gọn).

Tôi đang cố gắng đạt được hiệu ứng tương tự như trong hoạt động Danh bạ Lollipop , hoạt động này ở phần đầu trong khi tham gia hoạt động, các chế độ xem chỉ là một phần của tiêu đề hình ảnh:

nhập mô tả hình ảnh ở đây

Sau đó, người dùng có thể cuộn xuống bố cục bên dưới hình ảnh để hiển thị nhiều hơn cho đến khi nó đạt đến mức tối đa:

nhập mô tả hình ảnh ở đây

Trong ứng dụng của mình, tôi không thể quản lý để làm cho nó hoạt động.

Điều xảy ra là khi vào hoạt động, tiêu đề hình ảnh được hiển thị ở kích thước tối đa, kích thước của AppBarLayout, giống như bố cục ở trên, và không giống như trong hoạt động Liên hệ Lollipop , nơi nó chỉ hiển thị một phần của hình ảnh.

Đây là mã đặt chiều cao của AppBarLayout (Tôi muốn chiều rộng của màn hình là chiều cao tối đa):

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

Và đây là mã thiết lập RecyclerView. Đã thử sử dụng scrollToPosition, những tưởng nó sẽ nâng chế độ xem của RecyclerView lên, nhưng không có tác dụng gì cả:

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

Đây là bố cục 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>

Lưu ý: Nếu tôi cuộn xuống theo cách thủ công, RecyclerView sẽ đi xuống và hiển thị nhiều hình ảnh hơn, nó sẽ không hoạt động thông qua mã.

Tôi nghĩ scrollToPosition không phải là giải pháp, có ai có ý kiến ​​gì không?

Suy nghĩ về việc sử dụng cờ enterAlwaysCollapsed có lẽ như đã đề cập ở đây trong phần CoordinatorLayout và Appbar với minHeight:

enterAlwaysCollapsed: Khi chế độ xem của bạn đã khai báo minHeight và bạn sử dụng cờ này, Chế độ xem của bạn sẽ chỉ nhập ở chiều cao tối thiểu của nó (tức là 'thu gọn'), chỉ mở rộng lại đến chiều cao đầy đủ khi chế độ xem cuộn đạt đến đỉnh.

Vì vậy, tôi đặt cờ scroll | enterAlwaysCollapsed vào thanh công cụ của tôi và minHeight trong RecyclerView của tôi, điều này không hoạt động. Sau đó, tôi đã thử di chuyển minHeight sang các bố cục khác như AppBarLayout, không có gì hoạt động. Nó chỉ thu nhỏ hình ảnh đôi khi mà không có toàn bộ tầm nhìn.



2
Cảm ơn @karaokyo, điều này thực sự hiệu quả. Vẫn đang cố gắng tìm ra các giải pháp khác.
Jjang

@karaokyo bạn có thể kiểm tra cái này được không? stackoverflow.com/questions/33069081/…
Jjang


Tôi sẽ sử dụng MotionLayout để làm công việc này. Xem ví dụ trên https://github.com/android/views-widgets-samples/tree/master/ConstraintLayoutExamples
Lin Lin

Câu trả lời:


1

Các AppBarComponentcung cấp một phương pháp gọi là .setExpanded(boolean expanded), cho phép bạn mở rộng của bạn AppBarComponent.

Nhưng hãy nhớ rằng phương pháp này dựa trên bố cục này là con trực tiếp của a CoordinatorLayout.

Bạn có thể đọc cái này để biết thêm thông tin.

Nếu bạn muốn tạo hoạt ảnh thành một khoảng bù tùy chỉnh, hãy thử sử dụng setTopAndBottomOffset(int)phương pháp này.

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();
}
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.