2014-08-27 66 views
3

我下面的下面的教程在Android的從拇指放大圖像http://developer.android.com/training/animation/zoom.html的Android變焦圖像居中

一切正常,只是我想放大的圖像在視圖中居中偉大和具有最大大小(不像本教程中的fill_parent或match_parent)。我有相同的代碼,但我的XML不同,試圖居中圖像,但它不起作用。問題是什麼?

<FrameLayout..... 
<RelativeLayout 
    android:id="@+id/te" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"> 
    <ImageView 
     android:id="@+id/memory_expanded_image" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:maxHeight="150dp" 
     android:maxWidth="150dp" 
     android:adjustViewBounds="true" 
     android:layout_centerInParent="true" 
     android:gravity="center" 
     android:scaleType="fitCenter" 
     android:visibility="invisible" 
     android:contentDescription="@string/description_zoom_touch_close" /> 

</RelativeLayout> 
</FrameLayout> 

縮放代碼的一部分(與教程相同)。我想我需要在這裏改變一些東西,最後的界限,但我無法弄清楚。

// Calculate the starting and ending bounds for the zoomed-in image. 
// This step involves lots of math. Yay, math. 
final Rect startBounds = new Rect(); 
final Rect finalBounds = new Rect(); 
final Point globalOffset = new Point(); 

// The start bounds are the global visible rectangle of the thumbnail, 
// and the final bounds are the global visible rectangle of the container 
// view. Also set the container view's offset as the origin for the 
// bounds, since that's the origin for the positioning animation 
// properties (X, Y). 
thumbView.getGlobalVisibleRect(startBounds); 
findViewById(R.id.container) 
     .getGlobalVisibleRect(finalBounds, globalOffset); 
startBounds.offset(-globalOffset.x, -globalOffset.y); 
finalBounds.offset(-globalOffset.x, -globalOffset.y) 

回答

1

您需要修改finalBounds以匹配圖像的實際大小。事情是這樣的

int imageHeight = expandedImageView.getHeight(); 
int imageWidth = expandedImageView.getWidth(); 
int horizontalMargin = 0, verticalMargin = 0; 
if (imageHeight < finalBounds.height()) { 
    verticalMargin = (finalBounds.height()/2) - (imageHeight/2); 
} 
if (imageWidth < finalBounds.width()) { 
    horizontalMargin = (finalBounds.width()/2) - (imageWidth/2); 
} 
finalBounds.set(finalBounds.left + horizontalMargin, finalBounds.top + verticalMargin, finalBounds.right - horizontalMargin, finalBounds.bottom - verticalMargin); 

全碼:

佈局:

<Framelayout 
... 
... 
<ImageView 
    android:id="@+id/memory_expanded_image" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:contentDescription="@string/description_zoom_touch_close" 
    android:visibility="invisible"/> 

活動:

private void zoomImageFromThumb(final View thumbView, int imageResId) { 
     // If there's an animation in progress, cancel it immediately and proceed with this one. 
     if (mCurrentAnimator != null) { 
      mCurrentAnimator.cancel(); 
     } 

     // Load the high-resolution "zoomed-in" image. 
     final ImageView expandedImageView = (ImageView) findViewById(R.id.memory_expanded_image); 
     expandedImageView.setImageResource(imageResId); 

     // Calculate the starting and ending bounds for the zoomed-in image. This step 
     // involves lots of math. Yay, math. 
     final Rect startBounds = new Rect(); 
     final Rect finalBounds = new Rect(); 
     final Point globalOffset = new Point(); 

     // The start bounds are the global visible rectangle of the thumbnail, and the 
     // final bounds are the global visible rectangle of the container view. Also 
     // set the container view's offset as the origin for the bounds, since that's 
     // the origin for the positioning animation properties (X, Y). 
     thumbView.getGlobalVisibleRect(startBounds); 
     findViewById(R.id.container).getGlobalVisibleRect(finalBounds, globalOffset); 
     startBounds.offset(-globalOffset.x, -globalOffset.y); 
     finalBounds.offset(-globalOffset.x, -globalOffset.y); 

     //modify the final rect to match actual size of the image 
     int imageHeight = expandedImageView.getHeight(); 
     int imageWidth = expandedImageView.getWidth(); 
     int horizontalMargin = 0, verticalMargin = 0; 
     if (imageHeight < finalBounds.height()) { 
      verticalMargin = (finalBounds.height()/2) - (imageHeight/2); 
     } 
     if (imageWidth < finalBounds.width()) { 
      horizontalMargin = (finalBounds.width()/2) - (imageWidth/2); 
     } 
     finalBounds.set(finalBounds.left + horizontalMargin, finalBounds.top + verticalMargin, finalBounds.right - horizontalMargin, finalBounds.bottom - verticalMargin); 


     // Adjust the start bounds to be the same aspect ratio as the final bounds using the 
     // "center crop" technique. This prevents undesirable stretching during the animation. 
     // Also calculate the start scaling factor (the end scaling factor is always 1.0). 
     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; 
     } 

     // Hide the thumbnail and show the zoomed-in view. When the animation begins, 
     // it will position the zoomed-in view in the place of the thumbnail. 
     thumbView.setAlpha(0f); 
     expandedImageView.setVisibility(View.VISIBLE); 

     // Set the pivot point for SCALE_X and SCALE_Y transformations to the top-left corner of 
     // the zoomed-in view (the default is the center of the view). 
     expandedImageView.setPivotX(0f); 
     expandedImageView.setPivotY(0f); 

     // Construct and run the parallel animation of the four translation and scale properties 
     // (X, Y, SCALE_X, and SCALE_Y). 
     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; 

     // Upon clicking the zoomed-in image, it should zoom back down to the original bounds 
     // and show the thumbnail instead of the expanded image. 
     final float startScaleFinal = startScale; 
     expandedImageView.setOnClickListener(new View.OnClickListener() { 
      @Override 
      public void onClick(View view) { 
       if (mCurrentAnimator != null) { 
        mCurrentAnimator.cancel(); 
       } 

       // Animate the four positioning/sizing properties in parallel, back to their 
       // original values. 
       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; 
      } 
     }); 
    } 
+0

我嘗試了這種代碼(最終邊界的修改)。現在放大的圖像不在右上角(如同在OP情況下那樣),但不在視圖的中心。它位於容器視圖中心的右下方 – Martina 2015-06-05 11:10:14

+0

您是否也更改了xml?請檢查答案。 – 2015-06-05 11:20:41

+0

請你指出,這個XML中有什麼重要的東西?它是「包裝內容」,因爲我有layout_width和layout_height設置id dp,這可能是一個問題嗎? – Martina 2015-06-05 11:38:21