GridView缩放图像

时间:2013-06-07 16:27:30

标签: android gridview

我有一个gridview,我正在尝试在GridView Item Click上缩放图像。使用来自Google http://developer.android.com/training/animation/zoom.html的此示例。我的问题是如何将R.drawable传递给“int imageResId”。查看下面的代码。

MainActivity.java

public class GridViewActivity extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setTitle("GridView");
        setContentView(R.layout.grid_view);


       GridView gridview = (GridView) findViewById(R.id.gridview);
        gridview.setAdapter(new ImageAdapter(this));

    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.activity_grid_view, menu);
        return true;
    }
}

gridview.xml

<GridView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/gridview"
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"
    android:columnWidth="90dp"
    android:numColumns="auto_fit"
    android:verticalSpacing="10dp"
    android:horizontalSpacing="10dp"
    android:stretchMode="columnWidth"
    android:gravity="center"
/>

ImageAdapter.java

 public class ImageAdapter extends BaseAdapter {

    private Animator mCurrentAnimator;

    private int mShortAnimationDuration;

    private Context mContext;

    public ImageAdapter(Context c) {
        mContext = c;
    }

    public int getCount() {
        return mThumbIds.length;
    }

    public Object getItem(int position) {
        return mThumbIds[position];
    }

    public long getItemId(int position) {
        return 0;
    }

    public View getView(final int position, View convertView, ViewGroup parent) {
        ImageView imageView;
        if (convertView == null) {
            imageView = new ImageView(mContext);
            imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
        } else {
            imageView = (ImageView) convertView;
        }

        imageView.setImageResource(mThumbIds[position]);
        imageView.setTag(mThumbIds[position]);
        imageView.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View arg0) {
                int id = (Integer) arg0.getTag();
                zoomImageFromThumb(arg0, id);
            }
        });
        return imageView;
    }

    // References to our images in res > drawable
    public Integer[] mThumbIds = { R.drawable.sample_0, R.drawable.sample_1,
            R.drawable.sample_2, R.drawable.sample_3, R.drawable.sample_4,
            R.drawable.sample_5, R.drawable.sample_6, R.drawable.sample_7,
            R.drawable.sample_8, R.drawable.sample_9, R.drawable.sample_10,
            R.drawable.sample_11, R.drawable.sample_12, R.drawable.sample_13,
            R.drawable.sample_14, R.drawable.sample_15, R.drawable.sample_16,
            R.drawable.sample_17, R.drawable.sample_18 };

    private void zoomImageFromThumb(final View thumbView, int imageResId) {

        if (mCurrentAnimator != null) {
            mCurrentAnimator.cancel();
        }

        final ImageView expandedImageView = (ImageView) thumbView.findViewById(R.id.expanded_image);
        expandedImageView.setImageResource(imageResId);

        final Rect startBounds = new Rect();
        final Rect finalBounds = new Rect();
        final Point globalOffset = new Point();

        thumbView.getGlobalVisibleRect(startBounds);
        thumbView.findViewById(R.id.container).getGlobalVisibleRect(finalBounds, globalOffset);
        startBounds.offset(-globalOffset.x, -globalOffset.y);
        finalBounds.offset(-globalOffset.x, -globalOffset.y);

        float startScale;
        if ((float) finalBounds.width() / finalBounds.height() > (float) startBounds
                .width() / startBounds.height()) {
            // Extend start bounds horizontally
            startScale = (float) startBounds.height() / finalBounds.height();
            float startWidth = startScale * finalBounds.width();
            float deltaWidth = (startWidth - startBounds.width()) / 2;
            startBounds.left -= deltaWidth;
            startBounds.right += deltaWidth;
        } else {
            // Extend start bounds vertically
            startScale = (float) startBounds.width() / finalBounds.width();
            float startHeight = startScale * finalBounds.height();
            float deltaHeight = (startHeight - startBounds.height()) / 2;
            startBounds.top -= deltaHeight;
            startBounds.bottom += deltaHeight;
        }

        thumbView.setAlpha(0f);
        expandedImageView.setVisibility(View.VISIBLE);

        expandedImageView.setPivotX(0f);
        expandedImageView.setPivotY(0f);

        AnimatorSet set = new AnimatorSet();
        set.play(
                ObjectAnimator.ofFloat(expandedImageView, View.X,
                        startBounds.left, finalBounds.left))
                .with(ObjectAnimator.ofFloat(expandedImageView, View.Y,
                        startBounds.top, finalBounds.top))
                .with(ObjectAnimator.ofFloat(expandedImageView, View.SCALE_X,
                        startScale, 1f))
                .with(ObjectAnimator.ofFloat(expandedImageView, View.SCALE_Y,
                        startScale, 1f));
        set.setDuration(mShortAnimationDuration);
        set.setInterpolator(new DecelerateInterpolator());
        set.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                mCurrentAnimator = null;
            }

            @Override
            public void onAnimationCancel(Animator animation) {
                mCurrentAnimator = null;
            }
        });
        set.start();
        mCurrentAnimator = set;

        final float startScaleFinal = startScale;
        expandedImageView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                if (mCurrentAnimator != null) {
                    mCurrentAnimator.cancel();
                }

                AnimatorSet set = new AnimatorSet();
                set.play(
                        ObjectAnimator.ofFloat(expandedImageView, View.X,
                                startBounds.left))
                        .with(ObjectAnimator.ofFloat(expandedImageView, View.Y,
                                startBounds.top))
                        .with(ObjectAnimator.ofFloat(expandedImageView,
                                View.SCALE_X, startScaleFinal))
                        .with(ObjectAnimator.ofFloat(expandedImageView,
                                View.SCALE_Y, startScaleFinal));
                set.setDuration(mShortAnimationDuration);
                set.setInterpolator(new DecelerateInterpolator());
                set.addListener(new AnimatorListenerAdapter() {
                    @Override
                    public void onAnimationEnd(Animator animation) {
                        thumbView.setAlpha(1f);
                        expandedImageView.setVisibility(View.GONE);
                        mCurrentAnimator = null;
                    }

                    @Override
                    public void onAnimationCancel(Animator animation) {
                        thumbView.setAlpha(1f);
                        expandedImageView.setVisibility(View.GONE);
                        mCurrentAnimator = null;
                    }
                });
                set.start();
                mCurrentAnimator = set;
            }
        });
    }
}

