如何在iOS中以菱形显示图像?

时间:2016-07-08 07:17:36

标签: ios iphone swift uiimageview

Original image is like this Hai我是iOS的新手,我的要求是以钻石形状显示图像,所以为此我遵循以下代码。我拿了一个UIView和ImageView是UIView的子视图。我正在钻石形状,但图像正在翻转。如何解决这个问题?

check the output here

  var tr: CGAffineTransform = CGAffineTransformIdentity
  tr = CGAffineTransformScale(tr, 0.8, 1)
  tr = CGAffineTransformRotate(tr, 0.7)
  self.views.transform =  tr

2 个答案:

答案 0 :(得分:2)

您可以使用UIBezierPath绘制形状

import UIKit

extension UIView
{
    func addDiamondMaskToView()
    {
    let path = UIBezierPath()
    path.moveToPoint(CGPoint(x: self.bounds.size.width / 2.0, y: 0))
    path.addLineToPoint(CGPoint(x: self.bounds.size.width, y: self.bounds.size.height / 2.0))
    path.addLineToPoint(CGPoint(x: self.bounds.size.width / 2.0, y: self.bounds.size.height))
    path.addLineToPoint(CGPoint(x: 0, y: self.bounds.size.height / 2.0))
    path.closePath()

    let shapeLayer = CAShapeLayer()
    shapeLayer.path = path.CGPath
    shapeLayer.fillColor = UIColor.whiteColor().CGColor
    shapeLayer.strokeColor = UIColor.clearColor().CGColor

    self.layer.mask = shapeLayer
    }
}

您可以将方法调用为

//suppose this is your imageview
let imgView = UIImageView(frame: CGRectMake(0, 0, 100, 200))
//then call the method as
imgView.addDiamondMaskToView()

它的工作正常,请查看图片以供参考

enter image description here

答案 1 :(得分:0)

正如您提供的图像,经过分析后我可以得出结论,您需要做的是

  • 将对角线遮罩添加到ImageView
  • 将imageView中的图像旋转到某个角度

假设图像旋转到45度,我提供解决方案

import UIKit

extension UIView
{
func addDiamondMaskToView()
{
    let path = UIBezierPath()
    path.moveToPoint(CGPoint(x: self.bounds.size.width / 2.0, y: 0))
    path.addLineToPoint(CGPoint(x: self.bounds.size.width, y: self.bounds.size.height / 2.0))
    path.addLineToPoint(CGPoint(x: self.bounds.size.width / 2.0, y: self.bounds.size.height))
    path.addLineToPoint(CGPoint(x: 0, y: self.bounds.size.height / 2.0))
    path.closePath()

    let shapeLayer = CAShapeLayer()
    shapeLayer.path = path.CGPath
    shapeLayer.fillColor = UIColor.whiteColor().CGColor
    shapeLayer.strokeColor = UIColor.clearColor().CGColor
    self.layer.mask = shapeLayer
}
}

extension UIImageView
{
    func addDiamondWithSomeAngle(angleInDegrees degrees : CGFloat)
    {
        self.addDiamondMaskToView()
        self.image = self.image?.imageRotatedByDegrees(degrees, flip: false)
    }
}

extension UIImage {
    public func imageRotatedByDegrees(degrees: CGFloat, flip: Bool) -> UIImage 
    {
        let degreesToRadians: (CGFloat) -> CGFloat = {
            return $0 / 180.0 * CGFloat(M_PI)
        }
        let rotatedViewBox = UIView(frame: CGRect(origin: CGPointZero, size: size))
        let t = CGAffineTransformMakeRotation(degreesToRadians(degrees));
        rotatedViewBox.transform = t
        let rotatedSize = rotatedViewBox.frame.size

        UIGraphicsBeginImageContext(rotatedSize)
        let bitmap = UIGraphicsGetCurrentContext()

        CGContextTranslateCTM(bitmap, rotatedSize.width / 2.0, rotatedSize.height / 2.0);

        CGContextRotateCTM(bitmap, degreesToRadians(degrees));

        var yFlip: CGFloat

        if(flip){
            yFlip = CGFloat(-1.0)
        } else {
            yFlip = CGFloat(1.0)
        }

        CGContextScaleCTM(bitmap, yFlip, -1.0)
        CGContextDrawImage(bitmap, CGRectMake(-size.width / 2, -size.height / 2, size.width, size.height), CGImage)

        let newImage = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        return newImage
    }
}

您需要将方法调用为

imageView.addDiamondWithSomeAngle(angleInDegrees: 45)

输出如下

enter image description here

礼貌:Image rotation confile