Swift3中如何使用@IBInspectable单独控制UIView的圆角?
How to control an UIView's rounded corners separately using @IBInspectable in Swift 3?
这是我当前的代码:
override func viewDidLoad() {
super.viewDidLoad()
let rect = Draw(frame: CGRect(
origin: CGPoint(x: 50, y: 50),
size: CGSize(width: 100, height: 100)))
self.view.addSubview(rect)
}
试试这个代码。在我的项目中它工作正常。
extension UIView {
@IBInspectable var cornerRadius: CGFloat {
get {
return layer.cornerRadius
}
set {
layer.cornerRadius = newValue
layer.masksToBounds = newValue > 0
}
}
}
使用此自定义 class,基本上您需要创建一条贝塞尔曲线路径,使用直线和四边形曲线,使用 @IBInspectable
属性中的值处理每个角。
这是代码
//
// CornerView.swift
// UIViewCornerRounded
//
// Created by Reinier Melian on 21/07/2017.
// Copyright © 2017 Pruebas. All rights reserved.
//
import UIKit
@IBDesignable
class CornerView: UIView {
@IBInspectable var leftTopRadius : CGFloat = 0{
didSet{
self.applyMask()
}
}
@IBInspectable var rightTopRadius : CGFloat = 0{
didSet{
self.applyMask()
}
}
@IBInspectable var rightBottomRadius : CGFloat = 0{
didSet{
self.applyMask()
}
}
@IBInspectable var leftBottomRadius : CGFloat = 0{
didSet{
self.applyMask()
}
}
override func layoutSubviews() {
super.layoutSubviews()
self.applyMask()
}
// Only override draw() if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
/*override func draw(_ rect: CGRect) {
super.draw(rect)
}*/
func applyMask()
{
let shapeLayer = CAShapeLayer(layer: self.layer)
shapeLayer.path = self.pathForCornersRounded(rect:self.bounds).cgPath
shapeLayer.frame = self.bounds
shapeLayer.masksToBounds = true
self.layer.mask = shapeLayer
}
func pathForCornersRounded(rect:CGRect) ->UIBezierPath
{
let path = UIBezierPath()
path.move(to: CGPoint(x: 0 + leftTopRadius , y: 0))
path.addLine(to: CGPoint(x: rect.size.width - rightTopRadius , y: 0))
path.addQuadCurve(to: CGPoint(x: rect.size.width , y: rightTopRadius), controlPoint: CGPoint(x: rect.size.width, y: 0))
path.addLine(to: CGPoint(x: rect.size.width , y: rect.size.height - rightBottomRadius))
path.addQuadCurve(to: CGPoint(x: rect.size.width - rightBottomRadius , y: rect.size.height), controlPoint: CGPoint(x: rect.size.width, y: rect.size.height))
path.addLine(to: CGPoint(x: leftBottomRadius , y: rect.size.height))
path.addQuadCurve(to: CGPoint(x: 0 , y: rect.size.height - leftBottomRadius), controlPoint: CGPoint(x: 0, y: rect.size.height))
path.addLine(to: CGPoint(x: 0 , y: leftTopRadius))
path.addQuadCurve(to: CGPoint(x: 0 + leftTopRadius , y: 0), controlPoint: CGPoint(x: 0, y: 0))
path.close()
return path
}
}
结果如下
使用这个值
希望对您有所帮助
这是我当前的代码:
override func viewDidLoad() {
super.viewDidLoad()
let rect = Draw(frame: CGRect(
origin: CGPoint(x: 50, y: 50),
size: CGSize(width: 100, height: 100)))
self.view.addSubview(rect)
}
试试这个代码。在我的项目中它工作正常。
extension UIView {
@IBInspectable var cornerRadius: CGFloat {
get {
return layer.cornerRadius
}
set {
layer.cornerRadius = newValue
layer.masksToBounds = newValue > 0
}
}
}
使用此自定义 class,基本上您需要创建一条贝塞尔曲线路径,使用直线和四边形曲线,使用 @IBInspectable
属性中的值处理每个角。
这是代码
//
// CornerView.swift
// UIViewCornerRounded
//
// Created by Reinier Melian on 21/07/2017.
// Copyright © 2017 Pruebas. All rights reserved.
//
import UIKit
@IBDesignable
class CornerView: UIView {
@IBInspectable var leftTopRadius : CGFloat = 0{
didSet{
self.applyMask()
}
}
@IBInspectable var rightTopRadius : CGFloat = 0{
didSet{
self.applyMask()
}
}
@IBInspectable var rightBottomRadius : CGFloat = 0{
didSet{
self.applyMask()
}
}
@IBInspectable var leftBottomRadius : CGFloat = 0{
didSet{
self.applyMask()
}
}
override func layoutSubviews() {
super.layoutSubviews()
self.applyMask()
}
// Only override draw() if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
/*override func draw(_ rect: CGRect) {
super.draw(rect)
}*/
func applyMask()
{
let shapeLayer = CAShapeLayer(layer: self.layer)
shapeLayer.path = self.pathForCornersRounded(rect:self.bounds).cgPath
shapeLayer.frame = self.bounds
shapeLayer.masksToBounds = true
self.layer.mask = shapeLayer
}
func pathForCornersRounded(rect:CGRect) ->UIBezierPath
{
let path = UIBezierPath()
path.move(to: CGPoint(x: 0 + leftTopRadius , y: 0))
path.addLine(to: CGPoint(x: rect.size.width - rightTopRadius , y: 0))
path.addQuadCurve(to: CGPoint(x: rect.size.width , y: rightTopRadius), controlPoint: CGPoint(x: rect.size.width, y: 0))
path.addLine(to: CGPoint(x: rect.size.width , y: rect.size.height - rightBottomRadius))
path.addQuadCurve(to: CGPoint(x: rect.size.width - rightBottomRadius , y: rect.size.height), controlPoint: CGPoint(x: rect.size.width, y: rect.size.height))
path.addLine(to: CGPoint(x: leftBottomRadius , y: rect.size.height))
path.addQuadCurve(to: CGPoint(x: 0 , y: rect.size.height - leftBottomRadius), controlPoint: CGPoint(x: 0, y: rect.size.height))
path.addLine(to: CGPoint(x: 0 , y: leftTopRadius))
path.addQuadCurve(to: CGPoint(x: 0 + leftTopRadius , y: 0), controlPoint: CGPoint(x: 0, y: 0))
path.close()
return path
}
}
结果如下
使用这个值
希望对您有所帮助