ImageViews에서 ViewPager + 확대/축소를 사용하는 이미지 갤러리

구현하려는 대상은 무엇입니까?ImageViews에서 ViewPager + 확대/축소를 사용하는 이미지 갤러리

갤러리 개의 이미지가 ViewPager를 사용합니다. 이 옵션은 ImageView (ImageView 사용) 사이의 매끄러운 변환 때문에 매우 유용하고 구현하기가 쉽기 때문에이 옵션을 선택합니다.

정확히 어떤 문제가 있습니까?

나는 이것을 으로 구현할 수 있었지만 줌이 작동하지 않습니다. 나는에서 볼 수있다 LogCat 어떻게 인쇄되는 줌 (코드는 게시물의 끝에 있습니다)하지만 이미지가 확대되지 않습니다. 다음 코드에 대한 몇 가지주의 사항 : I 비동기 웹에서 이미지를 다운로드 할 수 UrlImageViewHelper을 사용하고

ImageViewHelperURL.setUrlDrawable((ImageView) img, url, R.drawable.no_image);.

api.getListUrls() 이미지 URL이있는 ArrayList입니다.

How to use Multi-touch in Android 2: Part 6, Implementing the Pinch Zoom Gesture : 나 이미지

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); 
     } 
    } 

}

을 R.drawable에서 이미지 뷰를 사용하는 대신에 다운로드도 해봤

은 이미 성공없이 다음과 같은 튜토리얼을 시도했습니다

출처

2012-02-01 Juan Ramón

이 질문에 늦습니다.하지만 갤러리 용 ViewPager를 사용하는 경우 - 모든 조각을 재활용하지 않을 것입니다. 맞습니까? 새로운 것들을 계속 만들었습니까? – user291701

나는 그들을 재활용하고 있다고 생각한다. 이전 활동으로 돌아 가면이 것이 파괴됩니까? 그러나 나는 이것에 초보자 일뿐입니다. 나는 잘 모르겠습니다. –

ImageView와 함께 Matrix를 사용하여 그는 이미지, scale type을 ScaleType.Matrix으로 변경해야합니다. 그렇지 않으면 아무 효과가 없습니다. 기본 축척 유형은 ScaleType.FIT_CENTER이므로 행렬을 무시합니다.

원래 작업과 관련하여이 작업을하게되면 ImageView의 터치 제스처가 ViewPager의 스크롤을 방해하게됩니다. 이 기능은 자연스러운 ViewPager 스 와이프 동작과 직접적으로 연결되어 다음보기로 이동하기 때문에 반드시 싱글 터치 드래그를 지원하는 데 문제가 있습니다.

출처

2012-02-09 22:19:08 antonyt

예, 당신은 간섭에 대해 옳습니다. 그러나 이제 이미지를 확대 할 수 있습니다 :) 이미지 갤러리를 구현하는 더 좋은 방법을 알고 계십니까? 물론 확대/축소를 지원합니다. –

나는 그것을 똑같은 방법으로했다. 간섭 때문에 ViewPager의 제스처를 사용하지 못하게했습니다. 저것은 중대한, 그러나 나가 이유없이 범위 오류에서 색인을 얻는보다는 좀더 작동 했는가? 하지만 이유는 내 Overridden ViewPager, 나는 거기에 버그가 v4 호환성 패키지에있는 것 같아요. 그러나 나는 똥을 무능하게하고 단지 줌을하는 방법 jat을 발견하지 못했습니다. 만약 내가 첫 번째 포인터를 내 애플 리케이션이 충돌 충돌 :( – Informatic0re

ImageViews에서 ViewPager + 확대/축소를 사용하는 이미지 갤러리

답변

관련 문제