使用ViewPager+放大ImageViews的图像库

Question

我试图实现什么

使用ViewPager的图像库。我选择这个选项是因为图像之间的平滑过渡（我使用的是ImageView），它很好而且很容易实现。

我的问题到底是什么

我已经能够实现所有这些，但缩放不起作用。我可以在LogCat中看到它是如何打印的ZOOM（代码在帖子的末尾），但图像没有放大。关于以下代码的几点注意事项：

• ImageViewHelperURL.setUrlDrawable((ImageView) img, url, R.drawable.no_image);我正在使用UrlImageViewHelper从web异步下载图像
• api.getListUrls()这是一个ArrayList，我在其中有图像URL

• 我也尝试过使用R.drawable的ImageView，而不是下载图像

  import android.content.Context;
  import android.content.Intent;
  import android.graphics.Matrix;
  import android.graphics.PointF;
  import android.os.Bundle;
  import android.support.v4.app.ActionBar;
  import android.support.v4.app.Fragment;
  import android.support.v4.app.FragmentActivity;
  import android.support.v4.app.FragmentManager;
  import android.support.v4.app.FragmentPagerAdapter;
  import android.support.v4.view.Menu;
  import android.support.v4.view.MenuItem;
  import android.support.v4.view.ViewPager;
  import android.util.FloatMath;
  import android.util.Log;
  import android.view.LayoutInflater;
  import android.view.MenuInflater;
  import android.view.MotionEvent;
  import android.view.View;
  import android.view.View.OnTouchListener;
  import android.view.ViewGroup;
  import android.view.ViewGroup.LayoutParams;
  import android.widget.Gallery;
  import android.widget.ImageView;
  import android.widget.Toast;
  public class Slide extends FragmentActivity {
      private ViewPager mPager;
      public static Api api;
      public static int POSITION;
      public static ActionBar topbar;
      public static Context ctx;
      @Override
      public void onCreate(Bundle savedInstanceState) {
          super.onCreate(savedInstanceState);
          setContentView(R.layout.fragment);
          ctx = Slide.this;
          POSITION = 0;
          topbar = getSupportActionBar();
          /* get portadas */
          api = new Api();
          api.getUrlsFromAPI();
          topbar.setDisplayShowHomeEnabled(false);
          topbar.setDisplayShowTitleEnabled(true);
          mPager = (ViewPager) findViewById(R.id.pager);
          mPager.setAdapter(new TestAdapter(getSupportFragmentManager()));
      }
      @Override
      protected void onResume() {
          // TODO Auto-generated method stub
          super.onResume();
          mPager.setCurrentItem(POSITION);
      }
      static final class TestAdapter extends FragmentPagerAdapter {
          public TestAdapter(FragmentManager fm) {
              super(fm);
          }
          @Override
          public int getCount() {
              return api.getListUrls().size();
          }
          @Override
          public Fragment getItem(int position) {
              TestFragment f = new TestFragment();
              f.url = api.getListUrls().get(position).getUrl();
              f.position = position;
              return f;
          }
      }
      public static class TestFragment extends Fragment {
          String url = "";
          Integer position = 0;
          public TestFragment() {
              setRetainInstance(true);
          }
          @Override
          public void onCreate(Bundle savedInstanceState) {
              super.onCreate(savedInstanceState);
              setHasOptionsMenu(true);
          }
          @Override
          public View onCreateView(LayoutInflater inflater, ViewGroup container,
                  Bundle savedInstanceState) {
              ImageView img = new ImageView(getActivity());
              img.setPadding(6, 6, 6, 6) ;
              img.setLayoutParams(new Gallery.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT)) ;
              ImageViewHelperURL.setUrlDrawable((ImageView) img, url, R.drawable.no_image) ;
              img.setOnTouchListener(new OnTouchListener() {
                  private static final String TAG = "SlideImageView";
                  // These matrices will be used to move and zoom image
                  Matrix matrix = new Matrix();
                  Matrix savedMatrix = new Matrix();
                  // We can be in one of these 3 states
                  static final int NONE = 0;
                  static final int DRAG = 1;
                  static final int ZOOM = 2;
                  int mode = NONE;
                  // Remember some things for zooming
                  PointF start = new PointF();
                  PointF mid = new PointF();
                  float oldDist = 1f;
                  @Override
                  public boolean onTouch(View v, MotionEvent event) {
                      ImageView view = (ImageView) v;
                      // Dump touch event to log
                      dumpEvent(event);
                      // Handle touch events here...
                      switch (event.getAction() & MotionEvent.ACTION_MASK) {
                      case MotionEvent.ACTION_DOWN:
                          savedMatrix.set(matrix);
                          start.set(event.getX(), event.getY());
                          Log.d(TAG, "mode=DRAG");
                          mode = DRAG;
                          break;
                      case MotionEvent.ACTION_POINTER_DOWN:
                          oldDist = spacing(event);
                          Log.d(TAG, "oldDist=" + oldDist);
                          if (oldDist > 10f) {
                              savedMatrix.set(matrix);
                              midPoint(mid, event);
                              mode = ZOOM;
                              Log.d(TAG, "mode=ZOOM");
                          }
                          break;
                      case MotionEvent.ACTION_UP:
                      case MotionEvent.ACTION_POINTER_UP:
                          mode = NONE;
                          Log.d(TAG, "mode=NONE");
                          break;
                      case MotionEvent.ACTION_MOVE:
                          if (mode == DRAG) {
                              // ...
                              matrix.set(savedMatrix);
                              matrix.postTranslate(event.getX() - start.x,
                                      event.getY() - start.y);
                          } else if (mode == ZOOM) {
                              float newDist = spacing(event);
                              Log.d(TAG, "newDist=" + newDist);
                              if (newDist > 10f) {
                                  matrix.set(savedMatrix);
                                  float scale = newDist / oldDist;
                                  Log.d(TAG, "ZOOOOOOOM: " + scale);
                                  matrix.postScale(scale, scale, mid.x, mid.y);
                              }
                          }
                          break;
                      }
                      view.setImageMatrix(matrix);
                      return true; // indicate event was handled
                  }
                  /** Show an event in the LogCat view, for debugging */
                  private void dumpEvent(MotionEvent event) {
                      String names[] = { "DOWN", "UP", "MOVE", "CANCEL",
                              "OUTSIDE", "POINTER_DOWN", "POINTER_UP", "7?",
                              "8?", "9?" };
                      StringBuilder sb = new StringBuilder();
                      int action = event.getAction();
                      int actionCode = action & MotionEvent.ACTION_MASK;
                      sb.append("event ACTION_").append(names[actionCode]);
                      if (actionCode == MotionEvent.ACTION_POINTER_DOWN
                              || actionCode == MotionEvent.ACTION_POINTER_UP) {
                          sb.append("(pid ").append(
                                  action >> MotionEvent.ACTION_POINTER_ID_SHIFT);
                          sb.append(")");
                      }
                      sb.append("[");
                      for (int i = 0; i < event.getPointerCount(); i++) {
                          sb.append("#").append(i);
                          sb.append("(pid ").append(event.getPointerId(i));
                          sb.append(")=").append((int) event.getX(i));
                          sb.append(",").append((int) event.getY(i));
                          if (i + 1 < event.getPointerCount())
                              sb.append(";");
                      }
                      sb.append("]");
                      Log.d(TAG, sb.toString());
                  }
                  /** Determine the space between the first two fingers */
                  private float spacing(MotionEvent event) {
                      float x = event.getX(0) - event.getX(1);
                      float y = event.getY(0) - event.getY(1);
                      return FloatMath.sqrt(x * x + y * y);
                  }
                  /** Calculate the mid point of the first two fingers */
                  private void midPoint(PointF point, MotionEvent event) {
                      float x = event.getX(0) + event.getX(1);
                      float y = event.getY(0) + event.getY(1);
                      point.set(x / 2, y / 2);
                  }
              });
              return img;
          }
          @Override
          public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {
          }
          @Override
          public boolean onOptionsItemSelected(MenuItem item) {
              return super.onOptionsItemSelected(item);
          }
      }
  }
  

我已经尝试了以下教程，但没有成功：

• 如何在Android中使用多点触摸2：第6部分，实现缩放手势

Answer 1

如果要使用带有ImageView的矩阵来变换图像，则需要将比例类型更改为ScaleType.Matrix，否则将不会有任何效果。默认比例类型为ScaleType.FIT_CENTER，因此它将忽略矩阵。

关于你最初的任务，如果你完成了这项工作，你可能会发现ImageView上的触摸手势会干扰ViewPager的滚动。你肯定会遇到支持单点触摸拖动的问题，因为这直接对应于ViewPager滑动到下一个视图的自然动作。