Thư viện Android zoom in/out

Question

Xin chào, tôi đang sử dụng tiện ích Thư viện để hiển thị hình ảnh được tải xuống từ internet.

để hiển thị một số hình ảnh và tôi muốn có thu phóng dần dần trong khi mọi người trượt lên và xuống trên màn hình. Tôi biết làm thế nào để thực hiện các sự kiện liên lạc điều duy nhất tôi không biết làm thế nào để làm cho toàn bộ xem gallery phát triển dần dần. Tôi không muốn phóng to một hình ảnh Tôi muốn toàn bộ thư viện thu phóng dần dần.

EDIT3: Tôi quản lý để thu phóng phần hiển thị của bộ sưu tập nhưng vấn đề là tôi cần tìm cách để thư viện tìm hiểu về nó và cập nhật cho các trẻ khác.

Điều gì sẽ xảy ra nếu 3 hình ảnh hiển thị sau đó bạn bắt đầu phóng to và thư viện sẽ thu nhỏ hơn, do đó, làm hình ảnh nhưng những gì Tôi muốn trong trường hợp này là nhiều hình ảnh hơn để hiển thị nhưng tôi không biết để đạt được hiệu ứng mong muốn này. Đây là toàn bộ mã:

public class Gallery1 extends Activity implements OnTouchListener { 

private static final String TAG = "GalleryTest"; 
private float zoom=0.0f; 
// Remember some things for zooming 
PointF start = new PointF(); 
PointF mid = new PointF(); 
Gallery g; 
LinearLayout layout2; 
private ImageAdapter ad; 

@Override 
public void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.gallery_1); 
    layout2=(LinearLayout) findViewById(R.id.layout2); 

    // Reference the Gallery view 
    g = (Gallery) findViewById(R.id.gallery); 
    // Set the adapter to our custom adapter (below) 
    ad=new ImageAdapter(this); 
    g.setAdapter(ad); 


    layout2.setOnTouchListener(this); 

} 


public void zoomList(boolean increase) { 
    Log.i(TAG, "startig animation"); 


    AnimatorSet set = new AnimatorSet(); 
    set.playTogether(

     ObjectAnimator.ofFloat(g, "scaleX", zoom), 
     ObjectAnimator.ofFloat(g, "scaleY", zoom) 

    ); 
    set.addListener(new AnimatorListener() { 

     @Override 
     public void onAnimationStart(Animator animation) { 


     } 

     @Override 
     public void onAnimationRepeat(Animator animation) { 
      // TODO Auto-generated method stub 

     } 

     @Override 
     public void onAnimationEnd(Animator animation) { 

     } 

     @Override 
     public void onAnimationCancel(Animator animation) { 
      // TODO Auto-generated method stub 

     } 
    }); 
    set.setDuration(100).start(); 


} 


public class ImageAdapter extends BaseAdapter { 
    private static final int ITEM_WIDTH = 136; 
    private static final int ITEM_HEIGHT = 88; 

    private final int mGalleryItemBackground; 
    private final Context mContext; 

    private final Integer[] mImageIds = { 
      R.drawable.gallery_photo_1, 
      R.drawable.gallery_photo_2, 
      R.drawable.gallery_photo_3, 
      R.drawable.gallery_photo_4, 
      R.drawable.gallery_photo_5, 
      R.drawable.gallery_photo_6, 
      R.drawable.gallery_photo_7, 
      R.drawable.gallery_photo_8 
    }; 

    private final float mDensity; 

    public ImageAdapter(Context c) { 
     mContext = c; 
     // See res/values/attrs.xml for the <declare-styleable> that defines 
     // Gallery1. 
     TypedArray a = obtainStyledAttributes(R.styleable.Gallery1); 
     mGalleryItemBackground = a.getResourceId(
       R.styleable.Gallery1_android_galleryItemBackground, 1); 
     a.recycle(); 

     mDensity = c.getResources().getDisplayMetrics().density; 
    } 

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

    public Object getItem(int position) { 
     return position; 
    } 

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

