FragmentPagerAdapter Scorri per mostrare ListView 1/3 Screen Width

EDIT: vedere la mia risposta qui sotto ->

Sto volendo avere una vista che quando si scorre a destra, viene mostrato il listView. Molto simile a ciò che è implementato nel nuovo Google Play Store (immagine di esempio sotto). Penso che sia un ViewPager ma ho provato a duplicarlo senza prevalere. Stavo pensando che potrebbe essere solo che l’attributo di larghezza ‘listView Page’ è stato impostato su un dp specifico ma che non funziona. Ho anche provato a modificare viewFlow di pakerfeldt e non riesco a capire come fa Google

Sono sulla buona strada? Se qualcuno ha un’idea su come duplicarlo, lo apprezzerei molto. Penso che questo possa diventare un nuovo modo popolare di mostrare una vista di navigazione su tablet ….? Il codice sarebbe il migliore aiuto. Grazie!!

inserisci la descrizione dell'immagine qui

Scorri verso destra:

inserisci la descrizione dell'immagine qui

Scorrimento finito; il layout mostra l’elenco e PARTE DEL SECONDO FRAMMENTO (ESATTAMENTE COME INDICATO) Il frammento della lista non riempie lo schermo:

inserisci la descrizione dell'immagine qui

Quando l’utente scorre verso sinistra, la pagina principale viene visualizzata solo e se l’utente fa scorrere di nuovo sinistra, viewPager continua alla pagina successiva.

Il codice seguente raggiunge l’effetto desiderato:

In PageAdapter :

 @Override public float getPageWidth(int position) { if (position == 0) { return(0.5f); } else { return (1.0f); } 

Leggendo la tua domanda un’ultima volta … assicurati di configurare anche layout specifici per ogni dispositivo di dimensioni. Nei tuoi screenshot sembra che tu stia cercando di eseguirlo su un tablet. Stai ottenendo gli stessi risultati su un telefono?

Impostazione del tuo layout

Assicurati che il tuo layout sia simile a questo e abbia ViewPager:

      

Impostazione della tua attività

Imposta il tuo PagerAdapter nel tuo “FragmentActivity” e assicurati di implementare “OnPageChangeListener”. Quindi imposta correttamente il tuo PagerAdapter nel tuo onCreate.

 public class Activity extends FragmentActivity implements ViewPager.OnPageChangeListener { ... public void onCreate(Bundle savedInstanceState) { PagerAdapter adapter = new PagerAdapter(getSupportFragmentManager()); pager = (ViewPager) findViewById(R.id.example_pager); pager.setAdapter(adapter); pager.setOnPageChangeListener(this); pager.setCurrentItem(MyFragment.PAGE_LEFT); ... } /* setup your PagerAdapter which extends FragmentPagerAdapter */ static class PagerAdapter extends FragmentPagerAdapter { public static final int NUM_PAGES = 2; private MyFragment[] mFragments = new MyFragment[NUM_PAGES]; public PagerAdapter(FragmentManager fragmentManager) { super(fragmentManager); } @Override public int getCount() { return NUM_PAGES; } @Override public Fragment getItem(int position) { if (mFragments[position] == null) { /* this calls the newInstance from when you setup the ListFragment */ mFragments[position] = MyFragment.newInstance(position); } return mFragments[position]; } } ... 

Configura il tuo frammento

Quando imposti il ​​tuo ListFragment reale (il tuo listView) puoi creare istanze multiple con argomenti come il seguente:

  public static final int PAGE_LEFT = 0; public static final int PAGE_RIGHT = 1; static MyFragment newInstance(int num) { MyFragment fragment = new MyFragment(); Bundle args = new Bundle(); args.putInt("num", num); fragment.setArguments(args); return fragment; } 

Quando ricarichi le listview (come mai decidi di implementarle), puoi capire a quale istanza di frammento si sta utilizzando gli argomenti in questo modo:

  mNum = getArguments() != null ? getArguments().getInt("num") : 1; 

Se passi attraverso il tuo codice, noterai che passerà attraverso ogni istanza, quindi il codice sopra riportato è necessario solo nel tuo onCreate e un metodo di ricarica potrebbe essere simile al seguente:

 private void reloadFromArguments() { /* mNum is a variable which was created for each instance in the onCreate */ switch (mNum) { case PAGE_LEFT: /* maybe a query here would fit your needs? */ break; case PAGE_RIGHT: /* maybe a query here would fit your needs? */ break; } } 

Poche fonti possono aiutarti con esempi da cui potresti partire, piuttosto che partire da zero:

Altre spiegazioni ed esempi dal parco giochi. http://blog.peterkuterna.net/2011/09/viewpager-meets-swipey-tabs.html che è un riferimento a: http://code.google.com/p/android-playground/

Maggiori informazioni e un buon collegamento. http://www.pushing-pixels.org/2012/03/16/responsive-mobile-design-on-android-from-view-pager-to-action-bar-tabs.html

Se hai domande più specifiche post e posso sempre modificare (aggiornare) la mia risposta per rispondere alle tue domande. In bocca al lupo! 🙂

Ci scusiamo per l’ultimo aggiornamento. L’ho implementato da walkingice su Gethub con pochissime modifiche. Basta usare un’istruzione condizionale per GestureDetector per visualizzarla in modo visibile solo quando è visualizzato un ID di ViewPager di “0”. Ho anche aggiunto un interruttore nella mia ActionBar

ViewPager è una parte del pacchetto compatibile

Se stai usando Fragments , puoi usare ViewPager per scorrere tra loro.

Ecco un esempio di combinazione di Fragments e ViewPager

Nel tuo caso particolare, vorrai creare un ListFragment e quindi implementare ViewPager .

Penso che tu stia cercando di implementare una “navigazione laterale” accanto a un ViewPager standard.

Ho letto 2 articoli diversi su questo modello:

Il primo sul pattern stesso:

Modello Ui Android Modello UI emergente – Navigazione laterale

Il secondo su un modo più dettagliato di chi costruirlo:

Cyril Mottier Fly-in menu app # 1 # 2 # 3

Questo secondo articolo è referenziato nel blog Android Ui Pattern.

Con un piccolo trucco, il comportamento può essere ottenuto con il comportamento di ScrollView all’interno di ViewPager. Se si desidera limitare l’area del frammento più a sinistra, è ansible limitare i limiti di scorrimento di ScrollView.

Nel tuo caso: in onPageChangeListener del ViewPager fai qualcosa del genere:

 @Override public void onPageScrollStateChanged(int arg0) { restrictLeftScroll(); } @Override public void onPageScrolled(int arg0, float arg1, int arg2) { restrictLeftScroll(); } @Override public void onPageSelected(int arg0) { } private void restrictLeftScroll() { if (display != null) { /* get display size */ Point size = new Point(); display.getSize(size); /* get desired Width of left fragment */ int fragmentWidth = getResources().getDimensionPixelSize(R.dimen.category_fragment_width); if (mViewPager.getScrollX() < size.x - fragmentWidth) { mViewPager.scrollTo(size.x - fragmentWidth, mViewPager.getScrollY()); } } } 

Questo pezzo di codice ha funzionato per me senza problemi. 😉