PagerAdapter, deuxième page visible au début

Question

J'essaie de comprendre, comment la chose suivante est faite avec l'interface utilisateur Android. Je ne pense pas que je suis le seul avec ce problème, mais je ne sais pas quoi chercher et je n'ai pas trouvé d'informations utiles pour le moment.

Ma situation:

Au moment où j'ai une classe extension de la FragmentStatePagerAdapter pour obtenir les fragments pour mes pages. J'ai un "principal" fragment (qui ne devrait pas être remplissant d'écran !! < - des informations très importantes ici) et certains suivant écran de remplissage pages à venir.

J'ai aussi un PageTransformer, qui transforme les pages, comme si elles sont déjà derrière la page en cours) Similaire à la DepthPageTransformer sur cette page. http://developer.android.com/training/animation/screen-slide.html#viewpager

Mon EcrAccueil devrait ressembler à ceci:

Je vais l'expliquer brièvement: La zone avec le coin arrondi sur la gauche est la page principale, qui ne remplit pas l'écran. Derrière cette page principale, la deuxième page devrait déjà être visible en arrière-plan. Lorsque je balaye la page principale vers la gauche, la deuxième page sera la page active suivante.

Alors, voici le problème:

La deuxième page ne figure pas dans l'arrière-plan, jusqu'à ce que je commence à transformer (swipe) la page principale. J'ai commencé à construire le scénario (non encore fini à cause du problème), et il ressemble à ceci:

Le gradient sombre dans le dos est le gradient standard Android. La zone bleu clair est une image étirée avec transparence (dans le cas où c'est une pièce pour le casse-tête)

Alors quand je commence à balayer la page principale, ça ressemble soudainement à ceci. Après retour à la page principale du second reste visible alors:

Telle est la situation, il devrait ressembler dès le début.

Comment puis-je réaliser cela, que deux pages sont visibles depuis le début? Ceci est le code principal d'activité (essentiellement c'est le code du lien dev Android donné sans ses commentaires):

public class MainActivity extends FragmentActivity { 

    private static final int NUM_PAGES = 5; 
    private ViewPager mPager; 
    private PagerAdapter mPagerAdapter; 

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

     // Instantiate a ViewPager and a PagerAdapter. 
     mPager = (ViewPager) findViewById(R.id.pager); 
     mPagerAdapter = new ScreenSlidePagerAdapter(getSupportFragmentManager()); 
     mPager.setAdapter(mPagerAdapter); 
     mPager.setPageTransformer(true, new DepthPageTransformer()); 
    } 

    @Override 
    public void onBackPressed() { 
     if (mPager.getCurrentItem() == 0) { 
      super.onBackPressed(); 
     } else { 
      mPager.setCurrentItem(mPager.getCurrentItem() - 1); 
     } 
    } 

    /** 
    * A simple pager adapter that represents 5 ScreenSlidePageFragment objects, 
    * in sequence. 
    */ 
    private class ScreenSlidePagerAdapter extends FragmentStatePagerAdapter { 
     public ScreenSlidePagerAdapter(FragmentManager fragmentManager) { 
      super(fragmentManager); 
     } 

     @Override 
     public Fragment getItem(int position) { 
      switch (position) { 
      case 0: 
       return new ScreenMainSlideFragment(); 
      } 
      return new ScreenSlideFragment(); 
     } 

     @Override 
     public int getCount() { 
      return NUM_PAGES; 
     } 
    } 

} 

Et voici le PageTransformer (peut-être il y a une solution):

public class DepthPageTransformer implements PageTransformer { 
    private static float MIN_SCALE = 1f; 

    public void transformPage(View view, float position) { 
     int pageWidth = view.getWidth(); 

     if (position < -1) { // [-Infinity,-1) 
      // This page is way off-screen to the left. 
      view.setAlpha(0); 

     } else if (position <= 0) { // [-1,0] 
      // Use the default slide transition when moving to the left page 
      view.setAlpha(1); 
      view.setTranslationX(0); 
      view.setScaleX(1); 
      view.setScaleY(1); 

     } else if (position <= 1) { // (0,1] 
      // Fade the page out. 
      view.setAlpha(0.75f + (1 - position) * 0.25f); 

      // Counteract the default slide transition 
      view.setTranslationX(pageWidth * -position); 

      // Scale the page down (between MIN_SCALE and 1) 
      float scaleFactor = MIN_SCALE + (1 - MIN_SCALE) * (1 - Math.abs(position)); 
      view.setScaleX(scaleFactor); 
      view.setScaleY(scaleFactor); 

     } else { // (1,+Infinity] 
      // This page is way off-screen to the right. 
      view.setAlpha(0); 
     } 
    } 
} 

Remerciez vous beaucoup!

Answer 1

Je ne sais pas si cela résoudra entièrement votre problème, mais avez-vous examiné la méthode getPageWidth de l'adaptateur de votre ViewPager.Il pourrait vous aider là où vous voulez aller:

https://developer.android.com/reference/android/support/v4/view/PagerAdapter.html#getPageWidth(int)

Retour d'une valeur inférieure à 1 dans votre mise en œuvre de l'adaptateur:

... 
private static final int POS_MAIN_PAGE = 0; 
private static final float WIDTH_MAIN_PAGE = 0.9f; 
... 

... 
@Override 
public float getPageWidth (int position) { 
    if (position == POS_MAIN_PAGE) { 
     return WIDTH_MAIN_PAGE; 
    } 
    return 1f; 
} 
.... 

Mise à jour après le commentaire OP:

Si la La 2ème page doit être visible en même temps que la première, puis un ViewPager peut ne pas être le bon contrôle pour vous. Les pages d'un ViewPager sont affichées l'une à côté de l'autre et non l'une sur l'autre.

Ce que vous pouvez faire est de montrer à la fois votre principale et page « 2 » dans la première page (position == 0) de votre ViewPager (un ViewGroup/Fragment contenant à la fois le principal et la page « 2 », où votre la page principale est légèrement plus petite). Votre deuxième page est fixe, votre page principale pourrait être un tiroir coulissant. Lorsque l'utilisateur effectue un balayage vers la gauche sur les pages principales (c'est-à-dire sur le tiroir coulissant), la page principale risque de glisser hors de vue et la page "2" reste en place. Lorsque l'utilisateur glisse vers la gauche sur la page "2ème", la page "3ème" de votre ViewPager peut être affichée de la manière habituelle de la façon dont un ViewPager se déplace d'un écran à l'autre et (le principal et le) la page disparaîtra de la vue.