swift技术文章收藏借鉴

Swift UIBezierPath

2016-10-08  本文已影响339人  HeartPower

最近项目中使用到了UIBezierPath绘图,留下来希望能给其他人学习做个参考。

自定义一个View来实现

<pre>import UIKit

class WTPromiseView: UIView {

let mainColor = AppMainColor.withAlphaComponent(0.3)
let secColor = UIColor.darkGray

lazy var imageAndTextArr = [(UIImage(named: "ic_zhengpinbaozhang_nor"),"正品保障"),
                       (UIImage(named: "ic_qitianwuliyoutuihuo_nor"),"7天无理由退货"),
                       (UIImage(named: "ic_pinpaishouquan_nor"),"品牌授权"),
                       (UIImage(named: "ic_haiwaizhiyou_nor"),"海外直邮")
                      ]
let wtString = "微糖承诺"

init()
{
    super.init(frame: CGRect.zero)
    
    self.backgroundColor = UIColor.white
    
}
required init?(coder aDecoder: NSCoder)
{
    fatalError("init(coder:) has not been implemented")
}

override func draw(_ rect: CGRect)
{
    let padding1: CGFloat = 15
    let padding2: CGFloat = 20
    
    let space: CGFloat = 30
    let attributes = [NSFontAttributeName:UIFont.systemFont(ofSize: 14),NSForegroundColorAttributeName:AppMainColor]
    let size = self.getStringSize(self.wtString, attributes: attributes)
    
    self.drawRectPath(rect, padding: padding1,size: size,space: space)
    self.drawRectPath(rect, padding: padding2, size: size, space: space)
    
    let stringSpace = (rect.width - space * 2 - size.width - 20) / 2
    let stringX = space + stringSpace + 10
    let stringY = padding1 - (size.height - padding2 + padding1) / 2
    self.wtString.draw(at: CGPoint(x:stringX, y: stringY), withAttributes: attributes)
    
    self.drawImageAndText(rect, padding: padding2)
}
// 画直线
func drawRectPath(_ rect: CGRect,padding: CGFloat,size: CGSize,space: CGFloat)
{
    let point0 = CGPoint(x: space, y: space)
    let radius0 = point0.x - padding
    let angleArr0 = [CGFloat(M_PI),-CGFloat(M_PI) / 2]
   
    self.drawArcRound(point0, radius: radius0, angleArr: angleArr0)
    
    let path = UIBezierPath()
    path.move(to: CGPoint(x: padding, y: space))
    path.addLine(to: CGPoint(x: padding, y: rect.height - space))
    
    let point1 = CGPoint(x: space, y: rect.height - space)
    let angleArr1 = [CGFloat(M_PI) / 2,CGFloat(M_PI)]
    self.drawArcRound(point1, radius: radius0, angleArr: angleArr1)
    
    path.move(to: CGPoint(x: space, y: rect.height - padding))
    path.addLine(to: CGPoint(x: rect.width - space, y: rect.height - padding))
    
    let point2 = CGPoint(x: rect.width - space, y: rect.height - space)
    let angleArr2 = [0,CGFloat(M_PI) / 2]
    self.drawArcRound(point2, radius: radius0, angleArr: angleArr2)
    
    path.move(to: CGPoint(x: rect.width - padding, y: rect.height - space))
    path.addLine(to: CGPoint(x: rect.width - padding, y: space))
    
    let point3 = CGPoint(x: rect.width - space, y: space)
    let angleArr3 = [-CGFloat(M_PI) / 2,0]
    self.drawArcRound(point3, radius: radius0, angleArr: angleArr3)
    
    let stringSpace = (rect.width - space * 2 - size.width - 20) / 2

    path.move(to: CGPoint(x: rect.width - space, y: padding))
    path.addLine(to: CGPoint(x: rect.width - stringSpace - space, y: padding))
    
    path.move(to: CGPoint(x:space, y: padding))
    path.addLine(to: CGPoint(x:stringSpace + space, y: padding))
    
    self.mainColor.setStroke()
    path.stroke()
}
// 画文字和图
func drawImageAndText(_ rect: CGRect,padding: CGFloat)
{
    let image = self.imageAndTextArr[0].0
    let imageW = image!.size.width
    let imageH = image!.size.height
    let imageSpace = (rect.width - padding * 2) / 4

    let attributes = [NSFontAttributeName:UIFont.systemFont(ofSize: 12),NSForegroundColorAttributeName:self.secColor]
    for i in 0..<self.imageAndTextArr.count
    {
        let textString = self.imageAndTextArr[i].1
        let size = self.getStringSize(textString, attributes: attributes)
        let drawImage = self.imageAndTextArr[i].0
        
        let imageX = padding + (imageSpace - imageW) / 2 + imageSpace * CGFloat(i)
        let imageY = (rect.height - imageH - size.height - 6) / 2
        let rect = CGRect(x: imageX, y: imageY, width: imageW, height: imageH)
        drawImage?.draw(in: rect)
      
        let halfW = size.width / 2
        let textX = imageX + imageW / 2 - halfW
        let textY = imageY + imageW + 6
        
        textString.draw(at: CGPoint(x:textX, y: textY), withAttributes: attributes)
    }
}
// 画圆角
func drawArcRound(_ point: CGPoint,radius: CGFloat,angleArr: [CGFloat])
{
    let path = UIBezierPath(arcCenter: point, radius: radius, startAngle: angleArr[0], endAngle: angleArr[1], clockwise: true)
    
    self.mainColor.setStroke()
    path.stroke()
}

func getStringSize(_ string: String, attributes: [String : AnyObject]) -> CGSize
{
    return string.size(attributes: attributes)
}

}
</pre>

实现后效果
1.png
上一篇下一篇

猜你喜欢

热点阅读