How to use custom ratio in YPLibraryView?

[wanderingfairy]

Tapping the scale button in the ImagePickerView shows an image with a square ratio and an image with an original ratio. I want to use a square ratio and a predefined custom ratio instead of the original ratio. (16:9 for landscape images, 4:5 for portrait images)

What should I modify?

[AlexisLampouridis]

Have you find any solution or workaround ?

[s4cha]

@wanderingfairy, this feature is not supported at the moment. What comes closer is the ability to crop the image to a certain ratio after the selection with:

config.showsCrop = .rectangle(ratio: (16/9))

but this does not allow to apply different ratio depending on image orientation. That sounds like a cool feature though, if you have time, feel free to take a shot at it !

[keremcesme]

@wanderingfairy, @s4cha, I would like to let you know that I found a temporary solution. I reviewed YPAssetZoomableView and made a few changes.

I defined a variable named public var assetType: Int.

final class YPAssetZoomableView: UIScrollView {
    ...
    public var assetType = 0  // 0: Portrait, 1: Landscape, 2: Square
    ...
}

I set the assetType while calculating the frame of the selected Asset within the setAssetFrame() function.

func setAssetFrame(`for` view: UIView, with image: UIImage) {
        ...
        if w > h { // Landscape
            ...
            self.assetType = 1 // -> Here
        } else if h > w { // Portrait
            ...
            self.assetType = 0 // -> Here
            ...
        } else { // Square
            ...
            self.assetType = 2 // -> Here
        }
        ...
    }

Then I updated the fitImage function. If the user wants a 4:5 ratio for portrait images or videos, he can choose setZoomScale(squaredZoomScale * 0.8), if he wants a 1.91:1 ratio for landscape, he can choose setZoomScale(squaredZoomScale * 0.5235602094240838). I can find these values with a simple percentage calculation. Usage:

public func fitImage(_ fit: Bool, animated isAnimated: Bool = false) {
        squaredZoomScale = calculateSquaredZoomScale()
        if fit {
            setZoomScale(squaredZoomScale, animated: isAnimated)
        } else {
            if self.assetType == 0 {
                setZoomScale(squaredZoomScale * 0.8, animated: isAnimated)
            } else if self.assetType == 1 {
                setZoomScale(squaredZoomScale * 0.5235602094240838, animated: isAnimated)
            } else if self.assetType == 2 {
                setZoomScale(1, animated: isAnimated)
            }
        }
    }

I don't have any problems while exporting. Crop works correctly in both video and photo. But when you enlarge the asset with the pan gesture, it sets the asset to full size. I'll add an edit when I figure it out.

Developing this feature and having it adjustable in the config can make YPImagePicker much better. I would be very pleased if I could contribute to this project.

Edit: By updating the scrollViewDidEndZooming() function in this way, we can also crop with the desired ratio with the pan gesture.

func scrollViewDidEndZooming(_ scrollView: UIScrollView, with view: UIView?, atScale scale: CGFloat) {
        guard let view = view, view == photoImageView || view == videoView else { return }

        // Delete here:
        // prevent to zoom out 
        // if YPConfig.library.onlySquare && scale < squaredZoomScale {
        // self.fitImage(true, animated: true)
        // }

        // Add here:
        if self.assetType == 0 {
            if scale < squaredZoomScale * 0.8 {
                fitImage(false, animated: true)
            }
        } else if self.assetType == 1 {
            if scale < squaredZoomScale * 0.5235602094240838 {
                fitImage(false, animated: true)
            }
        }
        myDelegate?.ypAssetZoomableViewScrollViewDidEndZooming()
        cropAreaDidChange()
    }

https://user-images.githubusercontent.com/69275985/137604313-a08ec286-42db-4e73-923d-772e0008f4ad.mp4