Android-固定滾動視圖上的標題並具有拉動縮放效果

Question

我目前正在將我們的應用程序從ios重寫為android，因此無法正常工作。 因此，在iOS中，我們使用了此庫來實現具有視差效果的內容滾動視圖上的固定標頭。 我快速修改了該示例並將其導出為gif，以便更清楚地了解我們要實現的目標：

因此，首先，我在CollapsingToolbarLayout上嘗試了一些發現該片段的方法。 因此，基本上，該代碼段添加了AppBarLayout.Behavior實現縮放效果的AppBarLayout.Behavior 。 大修感覺不順暢。

接下來，我發現了PullZoomView ，它在android中似乎很流行。 縮放和滾動行為感覺很棒。 唯一的問題是標題不是固定的，而是被listview過度滾動，如下所示：

因此，我深入研究了代碼，並嘗試針對我的建議對其進行了修改，但它看起來既復雜又復雜。

因此，從我在所有庫中看到的結果來看，這種對頭行為的過度滾動似乎更為常見。 在編寫自己的解決方案之前，有人對我如何實現自己想要的行為有任何建議嗎？ 是否有我找不到的圖書館？

Answer 1

不會直接回答您的問題，但是我制作了一個庫，其中包含一個可在單擊/觸摸時擴展的組件。 我認為您也許可以使用代碼來創建自己的滾動條標題。

https://github.com/NadavTasher/ToolLibs/blob/master/lightool/src/main/java/nadav/tasher/lightool/graphics/views/ExpandingView.java

例如，將固定視圖作為標題，將擴展視圖作為滾動視圖

Answer 2

提交此問題后，我自行寫了一個解決方案。 我真的很喜歡iOS庫中的概念，即您可以為標題和內容部分使用單獨的UIViewController，因此在Android中，似乎可以使用Fragments。 如果有人希望獲得相同的效果，我想共享我的代碼：

將以下依賴項添加到yur build.gradle ：

implementation 'me.everything:overscroll-decor-android:1.0.4'
implementation 'com.github.ksoichiro:android-observablescrollview:1.6.0'

我的課（對不起，有點混亂）：

public abstract class ParallaxHeaderActivity extends AppCompatActivity implements ObservableScrollViewCallbacks {

    private ObservableScrollView scrollView;
    private LinearLayout headerView;
    private FrameLayout contentView;

    private int headerHeight = 0;
    private int minimumHeaderHeight = 0;

    protected void setContentView(int layout, Fragment header, Fragment content){

        super.setContentView(layout);

        ViewGroup rootView = (ViewGroup) ((ViewGroup) this
                .findViewById(android.R.id.content)).getChildAt(0);

        headerHeight = (int)convertDpToPixel(260, this);
        minimumHeaderHeight = (int)convertDpToPixel(160, this);

        int contentViewId = View.generateViewId();

        contentView = new FrameLayout(this);
        contentView.setLayoutParams(new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));
        contentView.setPadding(0, headerHeight, 0, 0);
        contentView.setId(contentViewId);

        scrollView = new ObservableScrollView(this);
        scrollView.setLayoutParams(new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
        scrollView.setScrollViewCallbacks(this);
        scrollView.setFillViewport(true);
        scrollView.addView(contentView);
        scrollView.setScrollViewCallbacks(this);

        IOverScrollDecor decor = new VerticalOverScrollBounceEffectDecorator(new ScrollViewOverScrollDecorAdapter(scrollView));
        decor.setOverScrollUpdateListener(new IOverScrollUpdateListener() {
            @Override
            public void onOverScrollUpdate(IOverScrollDecor decor, int state, float offset) {
                if (offset > 0) {
                    // 'view' is currently being over-scrolled from the top.
                    update((int)-offset);
                }

            }
        });

        rootView.addView(scrollView);

        addFragment(contentViewId, content);

        int headerViewId = View.generateViewId();

        headerView = new LinearLayout(this);
        headerView.setLayoutParams(new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, headerHeight));
        headerView.setId(headerViewId);

        rootView.addView(headerView);

        addFragment(headerViewId, header);

    }


    @Override
    public void onScrollChanged(int scrollY, boolean firstScroll, boolean dragging) {
        update(scrollY);
    }

    @Override
    public void onDownMotionEvent() {
    }

    @Override
    public void onUpOrCancelMotionEvent(ScrollState scrollState) {
    }

    private void addFragment(int id, Fragment fragment){

        final FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
        transaction.replace(id, fragment);
        transaction.addToBackStack(null);
        transaction.commit();

    }

    private void update(final int scrollY) {
        headerView.getLayoutParams().height = Math.max(headerHeight - scrollY, minimumHeaderHeight);
        headerView.requestLayout();
    }

    public static float convertDpToPixel(float dp, Context context){
        return dp * ((float) context.getResources().getDisplayMetrics().densityDpi / DisplayMetrics.DENSITY_DEFAULT);
    }

}

在您的活動中，您可以這樣稱呼它：

setContentView(R.layout.activity_main, new HeaderFragment(), new ContentFragment());

fragment_content.xml：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    tools:context=".ContentFragment">

        <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/white"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:text="@string/lipsum"/>

</FrameLayout>

fragment_header.xml：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">


    <ImageView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:scaleType="centerCrop"
        android:src="@drawable/example"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:text="Test"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="8dp"
        android:ellipsize="end"
        android:gravity="center_vertical"
        android:maxLines="1"
        android:minHeight="?attr/actionBarSize"
        android:textColor="@android:color/white"
        android:textSize="20sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>