WedX - журнал о программировании и компьютерных науках

Анимация в вертикальном ViewPager

Мне нужно сделать эту анимацию по вертикали ViewPager :

введите здесь описание изображения

https://www.youtube.com/watch?v=wuE-4jjnp3g

это то, что я пробовал до сих пор:

   viewPager = (VerticalViewPager) rootView.findViewById(R.id.viewpager);

   viewPager.setPageTransformer(false, new ViewPager.PageTransformer() {
        @Override
        public void transformPage(View page, float position) {

            if (position >= 0.5F && position <= 1F) {

                float progressStart = 0.5f;
                float progressEnd = 1f;
                float progressDelta = progressEnd - progressStart;

                float progress = (position - progressStart)/progressDelta;
                if(progress>1)progress=1;
                if(progress<0)progress=0;

                float endValue = 1f;
                float startValue = 0.8f;

                float delta = endValue - startValue;

                progress = 1-progress;
                float currentScale = startValue + delta*progress;

                ViewCompat.setPivotY(page,0);
                ViewCompat.setScaleX(page, currentScale);
                ViewCompat.setScaleY(page, 0.9F);
                ViewCompat.setTranslationY(page, 0);

            } else {
                ViewCompat.setScaleX(page, 1.0F); //- width
                ViewCompat.setScaleY(page, 0.9F); //- height
            }

        }
    });

это результат:

введите здесь описание изображения

https://www.youtube.com/watch?v=G9W2lCKP-_s

Я использую копию оригинального ViewPager с вертикальной ориентацией, чтобы увидеть код: https://github.com/Devlight/InfiniteCycleViewPager/blob/master/infinitecycleviewpager/src/main/java/com/gigamole/infinitecycleviewpager/VerticalViewPager.java

Очевидно, это даже не близко, мне нужно предварительно просмотреть следующую страницу и сделать две страницы ближе.

введите здесь описание изображения

Пожалуйста помоги

Спасибо.

android java animation android-viewpager android-pagetransformer
29.05.2017

  • что VerticalViewPager вы используете? 29.05.2017
  • привет, проверьте это здесь: github.com/Devlight/InfiniteCycleViewPager/blob/master/ это копия исходного ViewPager с вертикальной ориентацией 29.05.2017

Ответы:


1

мне нужен предварительный просмотр следующей страницы

вы должны добавить

        android:paddingBottom="200dp"
        android:clipToPadding="false"

к вашему макету <com.gigamole.infinitecycleviewpager.VerticalViewPagerin

в вашем коде Java поместите это, конечно, вы должны настроить startTranslation и startValue и paddingBottom в своем макете

        viewPager.setPageTransformer(true, new ViewPager.PageTransformer() {
        @Override
        public void transformPage(View page, float position) {
            ViewCompat.setPivotY(page,0);
            ViewCompat.setPivotX(page,page.getWidth()/2);
            float endTranslation = 0f;
            float startTranslation  = -400f;
            float deltaTranslation = endTranslation - startTranslation;

            float endScale = 1f;
            float startScale = 0.8f;
            float deltaScale = endScale - startScale;
            
            float progressStart = 0.5f;
            float progressEnd = 1f;
            float progressDelta = progressEnd - progressStart;

            float progress = (position - progressStart)/progressDelta;
            if(progress>1)progress=1;
            if(progress<0)progress=0;

            progress = 1-progress;
            
            float currentScale = startScale + deltaScale*progress;
            ViewCompat.setScaleX(page, currentScale);
            ViewCompat.setScaleY(page, currentScale);

            float currentTranslation = startTranslation + deltaTranslation*progress;
            ViewCompat.setTranslationY(page, currentTranslation);
        }
29.05.2017
  • это не похоже на желаемую анимацию, главная страница не выше следующей страницы 29.05.2017
  • о, вы ближе, следующая страница все еще не в порядке, пожалуйста, подождите, я загружу видео 29.05.2017
  • установить `viewPager.setOffscreenPageLimit (3); ` и настроить значения, как я сказал 29.05.2017
  • все еще нуждаются в некоторой настройке в моей части, спасибо. 29.05.2017
  • привет @RadekJ, после тестирования на Samsung с API 19 следующая страница не по центру и над главной страницей 30.05.2017
  • проверьте здесь :norel="low=" lh3.googleusercontent.com/-YVBU8iHvqC8/WS1sCu3ky1I/AAAAAAAAUp0/ 30.05.2017
  • обновил мой ответ, вы должны установить true, пока вы добавляете viewPager.setPageTransformer(true, new ViewPager.PageTransformer..., и добавить строку ViewCompat.setPivotX(page,page.getWidth()/2); в transformPage, и вы можете удалить эту строку ViewCompat.setTranslationZ(page, (currentTranslation));, поскольку она находится в обратном порядке, пока мы добавляем преобразователь страницы с истинным (reverseDrawingOrder) аргументом 30.05.2017
  • привет еще раз, не могли бы вы помочь мне с этим вопросом: stackoverflow.com/questions/45371207/ Спасибо. 30.07.2017
    • Новые материалы
    Как проанализировать работу вашего классификатора?
    Не всегда просто знать, какие показатели использовать С развитием глубокого обучения все больше и больше людей учатся обучать свой первый классификатор. Но как только вы закончите..
    Работа с цепями Маркова, часть 4 (Машинное обучение)
    Нелинейные цепи Маркова с агрегатором и их приложения (arXiv) Автор : Бар Лайт Аннотация: Изучаются свойства подкласса случайных процессов, называемых дискретными нелинейными цепями Маркова..
    Crazy Laravel Livewire упростил мне создание электронной коммерции (панель администратора и API) [Часть 3]
    Как вы сегодня, ребята? В этой части мы создадим CRUD для данных о продукте. Думаю, в этой части я не буду слишком много делиться теорией, но чаще буду делиться своим кодом. Потому что..
    Использование машинного обучения и Python для классификации 1000 сезонов новичков MLB Hitter
    Чему может научиться машина, глядя на сезоны новичков 1000 игроков MLB? Это то, что исследует это приложение. В этом процессе мы будем использовать неконтролируемое обучение, чтобы..
    Учебные заметки: создание моего первого пакета Node.js
    Это мои обучающие заметки, когда я научился создавать свой самый первый пакет Node.js, распространяемый через npm. Оглавление Глоссарий I. Новый пакет 1.1 советы по инициализации..
    Забудьте о Matplotlib: улучшите визуализацию данных с помощью умопомрачительных функций Seaborn!
    Примечание. Эта запись в блоге предполагает базовое знакомство с Python и концепциями анализа данных. Привет, энтузиасты данных! Добро пожаловать в мой блог, где я расскажу о невероятных..
    ИИ в аэрокосмической отрасли
    Каждый полет – это шаг вперед к великой мечте. Чтобы это происходило в их собственном темпе, необходима команда астронавтов для погони за космосом и команда технического обслуживания..
    Для любых предложений по сайту: [email protected]