    public View getView(int position, View convertView, ViewGroup parent) { 
     ImageView imageView; 
     if (convertView == null) { 
      convertView = new ImageView(mContext); 

      imageView = (ImageView) convertView; 
      imageView.setScaleType(ImageView.ScaleType.FIT_XY); 
      imageView.setLayoutParams(new Gallery.LayoutParams(
        (int) (ITEM_WIDTH * mDensity + 0.5f), 
        (int) (ITEM_HEIGHT * mDensity + 0.5f))); 

     } else { 
      imageView = (ImageView) convertView; 
     } 

     imageView.setImageResource(mImageIds[position]); 

     return imageView; 
    } 
} 

public boolean onTouch(View v, MotionEvent event) { 

    if (event.getAction() == MotionEvent.ACTION_MOVE 
      && event.getPointerCount() > 1) { 
     midPoint(mid, event); 

     if(mid.y > start.y){ 

      Log.i(TAG, "Going down (Math.abs(mid.y - start.y)= "+(Math.abs(mid.y - start.y))+" and zoom="+zoom); // going down so increase 
      if ((Math.abs(mid.y - start.y) > 10) && (zoom<2.5f)){ 

       zoom=zoom+0.1f; 
       midPoint(start, event); 
       zoomList(true); 


      } 
      return true; 
     }else if(mid.y < start.y){ 

      Log.i(TAG, "Going up (Math.abs(mid.y - start.y)= "+(Math.abs(mid.y - start.y))+" and zoom="+zoom); //smaller 
      if ((Math.abs(mid.y - start.y) > 10) &&(zoom>0.1)){ 

       midPoint(start, event); 
       zoom=zoom-0.1f; 
       zoomList(false); 

      } 
      return true; 
     } 

    } 

    else if (event.getAction() == MotionEvent.ACTION_POINTER_DOWN) { 
     Log.e(TAG, "Pointer went down: " + event.getPointerCount()); 
     return true; 
    } 
    else if (event.getAction() == MotionEvent.ACTION_UP) { 
     Log.i(TAG, "Pointer going up"); 
     return true; 
    } 
    else if (event.getAction() == MotionEvent.ACTION_DOWN) { 
     Log.i(TAG, "Pointer going down"); 
     start.set(event.getX(), event.getY()); 
     return true; 
    } 

    return false; 
     // indicate event was handled or not 
    } 

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

Tôi nhận thấy rằng tôi có thể sẽ mở rộng Thư viện hoặc thậm chí một nhóm Chế độ xem khác hoặc tạo lớp học của riêng tôi. ...

EDIT4: Tôi không biết liệu câu hỏi của anh ấy có đủ rõ ràng không. Dưới đây là một ví dụ về trạng thái:

Nhà nước một: trạng thái ban đầu, chúng tôi có 3 hình ảnh theo quan điểm

Nhà nước 2: chúng tôi phát hiện chạm thẳng đứng đi lên với 2 ngón tay = chúng ta phải thu nhỏ

nhà nước 3: chúng tôi bắt đầu phóng to = hoạt hình trên thư viện hoặc trên trẻ em ???

trạng thái 4: phòng trưng bày phát hiện rằng đó là 3 đứa con nhỏ

nhà nước 5: bộ sưu tập thêm 1/nhiều trẻ em theo không gian có sẵn mới

Cập nhật lần cuối: Nhờ tất cả những gì đã đăng tải nhưng tôi có cuối cùng đạt đến một kết luận và đó là không sử dụng Phòng triển lãm ở tất cả: 1. Nó bị phản đối 2. Nó không đủ tùy chỉnh cho trường hợp của tôi

Nếu bạn muốn để animate nhiều hình ảnh cùng một lúc bạn có thể muốn xem xét sử dụng OpenGL , Tôi đang dùng libgdx thư viện: https://github.com/libgdx/libgdx

Answer 1

sau đây ScalingGallery triển khai có thể giúp ích.
Lớp con thư viện này ghi đè phương thức getChildStaticTransformation (Xem trẻ em, Chuyển đổi t) trong đó việc chia tỷ lệ được thực hiện.Bạn có thể tùy chỉnh thêm các thông số mở rộng để phù hợp với nhu cầu của riêng bạn.

Xin lưu ý rằng ScalingGalleryItemLayout.java lớp học. Điều này là cần thiết vì sau khi bạn đã thực hiện toán tử mở rộng trên các khung nhìn con, các hộp nhấn của chúng không còn hợp lệ để chúng phải được cập nhật từ phương thức getChildStaticTransformation (Xem con, Chuyển đổi t).

