English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Effet de suspension en haut lorsque l'on glisse Android

Examinons d'abord l'effet visuel à réaliser :

Après consultation des documents, j'ai découvert que la plupart des méthodes en ligne utilisent cette approche :

Ajoutez un layout identique à la partie flottante nécessaire, puis mettez la visibilité de la zone flottante en gone. Lorsque la zone flottante glisse vers le sommet, mettez la visibilité de la zone flottante B en VISIBLE. Cela donne l'illusion que la zone flottante reste immobile en haut.

Voici une autre méthode :

utilisation des contrôles du paquet design

<android.support.design.widget.CoordinatorLayout
 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="match_parent"
 android:fitsSystemWindows="true"
 tools:context="com.peipei.app.MainActivity">
 <android.support.design.widget.AppBarLayout
 android:layout_width="match_parent"
 android:layout_height="250dp">
 <android.support.design.widget.CollapsingToolbarLayout
  app:layout_scrollFlags="scroll"
  app:contentScrim="#000000"
  android:layout_width="match_parent"
  android:layout_height="220dp">
  <TextView
  android:text="zone banner"
  android:gravity="center"
  android:textColor="#ffffff"
  android:background="#987545"
  android:layout_width="match_parent"
  android:layout_height="220dp"/>
 </android.support.design.widget.CollapsingToolbarLayout>
 <TextView
  android:gravity="center"
  android:layout_width="match_parent"
  android:layout_height="30dp"
  android:text="part flottant"/>
 </android.support.design.widget.AppBarLayout>
 <android.support.v>4.widget.NestedScrollView
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  app:layout_behavior="@string/appbar_scrolling_view_behavior">
  <TextView
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_margin="@dimen/text_margin"
  android:text="@string/large_text"/>
 </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

Étapes d'implémentation :

1、Placer le layout qui doit flotter à l'extérieur de CollapsingToolbarLayout et à l'intérieur de AppBarLayout

2、Définissez les app:layout_scrollFlags de CollapsingToolbarLayout sur scroll

3、Donnez le comportement de défilement NestedScroolView

      app:layout_behavior="@String/appbar_scrolling_view_behavior"

C'est terminé (n'oubliez pas que le layout racine doit être CoordinatorLayout)

Effet final :

Résumé

C'est tout pour l'effet de suspension à la partie supérieure glissante d'Android, avez-vous tous appris ? J'espère que cet article apportera un certain avantage à votre apprentissage ou à votre travail, si vous avez des doutes, vous pouvez laisser des commentaires pour échanger.

Vous pourriez aussi aimer