7

przesuń palcem w górę i w dół efekt jak te aplikacje informacyjne inshorts, wędrówka prasowej, szmer.Android: animacja układ jak Inshorts News App

Cały układ płynnie w górę/w dół.
sprawdź aplikację pod tym linkiem inshorts i murmur.

Próbowałem ten kod ...

public class VerticalViewPager extends ViewPager { 
    public VerticalViewPager(Context context) { 
     super(context); 
     init(); 
    } 

    public VerticalViewPager(Context context, AttributeSet attrs) { 
     super(context, attrs); 
     init(); 
    } 
    private void init() { 
     // The majority of the magic happens here 
     setPageTransformer(true, new VerticalPageTransformer()); 
     // The easiest way to get rid of the overscroll drawing that happens on the left and right 
     setOverScrollMode(OVER_SCROLL_NEVER); 
    } 
    private class VerticalPageTransformer implements PageTransformer { 

     @SuppressLint("NewApi") 
     @Override 
     public void transformPage(View view, float position) { 

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

      } else if (position <= 1) { // [-1,1] 
       view.setAlpha(1); 

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

       //set Y position to swipe in from top 
       float yPosition = position * view.getHeight(); 
       view.setTranslationY(yPosition); 

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

    /** 
    * Swaps the X and Y coordinates of your touch event. 
    */ 
    private MotionEvent swapXY(MotionEvent ev) { 
     float width = getWidth(); 
     float height = getHeight(); 

     float newX = (ev.getY()/height) * width; 
     float newY = (ev.getX()/width) * height; 

     ev.setLocation(newX, newY); 

     return ev; 
    } 

    @Override 
    public boolean onInterceptTouchEvent(MotionEvent ev){ 
     boolean intercepted = super.onInterceptTouchEvent(swapXY(ev)); 
     swapXY(ev); // return touch coordinates to original reference frame for any child views 
     return intercepted; 
    } 

    @Override 
    public boolean onTouchEvent(MotionEvent ev) { 
     return super.onTouchEvent(swapXY(ev)); 
    } 

} 

W MainActivity.java

VerticalViewPager Pager2; 
PagerAdapter adapter; 
String[] articleTitle; 
String[] articleName; 
String[] articleDiscription; 

OnCreate() 

Pager2=(VerticalViewPager)findViewById(R.id.pager); 


// Pass results to ViewPagerAdapter Class 
adapter = new ViewPagerAdapter(getActivity(), articleTitle, articleName,  articleDiscription, btnBack,articleImage); 

// Binds the Adapter to the ViewPager 
Pager2.setAdapter(adapter); 

activity_main.xml

<com.example.flipnews.VerticalViewPager 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:id="@+id/pager" 
    /> 

w moim kodu prostym cięciem góra-dół odbywa się, podobnie jak to link. , ale chcę stworzyć lepszy efekt animacji jak wyżej wymienione aplikacje. lub telefon wbudowany efekt galerii zdjęć.

Z góry dziękuję.

+0

Witaj, Viveka ... nie możemy ci pomóc w rozwoju ... możemy tylko pomóc Ci w rozwiązaniu problemów z tą implementacją. Musisz spróbować sam i opublikować swój kod z problemami później. –

+1

@Viveka, jeśli znalazłeś jakieś lib dla tej animacji, daj mi znać. – Dev

+1

Już próbuję tego kodu, ale nie otrzymałem prawidłowego wyniku. Sprawdź mój kod. - @MarianoZorrilla –

Odpowiedz

13

Znalazłem rozwiązanie po wielu badaniach, mam nadzieję, że będzie pomocne dla innych.

Wskazówka: ustaw kolor tła ekranu pagera dla lepszego efektu machnięcia.

private static class VerticalPageTransformer implements PageTransformer { 
     private static float MIN_SCALE = 0.75f; 

     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(1); 
       view.setScaleX(1); 
       view.setScaleY(1); 
       float yPosition = position * view.getHeight(); 
       view.setTranslationY(yPosition); 
       view.setTranslationX(-1 * view.getWidth() * position); 

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

       view.setTranslationX(-1 * view.getWidth() * 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); 
      } 

     } 
    } 

    private MotionEvent swapXY(MotionEvent ev) { 
     float width = getWidth(); 
     float height = getHeight(); 

     float newX = (ev.getY()/height) * width; 
     float newY = (ev.getX()/width) * height; 

     ev.setLocation(newX, newY); 

     return ev; 
    } 

    @Override 
    public boolean onInterceptTouchEvent(MotionEvent ev){ 
     boolean intercepted = super.onInterceptTouchEvent(swapXY(ev)); 
     swapXY(ev); // return touch coordinates to original reference frame for any child views 
     return intercepted; 
    } 

    @Override 
    public boolean onTouchEvent(MotionEvent ev) { 
     return super.onTouchEvent(swapXY(ev)); 
    } 

} 
+0

Praca Świetnie, uratowałeś mój dzień !!!!! – user3069590

+0

@Viveka Mam problem, mój widok pager ma widok siatki wewnątrz niego. podczas przesuwania w siatce funkcja przesunięcia nie działa – Praneeth

+0

Cześć, spróbowałem twojej odpowiedzi i działa świetnie. Jestem początkującym w tym. Czy możesz podać mi krótki opis tego, co dokładnie tutaj robisz, na przykład 'view.setTranslationX (-1 * view.getWidth() * position);' this? – Vishnu