2015-05-22 5 views
8

На самом деле я не знаю, как он правильно называется - наложение, параллакс или slideUP, независимо от того, у меня есть Activity, называемый «cafe details», который представляет Container (LinearLayout) с информацией заголовка (имя, минимальная цена, время доставки мин и т. д.) и другой контейнер (ViewPager), который содержит ExpandableListView с чем-то информацией (меню &), и все, что я хочу сделать, это сдвинуть мой Viewpager при просмотре списка прокрутки в определенное положение Y для покрытия (или наложения) заголовок.ListView накладывает другой макет при прокрутке

MyPic

Аналогичный эффект (но с параллаксом, что мне не нужно использовать) выглядит следующим образом

Similar effect

Я могу определить, когда пользователь прокрутки ListView вниз или вверх, но, как я может перемещать контейнер с ViewPager для наложения другого контейнера? Пожалуйста, дайте мне идеи, пожелания.

UPD Я пробовал огромное количество способов, как реализовать его, и все они, к сожалению, не подходят. Итак, теперь я пришел к следующему варианту: добавьте прослушиватель прокрутки в ListView, вычислите позицию просмотра scrollY и затем на основе этого переместите viewpager на ось y, вызвав setTranslationY(); Вот код

1) фрагмент ViewPager в

mListView.setOnScrollListener(new AbsListView.OnScrollListener() { 
     @Override 
     public void onScrollStateChanged(AbsListView absListView, int i) { 

     } 

     @Override 
     public void onScroll(AbsListView absListView, int i, int i1, int i2) { 
      if (getActivity() != null) { 
       ((MainActivity) getActivity()).resizePagerContainer(absListView); 
      } 
     } 
    }); 

2) MainActivity

//object fields 

int previousPos; 
private float minTranslation; 
private float minHeight; 

<--------somewhere in onCreate 

minTranslation = - (llVendorDescHeaders.getMeasuredHeight()+llVendorDescNote.getMeasuredHeight()); 
//llVendorDescHeaders is linearLayout with headers that should be hidden 
//lVendorDescNote is a textView on green background; 

minHeight = llVendorDescriptionPagerContainer.getMeasuredHeight(); 
//llVendorDescriptionPagerContainer is a container which contains ViewPager 
---------> 

public void resizePagerContainer(AbsListView absListView){ 

    final int scrollY = getScrollY(absListView); 
    if (scrollY != previousPos) { 
     final float translationY = Math.max(-scrollY, minTranslation); 

     llVendorDescriptionPagerContainer.setTranslationY(translationY); 

     previousPos = scrollY; 
    } 
} 

private int getScrollY(AbsListView view) { 
    View child = view.getChildAt(0); 
    if (child == null) { 
     return 0; 
    } 

    int firstVisiblePosition = view.getFirstVisiblePosition(); 
    int top = child.getTop(); 

    return -top + firstVisiblePosition * child.getHeight() ; 
} 

Это простое решение, к сожалению, есть проблема - он мигает и подергивание (я не знаю, как называть его правильным), когда прокручивается медленно. Таким образом, вместо setTranslationY() я использовал objectAnimator:

public void resizePagerContainer(AbsListView absListView){ 
    ............. 

    ObjectAnimator moveAnim = ObjectAnimator.ofFloat(llVendorDescriptionPagerContainer, "translationY", translationY); 
    moveAnim.start(); 
    .............. 
} 

мне не нравится это решение, потому что 1) в любом случае он делает размер ViewPager с задержкой, не сразу 2) Я не думаю, что это хорошая идея для создания многих объектов ObjectAnimator каждый раз при прокрутке списка ListView. Нужна ваша помощь и свежие идеи. С уважением.

ответ

1

Вы пробовали CoordinatorLayout из библиотеки поддержки проектирования этого нового андроида? Похоже, это то, что вам нужно. Check this video from 3:40 или this blog post.

+0

спасибо за ваш ответ, я не знал, что Google недавно выпустил новые трюки в библиотеке поддержки Android – whizzzkey

2

Я предполагаю, что вы прокручиваете верхний Заголовок (ImageView является потомком заголовка) на основе scrollY в ListView/ScrollView, как показано ниже:

float translationY = Math.max(-scrollY, mMinHeaderTranslation); 
mHeader.setTranslationY(translationY); 
mTopImage.setTranslationY(-translationY/3); // For parallax effect 

Если вы хотите вставьте заголовок/изображение в определенное измерение и продолжайте прокрутку, не перемещая его больше, тогда вы можете изменить значение mMinHeaderTranslation для достижения этого эффекта.

//change this value to increase the dimension of header stuck on the top 
int tabHeight = getResources().getDimensionPixelSize(R.dimen.tab_height); 

mHeaderHeight = getResources().getDimensionPixelSize(R.dimen.header_height); 
mMinHeaderTranslation = -mHeaderHeight + tabHeight; 

Фрагменты кода, приведенные выше, относятся к моей демонстрации, но я думаю, что это все еще достаточно для вас.

Если вы заинтересованы вы можете проверить свою демо https://github.com/boxme/ParallaxHeaderViewPager

Смежные вопросы