Araç/aç / kapat animasyonun nasıl yapıldığını anlamaya çalışıyorum. Eğer Telgraf uygulama ayarlarını bir göz varsa, bir liste görünümü ve araç olduğunu göreceksiniz. Aşağı kaydırma yaptığınızda, araç çöküşü ve yukarı kaydırma zaman genişletir. Ayrıca profil pic ve FAB animasyonu var. Herkes bu konuda herhangi bir ipucu var mı? Bunun üstüne tüm animasyonları inşa ettiklerini sanıyorsun? Belki yeni API desteği veya kütüphaneden bir şeyler kaçırıyorum.

Fark ettim aynı davranışları üzerinde Google Takvim uygulaması, seni ne zaman Aç Spinner (sanmıyorum bu bir spinner, ama görünüşe göre): araç genişler ve yukarı kaydır, daralt.

Sadece clearify için: QuickReturn yöntemi ihtiyacım yok. Muhtemelen Telgraf app benzer bir şey kullanıyor biliyorum. İhtiyacım olan tam olarak bu yöntemi Google Takvim uygulaması etkisidir. Denedim

android:animateLayoutChanges="true"

ve oldukça iyi yöntem çalışır genişletin. Ama belli ki, Eğer Liste Görünümü ben kaydırma, araç çöküşü değil.

Ayrıca GestureListener bir ekleme düşündüm ama eğer herhangi bir API ya da bu ulaşmanın daha basit bir yöntem varsa bilmek istiyorum.

Eğer hiçbiri varsa, GestureListener ile gideceğim sanırım. Animasyon pürüzsüz bir etkisi yoktur umarım.

Teşekkürler!

Nasıl yaptığımı burada, muhtemelen diğer birçok çözümü vardır ama bu benim için çalıştı.

1. Öncelikle, şeffaf bir arka plan ile Toolbar kullanmak zorunda. Genişleyen & Toolbar çöken aslındasahtebu saydam altında bir 10**. (ilk ekran görüntüsü aşağıda - kenar boşlukları olan bu Telgrafta, nasıl yaptıklarını da olduğunu) görebilirsiniz.

   Biz sadece gerçek NavigationIcon Toolbar taşma MenuItem devam et.

   

2. İkinci ekran üzerinde kırmızı dikdörtgen (yani sahte Toolbar FloatingActionButton) içindeki her şeyi aslındabir başlıkayarları ListView (ya da ScrollView) ekleyin.

   Şöyle ayrı bir dosyada bu başlık için bir düzen oluşturmak zorunda :

    <!-- The headerView layout. Includes the fake Toolbar & the FloatingActionButton -->
   
    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
       android:layout_width="match_parent"
       android:layout_height="wrap_content">
   
       <RelativeLayout
           android:id="@ id/header_container"
           android:layout_width="match_parent"
           android:layout_height="@dimen/header_height"
           android:layout_marginBottom="3dp"
           android:background="@android:color/holo_blue_dark">
   
           <RelativeLayout
               android:id="@ id/header_infos_container"
               android:layout_width="match_parent"
               android:layout_height="wrap_content"
               android:layout_alignParentBottom="true"
               android:padding="16dp">
   
               <ImageView
                   android:id="@ id/header_picture"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:layout_centerVertical="true"
                   android:layout_marginRight="8dp"
                   android:src="@android:drawable/ic_dialog_info" />
   
               <TextView
                   android:id="@ id/header_title"
                   style="@style/TextAppearance.AppCompat.Title"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:layout_toRightOf="@ id/header_picture"
                   android:text="Toolbar Title"
                   android:textColor="@android:color/white" />
   
               <TextView
                   android:id="@ id/header_subtitle"
                   style="@style/TextAppearance.AppCompat.Subhead"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:layout_below="@ id/header_title"
                   android:layout_toRightOf="@ id/header_picture"
                   android:text="Toolbar Subtitle"
                   android:textColor="@android:color/white" />
   
           </RelativeLayout>
       </RelativeLayout>
   
       <FloatingActionButton
           android:id="@ id/header_fab"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_gravity="bottom|right"
           android:layout_margin="10dp"
           android:src="@drawable/ic_open_in_browser"/>
   
   </FrameLayout>
   

   (Fab 2 Views payından olmak için doldurma/negatif kenar boşlukları kullanın) unutmayın

