Autore Topic: ListView che si sposta per lasciare spazio all'immagine sotto  (Letto 814 volte)

Offline ValerioAdo

  • Utente normale
  • ***
  • Post: 316
  • Respect: 0
    • Mostra profilo
  • Dispositivo Android:
    Huawei Ascend g525
  • Sistema operativo:
    windows 8.1
ListView che si sposta per lasciare spazio all'immagine sotto
« il: 29 Febbraio 2016, 16:35:12 CET »
0
Salve a tutti!

Avete presente quell'effetto che alcune app hanno dove, con una immagine di sfondo ed una listview a livello superiore, se tiro giù la listview questa lista si sposta in basso lasciando più spazio all'immagine di sfondo, se invece sposto la lista verso l'alto l'immagine di sfondo si copre (parzialmente) per poi darmi la possibilità di usare la listview normalmente.

Sperando di essermi spiegato bene, voi sapreste dirmi come si chiama questo effetto?

Grazie mille in anticipo!

P.S.
Se volete un esempio pratico ci sarebbe l'app di maps che fa una cosa simile a quella che voglio io quando premi  "cronologia" nel menu.

Offline iClaude

  • Utente normale
  • ***
  • Post: 183
  • Respect: +13
    • Mostra profilo
  • Dispositivo Android:
    Samsung Galaxy S5
  • Sistema operativo:
    Windows 10
Re:ListView che si sposta per lasciare spazio all'immagine sotto
« Risposta #1 il: 01 Marzo 2016, 19:14:49 CET »
0
Questo è un semplice esempio che fa uso di una ScrollView.

Il layout dell'Activity è così definito.
Da notare il paddingTop della ScrollView impostato su 400dp per lasciare scoperta l'immagine completamente all'inizio; importante è impostare clipToPadding su false altrimenti non funziona.
La terza TextView contiene parecchio testo in modo da poter scrollare la ScrollView.

Codice (XML): [Seleziona]
<?xml version="1.0" encoding="utf-8"?>

<FrameLayout 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"
   android:paddingBottom="@dimen/activity_vertical_margin"
   android:paddingLeft="@dimen/activity_horizontal_margin"
   android:paddingRight="@dimen/activity_horizontal_margin"
   android:paddingTop="@dimen/activity_vertical_margin"
   tools:context="test.instructivemotion.MainActivity">


    <ImageView
       android:layout_width="match_parent"
       android:layout_height="400dp"
       android:id="@+id/imageView"
       android:src="@drawable/munch"
       android:scaleType="centerCrop" />

    <ScrollView
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:id="@+id/scrollView"
       android:paddingTop="400dp"
       android:clipToPadding="false">

        <LinearLayout
           android:orientation="vertical"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:background="#fff"
           android:elevation="8dp">


            <TextView
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:textAppearance="?android:attr/textAppearanceLarge"
               android:text="@string/title"
               android:id="@+id/textView"
               android:textStyle="bold" />

            <TextView
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:textAppearance="?android:attr/textAppearanceLarge"
               android:text="@string/subtitle"
               android:id="@+id/textView2"
               android:textStyle="italic" />

            <TextView
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:textAppearance="?android:attr/textAppearanceMedium"
               android:text="@string/body"
               android:id="@+id/textView3" />

        </LinearLayout>
    </ScrollView>
</FrameLayout>

File dimens.xml
Codice (XML): [Seleziona]
<resources>
    <!-- Default screen margins, per the Android Design guidelines. -->
    <dimen name="activity_horizontal_margin">16dp</dimen>
    <dimen name="activity_vertical_margin">16dp</dimen>
    <dimen name="init_scroll_up_distance">200dp</dimen>
</resources>

Questo il codice dell'Activity:
Codice (Java): [Seleziona]
package test.instructivemotion;

import android.animation.Animator;
import android.animation.ObjectAnimator;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ScrollView;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

    @Override
    public void onEnterAnimationComplete() {
        super.onEnterAnimationComplete();

        ScrollView scrollView = (ScrollView) findViewById(R.id.scrollView);
        final int startScrollPos = getResources().getDimensionPixelSize(R.dimen.init_scroll_up_distance);
        Animator animator = ObjectAnimator.ofInt(scrollView, "scrollY", startScrollPos).setDuration(300);
        animator.start();
    }
}

Da notare:
- l'animazione viene fatta partire in onEnterAnimationComplete per fare in modo che eventuali animazioni all'ingresso della Activity vengano completate
- con un ObjectAnimator si anima la proprietà scrollY della ScrollView

Per il resto il codice fa esattamente quello che hai chiesto.

Offline ValerioAdo

  • Utente normale
  • ***
  • Post: 316
  • Respect: 0
    • Mostra profilo
  • Dispositivo Android:
    Huawei Ascend g525
  • Sistema operativo:
    windows 8.1
Re:ListView che si sposta per lasciare spazio all'immagine sotto
« Risposta #2 il: 02 Marzo 2016, 08:39:47 CET »
0
oh, grazie mille!
Non mi aspettavo addirittura il codice ^^

lo provo subito :D

Offline Oneliklyu

  • Nuovo arrivato
  • *
  • Post: 2
  • Respect: 0
    • Mostra profilo
    • ทางเข้า maxbet
Re:ListView che si sposta per lasciare spazio all'immagine sotto
« Risposta #3 il: 26 Aprile 2016, 10:18:58 CEST »
0
 The issue led me to know that I think is even more amazing.