Android RecyclerView旋转图片显示被裁剪问题求助

Hey there! Let's dig into why your rotated images are getting clipped in the RecyclerView and fix this up.

The Root Causes #

From your code and description, the clipping happens for a couple key reasons:

• You're using ImageView.ScaleType.CENTER: This only centers the image without scaling it to fit the view bounds—any part of the image outside the view gets cut off.
• Rotating the ImageView doesn't automatically update its layout dimensions. The view still uses the original image's width/height for layout calculations, so after a 90° rotation, the new dimensions don't fit the allocated space.
• adjustViewBounds=true works based on the image's original dimensions, not the rotated ones, so it doesn't help here.

Solution 1: Fix ScaleType + Adjust Layout After Rotation #

First, switch to a scale type that keeps the entire image visible, then manually adjust the view's layout parameters after rotation to account for swapped width/height.

Update your onBindViewHolder method like this:

@Override public void onBindViewHolder(@NonNull PickerViewHolder holder, int position) {
    final ViewGroup parent = (ViewGroup) holder.itemView;
    // Clear existing views
    parent.removeAllViews();
    
    final ImageView view = new ImageView(ActivityJigsaw.this);
    // Use CENTER_INSIDE to keep the full image visible and centered
    view.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
    view.setImageResource(R.drawable.whitebox);
    view.setAdjustViewBounds(true);

    if ((toggle & 1) == 0 ) {
        view.setRotation(90f);
        // Add the view first, then adjust its size after it's measured
        parent.addView(view, holder.viewLayoutParams);

        // Listen for when the view is laid out to fix its dimensions
        view.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                // Remove the listener to avoid repeated calls
                view.getViewTreeObserver().removeOnGlobalLayoutListener(this);
                // Swap width and height for the rotated view
                int originalWidth = view.getWidth();
                int originalHeight = view.getHeight();
                FrameLayout.LayoutParams updatedParams = new FrameLayout.LayoutParams(originalHeight, originalWidth, Gravity.CENTER);
                view.setLayoutParams(updatedParams);
            }
        });
    } else {
        parent.addView(view, holder.viewLayoutParams);
    }
    toggle ^= 1;
}

Solution 2: Custom ImageView for Automatic Rotation Handling #

For a cleaner, more maintainable fix, create a custom ImageView that automatically adjusts its dimensions when rotated. This avoids needing the layout listener in your adapter.

public class RotatableImageView extends ImageView {
    private float rotationAngle = 0f;

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

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

    public RotatableImageView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    public void setRotation(float rotation) {
        rotationAngle = rotation;
        super.setRotation(rotation);
        requestLayout(); // Trigger re-measurement after rotation
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        // Swap width and height specs if rotated 90/270 degrees
        if (rotationAngle % 180 != 0) {
            super.onMeasure(heightMeasureSpec, widthMeasureSpec);
        } else {
            super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        }
    }
}

Then use this custom view in your adapter:

@Override public void onBindViewHolder(@NonNull PickerViewHolder holder, int position) {
    final ViewGroup parent = (ViewGroup) holder.itemView;
    parent.removeAllViews();
    
    final RotatableImageView view = new RotatableImageView(ActivityJigsaw.this);
    view.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
    view.setImageResource(R.drawable.whitebox);
    view.setAdjustViewBounds(true);

    if ((toggle & 1) == 0 ) {
        view.setRotation(90f);
    }
    parent.addView(view, holder.viewLayoutParams);
    toggle ^= 1;
}

Quick Notes #

• ScaleType.CENTER_INSIDE ensures the full image is visible without clipping. If you want the image to fill the view while maintaining aspect ratio, use ScaleType.FIT_CENTER instead.
• Make sure your RecyclerView item layout (the itemView in PickerViewHolder) uses WRAP_CONTENT for width/height, or has enough fixed space to accommodate rotated images.

内容的提问来源于stack exchange，提问作者user3621075