ViewPager show next und before item preview auf dem Bildschirm

Question

Ich möchte den viewpager als nächstes und vor der Seitenvorschau im Bildschirm anzeigen. Vorher und nächste Seite zeigen tief in Bildschirm und Folie nächste Seite mit tiefer Animation.

können Sie dieses Bild sehen

, wie ich es tun kann?

Answer 1

Schließlich habe ich es getan it :) Ich ändere diese Antwort Android - Carousel like widget which displays a portion of the left and right elements

Sie können diesen Code aussehen.

//pager settings 
      pager.setClipToPadding(false); 
      pager.setPageMargin(24); 
      pager.setPadding(48, 8, 48, 8); 
      pager.setOffscreenPageLimit(3); 
      pager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() { 

      @Override 
      public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { 
       Log.i("", "onPageScrolled: " + position); 

       CampaignPagerFragment sampleFragment = (CampaignPagerFragment) ((CampaignPagerAdapter) pager.getAdapter()).getRegisteredFragment(position); 


       float scale = 1 - (positionOffset * RATIO_SCALE); 

       // Just a shortcut to findViewById(R.id.image).setScale(scale); 
       sampleFragment.scaleImage(scale); 


       if (position + 1 < pager.getAdapter().getCount()) { 
        sampleFragment = (CampaignPagerFragment) ((CampaignPagerAdapter) pager.getAdapter()).getRegisteredFragment(position + 1); 
        scale = positionOffset * RATIO_SCALE + (1 - RATIO_SCALE); 
        sampleFragment.scaleImage(scale); 
       } 
      } 

      @Override 
      public void onPageSelected(int position) { 
       Log.i("", "onPageSelected: " + position); 
      } 

      @Override 
      public void onPageScrollStateChanged(int state) { 
       Log.i("", "onPageScrollStateChanged: " + state); 
       if (state == ViewPager.SCROLL_STATE_IDLE) { 
        CampaignPagerFragment fragment = (CampaignPagerFragment) ((CampaignPagerAdapter) pager.getAdapter()).getRegisteredFragment(pager.getCurrentItem()); 
        fragment.scaleImage(1); 
        if (pager.getCurrentItem() > 0) { 
         fragment = (CampaignPagerFragment) ((CampaignPagerAdapter) pager.getAdapter()).getRegisteredFragment(pager.getCurrentItem() - 1); 
         fragment.scaleImage(1 - RATIO_SCALE); 
        } 

        if (pager.getCurrentItem() + 1 < pager.getAdapter().getCount()) { 
         fragment = (CampaignPagerFragment) ((CampaignPagerAdapter) pager.getAdapter()).getRegisteredFragment(pager.getCurrentItem() + 1); 
         fragment.scaleImage(1 - RATIO_SCALE); 
        } 
       } 

      } 
      }); 

---

//PagerAdapter 

public class CampaignPagerAdapter extends FragmentStatePagerAdapter { 
    SparseArray<Fragment> registeredFragments = new SparseArray<Fragment>(); 

    public CampaignPagerAdapter(FragmentManager fm) { 
     super(fm); 
    } 

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

    @Override 
    public Fragment getItem(int position) { 
     return new CampaignPagerFragment(); 
    } 

    @Override 
    public Object instantiateItem(ViewGroup container, int position) { 
     Fragment fragment = (Fragment) super.instantiateItem(container, position); 
     registeredFragments.put(position, fragment); 
     return fragment; 
    } 

    @Override 
    public void destroyItem(ViewGroup container, int position, Object object) { 
     registeredFragments.remove(position); 
     super.destroyItem(container, position, object); 
    } 

    public Fragment getRegisteredFragment(int position) { 
     return registeredFragments.get(position); 
    } 
} 

für ex: https://github.com/mrleolink/SimpleInfiniteCarousel ..

Hallo, Eine Sache, die sampleFragment.scaleImage (Skala) fehlt; Es ist eine Methode in CampaignPagerFragment erstellt und das Fragment RootView skalieren ..

beispiels public void scaleImage(float scaleX) { rootView.setScaleY(scaleX); rootView.invalidate(); }

Answer 2

Sie können PagerTransformer zu ViewPager verwenden: -

mViewPager.setPageTransformer(false, new ViewPager.PageTransformer() { 
    @Override 
    public void transformPage(View page, float position) { 
      // do transformation here 
     } 
    }); 

Nutze diesen Link für eine vollständige Tutorial: -

http://andraskindler.com/blog/2013/create-viewpager-transitions-a-pagertransformer-example/

Hope this help you :)

Answer 3

viewPager.setPageMargin(100); 
viewPager.setPageTransformer(false, new ViewPager.PageTransformer() 
{ 
    @Override 
    public void transformPage(View page, float position) 
    { 
     int pageWidth = viewPager.getMeasuredWidth() - 
      viewPager.getPaddingLeft() - viewPager.getPaddingRight(); 
     int pageHeight = viewPager.getHeight(); 
     int paddingLeft = viewPager.getPaddingLeft(); 
     float transformPos = (float) (page.getLeft() - 
      (viewPager.getScrollX() + paddingLeft))/pageWidth; 
     int max = pageHeight/10; 
     if (transformPos < -1) 
     { 
      // [-Infinity,-1) 
      // This page is way off-screen to the left. 
      page.setAlpha(0.5f);// to make left transparent 
      page.setScaleY(0.7f); 
     } 
     else if (transformPos <= 1) 
     { 
      // [-1,1] 
      page.setScaleY(1f); 
     } 
     else 
     { 
      // (1,+Infinity] 
      // This page is way off-screen to the right. 
      page.setAlpha(0.5f);// to make right transparent 
      page.setScaleY(0.7f); 
     } 
    } 
}); 

Answer 4

ich dies tat mein viewpager der Polsterung Wechsel der Position basiert.

carouselViewHolder.carouselViewPager.setPadding(Utils.dpToPixels(context, 12), 0, Utils.dpToPixels(context, paddingRequired - 12), 0); // initial padding for position 0 
carouselViewHolder.carouselViewPager.setPageMargin(Utils.dpToPixels(context, 12)); // margin between pages 
carouselViewHolder.carouselViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() { 
    @Override 
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { 
    } 
    @Override 
    public void onPageSelected(int position) { 
     if (position != 0) { 
      if (position == playCardData.getPlayCards().size() - 1) { 
       carouselViewHolder.carouselViewPager.setPadding(Utils.dpToPixels(context, finalPaddingRequired - 12), 0, Utils.dpToPixels(context, 12), 0); 
      } else 
       carouselViewHolder.carouselViewPager.setPadding(Utils.dpToPixels(context, finalPaddingRequired/2), 0, Utils.dpToPixels(context, finalPaddingRequired/2), 0); 
     } else { 
      carouselViewHolder.carouselViewPager.setPadding(Utils.dpToPixels(context, 12), 0, Utils.dpToPixels(context, finalPaddingRequired - 12), 0); 
     } 
    } 
    @Override 
    public void onPageScrollStateChanged(int state) { 
    } 
});