activity_zoom.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <ImageView
        android:id="@+id/expanded_image"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="invisible" />

</FrameLayout>

LOGCAT:

  06-14 13:58:47.667: E/AndroidRuntime(14860): FATAL EXCEPTION: main
06-14 13:58:47.667: E/AndroidRuntime(14860): java.lang.NullPointerException
06-14 13:58:47.667: E/AndroidRuntime(14860):    at com.example.gridview.ImageAdapter.zoomImageFromThumb(ImageAdapter.java:79)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at com.example.gridview.ImageAdapter.access$0(ImageAdapter.java:72)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at com.example.gridview.ImageAdapter$1.onClick(ImageAdapter.java:57)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at android.view.View.performClick(View.java:3620)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at android.view.View$PerformClick.run(View.java:14292)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at android.os.Handler.handleCallback(Handler.java:605)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at android.os.Handler.dispatchMessage(Handler.java:92)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at android.os.Looper.loop(Looper.java:137)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at android.app.ActivityThread.main(ActivityThread.java:4507)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at java.lang.reflect.Method.invokeNative(Native Method)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at java.lang.reflect.Method.invoke(Method.java:511)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:980)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:747)
06-14 13:58:47.667: E/AndroidRuntime(14860):    at dalvik.system.NativeStart.main(Native Method)

4 个答案:

答案 0 :(得分:2)

在示例中尝试此操作,您在单击的视图中找到了展开的视图

final ImageView expandedImageView = (ImageView) findViewById(R.id.expanded_image);
        expandedImageView.setImageResource(imageResId);
zoomImageFromThumb(final View thumbView, int imageResId)

中的

或者您可能需要在主片段视图中找到该视图,如

final ImageView expandedImageView = (ImageView) mainView.findViewById(R.id.expanded_image);
            expandedImageView.setImageResource(imageResId);

不在thumbView

编辑:

按如下方式更改gridview.xml,将两个视图放在同一布局中

<GridView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/gridview"
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"
    android:columnWidth="90dp"
    android:numColumns="auto_fit"
    android:verticalSpacing="10dp"
    android:horizontalSpacing="10dp"
    android:stretchMode="columnWidth"
    android:gravity="center"
/>

<ImageView
        android:id="@+id/expanded_image"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="invisible" />

您可以为两者使用相对布局包装,以便与其他

重叠

并使用

final ImageView expandedImageView = (ImageView) findViewById(R.id.expanded_image);
            expandedImageView.setImageResource(imageResId);
zoomImageFromThumb(final View thumbView, int imageResId)

中的

如果您没有找到符号findViewById()错误,请添加

public static Activity getActivity(){ return this; }

中的

GridViewActivity.java

然后使用

final ImageView expandedImageView = (ImageView) GridViewActivity.getActivity().findViewById(R.id.expanded_image);
                expandedImageView.setImageResource(imageResId);
zoomImageFromThumb(final View thumbView, int imageResId)

中的

答案 1 :(得分:0)

该方法请求资源ID(int),R.drawable.whatever是一个int,一个指向内存方向的指针(映射在R文件中) 也不要为网格定义单击侦听器,而是为适配器内的每个单项定义它。

答案 2 :(得分:0)

如果我理解你的问题,你想把“id”传递给你的函数。 您可以为ImageView设置标记,然后在onClick方法上加载此标记:

imageView.setTag(mThumbIds[position]);

...

imageView.setOnClickListener(new OnClickListener() {
    @Override
    public void onClick(View arg0) {
        ImageView img = (ImageView) arg0;
        int id = (Integer) img.getTag();
        zoomImageFromThumb(arg0, id);
    }
});
return imageView;

您怎么看?

答案 3 :(得分:0)

尝试以这种方式 setTag

imageView.setImageResource(mThumbIds[position]);
imageView.setTag(mThumbIds[position]);

然后继续前进。

imageView.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View arg0) {
                int id = (Integer)arg0.getTag();
                zoomImageFromThumb(arg0, id);
            }

尝试使用此代码,看看会发生什么?