带有 UIImagePickerController iOS 的圆形裁剪器相机? [英] Circular Cropper Camera with UIImagePickerController iOS?

问题描述

我正在使用带有 cameraSource 类型的 UIImagePickerController.但我注意到有 方形裁剪器 而不是带有移动和缩放"的圆形裁剪器

I am using UIImagePickerController with cameraSource type. but I notice that there is square cropper instead a circular cropper with "Move and Scale"

在 iOS 原生联系人应用中，有一个带有移动和缩放"标题的圆形裁剪器.但是当我使用带有相机源类型的 UIImagePickerController 时，我得到了一个没有标题的方形裁剪器.

In iOS native contact app there is a circular cropper with "Move and Scale" title . But with I use UIImagePickerController with camera source type I got a square cropper without title .

请推荐一些库或代码

这是用户选择使用相机拍照时的 iOS 原生应用屏幕截图.我想要一样的

this is the iOS native app screen shot when user choose take photo with camera . I want same

谢谢

推荐答案

我会展示我是如何做到的.

I'll show how I did it.

我创建了一个视图控制器(PhotoPicker)来用相机拍照并用他的圆形图层裁剪它们.它在底部包含一个工具栏，带有重拍和完成按钮以及滚动视图中的图像视图(请参阅我的 PhotoPicker 的屏幕截图:http://imgur.com/MleuKmh).

I created a view controller (PhotoPicker) to take photos with the camera and crop them with his circle layer. It contains a tool bar at the bottom with retake and done buttons and an image view in a scroll view (see the screenshot of my PhotoPicker here: http://imgur.com/MleuKmh).

当我想拍照时，我使用以下代码打开我的 PhotoPicker:

When I want to take a photo I open my PhotoPicker with this code:

let photoPickerVC=self.storyboard?.instantiateViewControllerWithIdentifier("photoPickerVC") as! PhotoPicker
photoPickerVC.modalPresentationStyle=UIModalPresentationStyle.OverFullScreen
self.presentViewController(photoPickerVC, animated: true, completion: nil)

我的 PhotoPicker 类需要 UIImagePickerControllerDelegate 来拍照.

My PhotoPicker class will need UIImagePickerControllerDelegate to take a photo.

我在 viewDidLoad 中调用这个函数来创建裁剪.

I call this function in viewDidLoad to create the crop.

func addCropLayer(){
        //layer circle
        let circleLayer=CAShapeLayer()
        let squareLength=self.view.frame.width - 40
        innerrect=CGRectMake(20, self.view.center.y - (squareLength/2) - self.toolBar.frame.height, squareLength, squareLength)
        let path2=UIBezierPath(ovalInRect: innerrect)
        path2.usesEvenOddFillRule=true
        circleLayer.path=path2.CGPath
        circleLayer.fillColor=UIColor.clearColor().CGColor

        let path=UIBezierPath(roundedRect: CGRectMake(0, 0, UIScreen.mainScreen().bounds.width, UIScreen.mainScreen().bounds.height - toolBar.frame.height), cornerRadius: 0)
        path.appendPath(path2)
        path.usesEvenOddFillRule=true

        //black layer that contains the transparent circle
        //var fillLayer=CAShapeLayer()
        fillLayer.path=path.CGPath
        fillLayer.fillRule=kCAFillRuleEvenOdd
        fillLayer.fillColor=UIColor.blackColor().CGColor
        fillLayer.opacity=0.8

        self.view.layer.addSublayer(fillLayer)
        self.view.addSubview(toolBar)
    }

然后我在viewDidAppear中调用ImagePicker:

override func viewDidAppear(animated: Bool) {
    self.showImagePickerForSourceType(UIImagePickerControllerSourceType.Camera)
}

func showImagePickerForSourceType(sourceType: UIImagePickerControllerSourceType){
        print("showImagePickerForSourceType")
        if self.imageView.isAnimating(){
            self.imageView.stopAnimating()
        }
        //var capturedImages=NSMutableArray()
        if self.capturedImages.count>0 {
            self.capturedImages.removeAllObjects()
        }

        let imagePickerController=UIImagePickerController()
        imagePickerController.modalPresentationStyle=UIModalPresentationStyle.CurrentContext
        imagePickerController.sourceType=sourceType
        imagePickerController.delegate=self
        imagePickerController.cameraDevice=UIImagePickerControllerCameraDevice.Front

        if sourceType == UIImagePickerControllerSourceType.Camera {
            imagePickerController.showsCameraControls=false
            NSBundle.mainBundle().loadNibNamed("OverlayVC", owner: self, options: nil)
            self.overlayView.frame=UIScreen.mainScreen().bounds
            imagePickerController.cameraOverlayView=self.overlayView
            self.overlayView=nil
        }

        print("presentviewcontroller")
        self.imagePickerController=imagePickerController

        let screenSize:CGSize=UIScreen.mainScreen().bounds.size
        let cameraAspectRatio:CGFloat=3.0/4.0
        print("camera aspect ratio: (cameraAspectRatio)")
        let scale=(screenSize.height / screenSize.width) * cameraAspectRatio
        print("scale: (scale)")
        let yOffset=(screenSize.height - screenSize.width / cameraAspectRatio)/2
        print("y offset: (yOffset)")
        let translate:CGAffineTransform=CGAffineTransformMakeTranslation(0, yOffset)
        let fullScreen:CGAffineTransform=CGAffineTransformMakeScale(scale, scale)
        let fullTransform:CGAffineTransform=CGAffineTransformConcat(fullScreen, translate)
        self.imagePickerController.cameraViewTransform=fullTransform

        let iOS:NSString=UIDevice.currentDevice().systemVersion
        let iOSint:Int=iOS.integerValue
        print("iOS int value: (iOSint)")

        if iOSint < 8 {
            print("ios < 8")
            var rect:CGRect=self.imagePickerController.view.frame
            rect.size.height = screenSize.width / cameraAspectRatio
            rect.size.width = screenSize.width
            print("rect: (rect)")
            self.imagePickerController.view.frame=rect
            self.imagePickerController.view.transform=fullTransform
        }else{
            self.imagePickerController.view.frame=UIScreen.mainScreen().bounds
        }

        self.presentViewController(self.imagePickerController, animated: true, completion: nil)
    }


@IBAction func takePhoto(sender: AnyObject) {
        print("takePhoto")
        self.imagePickerController.takePicture()
    }

如您所见，我在显示 ImagePicker 时调用了 OverlayVC.这是我创建的另一个视图，请在此处查看屏幕截图:http://imgur.com/6nr4PNW.但它的插座也连接到 PhotoPicker.不要创建另一个类，只创建故事板中的视图并连接按钮和co 到 PhotoPicker 类.

As you can see I call OverlayVC when I show the ImagePicker. It's another view I created, see the screenshot here: http://imgur.com/6nr4PNW. But its outlets are also connected to PhotoPicker. Do not create another class, just the view in storyboard and connect buttons & co to the PhotoPicker class.

这篇关于带有 UIImagePickerController iOS 的圆形裁剪器相机?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！