【问题标题】:How to control viewPages pages from another page如何从另一个页面控制 viewPages 页面
【发布时间】:2014-09-20 07:46:32
【问题描述】:

我有一个ViewPager,有 3 页,每页都有listView。 我想为listView 设置动画,当用户水平滑动下一页时,listView 的项目应该根据下一页的宽度出现。

即第一个项目应该完全推入,第二个应该是可见的一半,口渴应该是第二个可见的一半等等。

这种类型的动画已经在mi3 xiamo的联系人列表中了。

在上图中,我向正确的方向滑动。注意“最近”列表项的可见性。

如果有人能帮我做这个动画,那将是一个很大的帮助。请根据ViewPager 中的页面更改分享一些关于ListView 动画的链接或提示。

【问题讨论】:

    标签: android animation android-fragments android-listview android-viewpager


    【解决方案1】:

    你有没有研究过用作 ViewPager 的滑动监听器的 OnPageChangeListener.onPageScrolled(int position, float positionOffset) 方法?你可以用 positionOffset 的值做一些事情,它是一个从 0 到 1 或反转的百分比值,告诉我们显示了即将到来的页面的多少 body,处理“Recent Call”列表项该值,在 getView() 方法中设置它们的left-axis。

    ----------------- 2014-10-03 更新 1 ------------------

    我一直在尝试完成这个效果,但我无法在这段时间内完成那个动画工作。我已经让 ListView 了解滑动偏移量(增量),并为他们的项目尽我所能,它看起来会关闭我们想要的效果。但非常复杂的部分是我们必须弄清楚如何兼容手指滑动或滑动以及直接通过方法切换。

    我尝试了三天来寻找 ViewPager 的规则,检查 ViewPager 和 ListView 的来源,但没有从正面返回。所以我将我的project 推送到 GitHub。

    ----------------- 2014-10-04 更新 2 ------------------

    以下 GIF 将准确解释动画。

    ----------------- 2014-10-07 更新 3 ------------------

    好吧,看来我无法完全再现这个动画。为了成为一个有价值的结局,我至少让我的项目工作,也尽我所能接近原来的效果。检查我的第一个更新的 GitHub 项目以完成整个工作..

    【讨论】:

    • 是的,我确实研究过 OnPageChangeListner 。但我不知道如何从那里处理下一页的视图。如果你能给我一些链接或一个例子,那将是一个很大的帮助.关于我如何从 OnPageScrolled 设置项目值。谢谢
    • 是的,很难将 positionOffset 的值同步到该 ListView,因为它位于 Fragment 中,很抱歉我不知道如何实现这一点。但是我之前做过增强ViewPager,你可以在“Indicator Test”sn-p 中弄清楚如何处理 positionOffset,只需下载我的示例 apk 然后检查它。
    • 尚不清楚您尝试制作的动画的确切行为(比该图像更好的解释会很好)。无论如何看看这段代码github.com/luksprog/DroidPlayground/blob/…(我从问题中理解的)。
    • @Luksprog 谢谢你的回复,我附上了一个 gif 来解释这个问题,请检查一下。 :-)
    【解决方案2】:

    您应该在滑动时使用PageTransformerViewPager 的每一页应用转换。 Android Developer Training 涵盖了基础知识。

    下面是一些以非常简单的方式实现您需要的代码:

    public class SwipeAnimationActivity extends Activity {
    
        private static final String[] COUNTRIES = new String[]{
                "Belgium", "France", "Italy", "Germany", "Spain",
                "Austria", "Russia", "Poland", "Croatia", "Greece",
                "Ukraine",
        };
    
        private ViewPager viewPager;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_swipe_animation);
            viewPager = (ViewPager) findViewById(R.id.view_pager);
            viewPager.setAdapter(createPagerAdapter());
            viewPager.setPageTransformer(false, createPageTransformer());
        }
    
        private FragmentPagerAdapter createPagerAdapter() {
            return new FragmentPagerAdapter(getFragmentManager()) {
                @Override
                public Fragment getItem(int position) {
                    ListFragment listFragment = new ListFragment();
                    listFragment.setListAdapter(createListAdapter());
                    return listFragment;
                }
    
                @Override
                public int getCount() {
                    return 3;
                }
            };
        }
    
        private ArrayAdapter<String> createListAdapter() {
            return new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, COUNTRIES);
        }
    
        private ViewPager.PageTransformer createPageTransformer() {
            return new ViewPager.PageTransformer() {
                @Override
                public void transformPage(View page, float position) {
                    ListView listView = (ListView) page.findViewById(android.R.id.list);
                    int childCount = listView.getChildCount();
                    float offset = .5f * listView.getWidth();
                    for (int i = 0; i < childCount; i++) {
                        View childView = listView.getChildAt(i);
                        childView.setTranslationX(i * offset * position);
                    }
                }
            };
        }
    
    }
    

    您可以轻松地调整 transformPage(View page, float position) 以达到您需要的效果(也许使用插值器来强制动画的某种缓动)。

    【讨论】:

    • 很高兴告诉我们有 PageTransformer 我们可以使用,我相信这是实现这个动画的关键点。根据原动画,它只发生在即将到来的页面上,无论方向如何改变,起始页面都没有感觉。我已经在 transformPage() 中进行了相当多的测试,但我无法弄清楚如何识别哪个页面是起始页面以及哪个页面是即将到来的页面,尤其是频繁更改滑动方向。请帮我解决这个问题,非常感谢。
    猜你喜欢
    • 1970-01-01
    • 2016-04-30
    • 1970-01-01
    • 2018-12-16
    • 1970-01-01
    • 2012-03-13
    • 2022-09-26
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多