Điều này được thực hiện bằng cách gói từng mục trong thư viện trong một số ScalingGalleryItemLayout mở rộng LinearLayout. Một lần nữa, bạn có thể tùy chỉnh tùy chọn này để phù hợp với nhu cầu của riêng mình nếu LinearLayout không đáp ứng nhu cầu của bạn để bố cục các mục trong thư viện của bạn.

File: /src/com/example/ScalingGallery.java

/** 
* A Customized Gallery component which alters the size and position of its items based on their position in the Gallery. 
*/ 
public class ScalingGallery extends Gallery { 

    public static final int ITEM_SPACING = -20; 

    private static final float SIZE_SCALE_MULTIPLIER = 0.25f; 
    private static final float ALPHA_SCALE_MULTIPLIER = 0.5f; 
    private static final float X_OFFSET = 20.0f; 

    /** 
    * Implemented by child view to adjust the boundaries after it has been matrix transformed. 
    */ 
    public interface SetHitRectInterface { 
     public void setHitRect(RectF newRect); 
    } 

    /** 
    * @param context 
    *   Context that this Gallery will be used in. 
    * @param attrs 
    *   Attributes for this Gallery (via either xml or in-code) 
    */ 
    public ScalingGallery(Context context, AttributeSet attrs) { 
     super(context, attrs); 
     setStaticTransformationsEnabled(true); 
     setChildrenDrawingOrderEnabled(true); 
    } 

    /** 
    * {@inheritDoc} 
    * 
    * @see #setStaticTransformationsEnabled(boolean) 
    * 
    * This is where the scaling happens. 
    */ 
    protected boolean getChildStaticTransformation(View child, Transformation t) { 

     child.invalidate(); 

     t.clear(); 
     t.setTransformationType(Transformation.TYPE_BOTH); 

     // Position of the child in the Gallery (... +2 +1 0 -1 -2 ... 0 being the middle) 
     final int childPosition = getSelectedItemPosition() - getPositionForView(child); 
     final int childPositionAbs = (int) Math.abs(childPosition); 

     final float left = child.getLeft(); 
     final float top = child.getTop(); 
     final float right = child.getRight(); 
     final float bottom = child.getBottom(); 

     Matrix matrix = t.getMatrix(); 
     RectF modifiedHitBox = new RectF(); 

     // Change alpha, scale and translate non-middle child views. 
     if (childPosition != 0) { 

      final int height = child.getMeasuredHeight(); 
      final int width = child.getMeasuredWidth(); 

      // Scale the size. 
      float scaledSize = 1.0f - (childPositionAbs * SIZE_SCALE_MULTIPLIER); 
      if (scaledSize < 0) { 
       scaledSize = 0; 
      } 
      matrix.setScale(scaledSize, scaledSize); 

      float moveX = 0; 
      float moveY = 0; 

      // Moving from right to left -- linear move since the scaling is done with respect to top-left corner of the view. 
      if (childPosition < 0) { 
       moveX = ((childPositionAbs - 1) * SIZE_SCALE_MULTIPLIER * width) + X_OFFSET; 
       moveX *= -1; 

      } else { // Moving from left to right -- sum of the previous positions' x displacements. 

       // X(n) = X(0) + X(1) + X(2) + ... + X(n-1) 
       for (int i = childPositionAbs; i > 0; i--) { 
        moveX += (i * SIZE_SCALE_MULTIPLIER * width); 
       } 
       moveX += X_OFFSET; 
      } 

      // Moving down y-axis is linear. 
      moveY = ((childPositionAbs * SIZE_SCALE_MULTIPLIER * height)/2); 

      matrix.postTranslate(moveX, moveY); 

      // Scale alpha value. 
      final float alpha = (1.0f/childPositionAbs) * ALPHA_SCALE_MULTIPLIER; 
      t.setAlpha(alpha); 

      // Calculate new hit box. Since we moved the child, the hitbox is no longer lined up with the new child position. 
      final float newLeft = left + moveX; 
      final float newTop = top + moveY; 
      final float newRight = newLeft + (width * scaledSize); 
      final float newBottom = newTop + (height * scaledSize); 
      modifiedHitBox = new RectF(newLeft, newTop, newRight, newBottom); 
     } else { 
      modifiedHitBox = new RectF(left, top, right, bottom); 
     } 

     // update child hit box so you can tap within the child's boundary 
     ((SetHitRectInterface) child).setHitRect(modifiedHitBox); 

     return true; 
    } 

