Android ViewPager.PagerTransformer Cube动画奇怪的行为

时间:2017-10-06 11:01:29

标签: java android animation android-viewpager

我正在尝试在viewPager上实现一个立方体动画。动画在模拟器和三星S8设备上看起来不错,但在华为P10 Android 7.0上,它看起来如下图所示:

enter image description here

我不明白为什么我的华为设备会裁剪图像。以下是我的代码:

activity_main.xml中

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="ro.helpproject.funcode.help.MainActivity">


    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</LinearLayout>

view_pager_item.xml

<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/imageView_mario"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:background="@android:color/black"
    android:src="@drawable/mario" />

CubeTransformer.java类

package ro.helpproject.funcode.help;

import android.support.v4.view.ViewPager;
import android.view.View;


public class CubeTransformer implements ViewPager.PageTransformer {
    @Override
    public void transformPage(View view, float position) {
        view.setPivotX(position <= 0 ? view.getWidth(): 0.0f);
        view.setRotationY(90f * position);
    }
}

MainActivity.java

package ro.helpproject.funcode.help;

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

public class MainActivity extends Activity {

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

        MyViewPagerAdapter adapter = new MyViewPagerAdapter();
        ViewPager pager = findViewById(R.id.pager);
        pager.setPageTransformer(true, new CubeTransformer());
        pager.setAdapter(adapter);
    }

    protected class MyViewPagerAdapter extends PagerAdapter {

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

        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;
        }

        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            LayoutInflater inflater = LayoutInflater.from(MainActivity.this);
            ImageView imageView = (ImageView) inflater.inflate(R.layout.view_pager_item, container, false);

            container.addView(imageView);
            return imageView;
        }

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView((View) object);
        }
    }
}

如果有人知道如何解决这个问题,我将非常感激。

提前谢谢!

2 个答案:

答案 0 :(得分:0)

imageview.setAdjustViewBounds(true); 
imageview.setFitToScreen(true);
imageview.setScaleType(ScaleType.FIT_XY);

更新.....

 <?xml version="1.0" encoding="utf-8"?>
    <ImageView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/imageView_mario"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:layout_gravity="center"
        android:scaleType="fitXY"
        android:background="@android:color/black"
        android:src="@drawable/mario" />

答案 1 :(得分:0)

实现此目的的最佳方法是在imageView中添加父级,如下所示:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:gravity="center">

    <ImageView
        android:id="@+id/imageView_mario"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@android:color/black"
        android:src="@drawable/mario" />

</LinearLayout>

然后在instantiateItem中用LinearLayout替换imageView:

@Override
    public Object instantiateItem(ViewGroup container, int position) {
        LayoutInflater inflater = LayoutInflater.from(MainActivity.this);
        LinearLayout linearLayout = (LinearLayout) inflater.inflate(R.layout.view_pager_item, container, false);
        container.addView(linearLayout);
        return linearLayout;
    }

这应该可以正常工作。

您的解决方案不起作用的原因是viewpager试图填写它的页面&#34;使用您从xml提供的imageview,因此它被拉伸并具有意外行为。