2013-09-19 4 views
0

У меня есть макет, который я хочу применить прокрутку параллакса. Моя раскладка выглядит следующим образом:прокрутка параллакса в android

enter image description here

И соответствующий XML является:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:orientation="vertical"> 
    <RelativeLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:id="@+id/top_control_bar" 
     android:background="@drawable/container_dropshadow"> 
     <RelativeLayout 
      android:id="@+id/logo_layout" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center_vertical" 
      android:background="#ffffff"> 
      <ImageView 
       android:id="@+id/organiser_logo" 
       android:adjustViewBounds="true" 
       android:scaleType="centerCrop" 
       android:layout_centerInParent="true" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" /> 
     </RelativeLayout> 
    </RelativeLayout> 
    <RelativeLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:id="@+id/bottom_layout" 
     android:layout_below="@+id/top_control_bar"> 
     <LinearLayout 
      android:orientation="vertical" 
      android:minWidth="25px" 
      android:minHeight="25px" 
      android:layout_width="fill_parent" 
      android:layout_below="@+id/top_control_bar" 
      android:layout_height="wrap_content" 
      android:background="@drawable/container_dropshadow" 
      android:id="@+id/explanation_wrapper"> 
      <TextView 
       android:text="@string/no_event_header" 
       android:textAppearance="?android:attr/textAppearanceLarge" 
       android:id="@+id/explanation_header" 
       android:padding="8dip" 
       android:layout_width="wrap_content" 
       android:layout_height="fill_parent" /> 
      <TextView 
       android:text="@string/no_event_text_1st_paragraph" 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:id="@+id/explanation_1st_paragraph" 
       android:paddingTop="8dip" 
       android:paddingRight="20dip" 
       android:paddingBottom="10dip" 
       android:paddingLeft="10dip" /> 
     </LinearLayout> 
     <ListView 
      android:id="@+id/album_active_list" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:choiceMode="singleChoice" 
      android:background="@drawable/container_dropshadow" 
      android:layout_below="@+id/explanation_wrapper" /> 
    </RelativeLayout> 
</RelativeLayout> 

Мне нужно, чтобы получить средний слой будет прокручиваться над нижним слоем. И когда в верхней части нет места (средний слой полностью прокручивается над нижним слоем), мне нужен верхний слой для прокрутки над средним уровнем.

Как достичь такого поведения?

ответ

1

Вы можете использовать это https://github.com/chrisjenx/ParallaxScrollView. Его довольно простой в использовании, и вы можете проверить демонстрационное приложение. https://github.com/chrisjenx/ParallaxScrollView/downloads

+0

Есть ли что-то для Mono? Потому что это только родной Android. –

+0

У меня есть порт здесь: https://github.com/Cheesebaron/ParallaxScrollView – Cheesebaron

1

Я нашел ответ сам после экспериментирования с XML-макетом. Соответствующий XML заключается в следующем:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/scroll_view" 
    android:background="#ffffff" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

     <TextView 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:background="#ff00ff" 
     android:padding="15dip" 
     android:text="Hello ParallaxScrollView 1 !" 
     android:layout_marginTop="5dip"/> 

    <ScrollView 
     android:id="@+id/sv" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content"> 

     <LinearLayout 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:background="@android:color/transparent" 
      android:orientation="vertical" > 

      <!-- This Linearlayout is used as padding but 60dip is fixed so that needs to be calculated dynamically--> 
      <LinearLayout 
       android:layout_width="fill_parent" 
       android:background="@android:color/transparent" 
       android:layout_height="60dip" 
       android:baselineAligned="true" 
       android:orientation="vertical"/> 

      <LinearLayout 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:background="#dddddd" 
       android:orientation="vertical" > 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:background="#ff0000" 
         android:padding="15dip" 
         android:text="Hello ParallaxScrollView 1 !" 
         android:layout_marginTop="5dip"/> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:background="#ff0000" 
         android:padding="15dip" 
         android:text="Hello ParallaxScrollView 1 !" 
         android:layout_marginTop="5dip"/> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:background="#ff0000" 
         android:padding="15dip" 
         android:text="Hello ParallaxScrollView 1 !" 
         android:layout_marginTop="5dip"/> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:background="#ff0000" 
         android:padding="15dip" 
         android:text="Hello ParallaxScrollView 1 !" 
         android:layout_marginTop="5dip"/> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:background="#ff0000" 
         android:padding="15dip" 
         android:text="Hello ParallaxScrollView 1 !" 
         android:layout_marginTop="5dip"/> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:background="#ff0000" 
         android:padding="15dip" 
         android:text="Hello ParallaxScrollView 1 !" 
         android:layout_marginTop="5dip"/> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:background="#ff0000" 
         android:padding="15dip" 
         android:text="Hello ParallaxScrollView 1 !" 
         android:layout_marginTop="5dip"/> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:background="#ff0000" 
         android:padding="15dip" 
         android:text="Hello ParallaxScrollView 1 !" 
         android:layout_marginTop="5dip"/> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:background="#ff0000" 
         android:padding="15dip" 
         android:text="Hello ParallaxScrollView 1 !" 
         android:layout_marginTop="5dip"/> 

       </LinearLayout> 

     </LinearLayout> 

    </ScrollView> 



</RelativeLayout> 
0

enter image description here

@Override 
public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount,int totalItemCount)                             
      { 
      if (listView.getFirstVisiblePosition() == 0) { 
      View firstChild = listView.getChildAt(0); 
      int topY = 0; 
      if (firstChild != null) { 
       topY = firstChild.getTop(); 
      } 

      int heroTopY = stickyViewSpacer.getTop(); 
      stickyView.setY(Math.max(0, heroTopY + topY)); 
      imageView.setY(topY * 0.5f); 
     } 
    } 
}); 

для получения дополнительной справочной нажмите здесь http://androiddhina.blogspot.in/2015/08/listview-header-parallax-with-sticky-view-in-android.html

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