    @Override 
    protected void onLayout(boolean changed, int l, int t, int r, int b) { 

     // Helps to smooth out jittering during scrolling. 
     // read more - http://www.unwesen.de/2011/04/17/android-jittery-scrolling-gallery/ 
     final int viewsOnScreen = getLastVisiblePosition() - getFirstVisiblePosition(); 
     if (viewsOnScreen <= 0) { 
      super.onLayout(changed, l, t, r, b); 
     } 
    } 

    private int mLastDrawnPosition; 

    @Override 
    protected int getChildDrawingOrder(int childCount, int i) { 

     //Reset the last position variable every time we are starting a new drawing loop 
     if (i == 0) { 
      mLastDrawnPosition = 0; 
     } 

     final int centerPosition = getSelectedItemPosition() - getFirstVisiblePosition(); 

     if (i == childCount - 1) { 
      return centerPosition; 
     } else if (i >= centerPosition) { 
      mLastDrawnPosition++; 
      return childCount - mLastDrawnPosition; 
     } else { 
      return i; 
     } 
    } 
} 

File: /src/com/example/ScalingGalleryItemLayout.java

public class ScalingGalleryItemLayout extends LinearLayout implements SetHitRectInterface { 

    public ScalingGalleryItemLayout(Context context) { 
     super(context); 
    } 

    public ScalingGalleryItemLayout(Context context, AttributeSet attrs) { 
     super(context, attrs); 
    } 

    public ScalingGalleryItemLayout(Context context, AttributeSet attrs, int defStyle) { 
     super(context, attrs, defStyle); 
    } 

    private Rect mTransformedRect; 

    @Override 
    public void setHitRect(RectF newRect) { 

     if (newRect == null) { 
      return; 
     } 

     if (mTransformedRect == null) { 
      mTransformedRect = new Rect(); 
     } 

     newRect.round(mTransformedRect); 
    } 

    @Override 
    public void getHitRect(Rect outRect) { 

     if (mTransformedRect == null) { 
      super.getHitRect(outRect); 
     } else { 
      outRect.set(mTransformedRect); 
     } 
    } 
} 

File: /res/layout/ScaledGalleryItemLayout.xml

<?xml version="1.0" encoding="utf-8"?> 
<com.example.ScalingGalleryItemLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/gallery_item_layout" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_gravity="center" 
    android:gravity="center" 
    android:orientation="vertical" 
    android:padding="5dp" > 

    <ImageView 
     android:id="@+id/gallery_item_image" 
     android:layout_width="360px" 
     android:layout_height="210px" 
     android:layout_gravity="center" 
     android:antialias="true" 
     android:background="@drawable/gallery_item_button_selector" 
     android:cropToPadding="true" 
     android:padding="35dp" 
     android:scaleType="centerInside" /> 

    <TextView 
     android:id="@+id/gallery_item_text" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center" 
     android:textColor="@drawable/white" 
     android:textSize="30sp" /> 

</com.example.ScalingGalleryItemLayout> 

Answer 2

Để giữ trạng thái của hình ảnh động sau khi nó được thực hiện, chỉ cần làm điều này trên hình ảnh động của bạn:

youranim.setFillAfter(true); 

Edit:

Trong dự án của tôi, tôi sử dụng phương pháp này và tôi nghĩ rằng, nó giúp bạn:

http://developer.sonymobile.com/wp/2011/04/12/how-to-take-advantage-of-the-pinch-to-zoom-feature-in-your-xperia%E2%84%A2-10-apps-part-1/

Answer 3

U có thể làm hình ảnh tùy chọn nhúm Zoom cho từng bộ sưu tập cũng có. bằng cách sử dụng các dòng mã sau:

bạn có thể tải xuống ví dụ.

https://github.com/alvinsj/android-image-gallery/downloads

Tôi hy vọng ví dụ này sẽ giúp u..if u có bất cứ thắc mắc hỏi tôi .....

Answer 4

Đây là giải pháp tích hợp phần của Thư viện trong Android với thư viện cử chỉ hình ảnh gesture-imageView

Và đây là đầy đủ mẫu mã SampleCode