3. Şimdi işin ilginç kısmı. Bizim sahte genişleme animasyon için Toolbar, ListView onScrollListenerbu uygulamaya.

   // The height of your fully expanded header view (same than in the xml layout)
   int headerHeight = getResources().getDimensionPixelSize(R.dimen.header_height);
   // The height of your fully collapsed header view. Actually the Toolbar height (56dp)
   int minHeaderHeight = getResources().getDimensionPixelSize(R.dimen.action_bar_height);
   // The left margin of the Toolbar title (according to specs, 72dp)
   int toolbarTitleLeftMargin = getResources().getDimensionPixelSize(R.dimen.toolbar_left_margin);
   // Added after edit
   int minHeaderTranslation;
   
   private ListView listView;
   
   // Header views
   private View headerView;
   private RelativeLayout headerContainer;
   private TextView headerTitle;
   private TextView headerSubtitle;
   private FloatingActionButton headerFab;
   
   
   @Override
   public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
   {
       View rootView = inflater.inflate(R.layout.listview_fragment, container, false);
       listView = rootView.findViewById(R.id.listview);
   
       // Init the headerHeight and minHeaderTranslation values
   
       headerHeight = getResources().getDimensionPixelSize(R.dimen.header_height);
       minHeaderTranslation = -headerHeight   
           getResources().getDimensionPixelOffset(R.dimen.action_bar_height);
   
       // Inflate your header view
       headerView = inflater.inflate(R.layout.header_view, listview, false);
   
       // Retrieve the header views
       headerContainer = (RelativeLayout) headerView.findViewById(R.id.header_container);
       headerTitle = (TextView) headerView.findViewById(R.id.header_title);
       headerSubtitle = (TextView) headerView.findViewById(R.id.header_subtitle);
       headerFab = (TextView) headerView.findViewById(R.id.header_fab);;
   
       // Add the headerView to your listView
       listView.addHeaderView(headerView, null, false);
   
       // Set the onScrollListener
       listView.setOnScrollListener(this);        
   
       // ...
   
       return rootView;
   }
   
   @Override
   public void onScrollStateChanged(AbsListView view, int scrollState)
   {
       // Do nothing
   }
   
   
   @Override
   public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount)
   {
       Integer scrollY = getScrollY(view);
   
       // This will collapse the header when scrolling, until its height reaches
       // the toolbar height
       headerView.setTranslationY(Math.max(0, scrollY   minHeaderTranslation));
   
       // Scroll ratio (0 <= ratio <= 1). 
       // The ratio value is 0 when the header is completely expanded, 
       // 1 when it is completely collapsed
       float offset = 1 - Math.max(
           (float) (-minHeaderTranslation - scrollY) / -minHeaderTranslation, 0f);
   
   
       // Now that we have this ratio, we only have to apply translations, scales,
       // alpha, etc. to the header views
   
       // For instance, this will move the toolbar title & subtitle on the X axis 
       // from its original position when the ListView will be completely scrolled
       // down, to the Toolbar title position when it will be scrolled up.
       headerTitle.setTranslationX(toolbarTitleLeftMargin * offset);
       headerSubtitle.setTranslationX(toolbarTitleLeftMargin * offset);
   
       // Or we can make the FAB disappear when the ListView is scrolled 
       headerFab.setAlpha(1 - offset);
   }
   
   
   // Method that allows us to get the scroll Y position of the ListView
   public int getScrollY(AbsListView view)
   {
       View c = view.getChildAt(0);
   
       if (c == null)
           return 0;
   
       int firstVisiblePosition = view.getFirstVisiblePosition();
       int top = c.getTop();
   
       int headerHeight = 0;
       if (firstVisiblePosition >= 1)
           headerHeight = this.headerHeight;
   
       return -top   firstVisiblePosition * c.getHeight()   headerHeight;
   }
   

Test etmedim, o yüzden hataları vurgulamak için çekinmeyin bu kod bazı parçaları olduğunu unutmayın. Ama genel olarak, bu çözüm çalıştığını biliyorum, geliştirilebilir emin olmama rağmen.

DÜZENLEME :

Birkaç satır da iş yapmak için değiştirdim yukarıdaki kodda bazı hatalar (bugüne kadar test edemedim...) vardı :

1. MinHeaderHeight yerine başka bir değişken, minHeaderTranslation, ben tanıştırdım;

2. Y çeviri değerini başlık görünümünden uygulanan değiştirdim :

       headerView.setTranslationY(Math.max(-scrollY, minHeaderTranslation));
   

   için :

       headerView.setTranslationY(Math.max(0, scrollY   minHeaderTranslation));
   

   Önceki ifadesi hiç çalışmıyordu, bunun için üzgünüm...

3. Oranı hesaplama da hemen altındaki çubuğu yerine ekranın üst) tam genişletilmiş başlığına geliştikçe, bu yüzden bunu değiştirdi.