Last active
October 31, 2025 20:01
-
-
Save exaland/5e801c6aaf9096a8b32a84da83ab3876 to your computer and use it in GitHub Desktop.
Customize Border Style of UIView (UIKit) with IBDesignable
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @IBDesignable | |
| class UIBorderCustom: UIView { | |
| @IBInspectable var borderColor: UIColor? { | |
| didSet { | |
| borderLine.strokeColor = borderColor?.cgColor | |
| } | |
| } | |
| @IBInspectable var borderWidth: CGFloat = 2 { | |
| didSet { | |
| borderLine.lineWidth = borderWidth | |
| setNeedsLayout() | |
| } | |
| } | |
| @IBInspectable var cornerRadius: CGFloat = 0 { | |
| didSet { | |
| setNeedsLayout() | |
| } | |
| } | |
| @IBInspectable var choosePosition: String = "top" { | |
| didSet { | |
| setNeedsLayout() | |
| } | |
| } | |
| private let borderLine = CAShapeLayer() | |
| private let maskLayer = CAShapeLayer() | |
| override init(frame: CGRect) { | |
| super.init(frame: frame) | |
| setup() | |
| } | |
| required init?(coder: NSCoder) { | |
| super.init(coder: coder) | |
| setup() | |
| } | |
| private func setup() { | |
| // Configuration pour la ligne de bordure | |
| borderLine.strokeColor = UIColor.black.cgColor | |
| borderLine.fillColor = UIColor.clear.cgColor | |
| borderLine.lineWidth = borderWidth | |
| layer.addSublayer(borderLine) | |
| } | |
| override func layoutSubviews() { | |
| super.layoutSubviews() | |
| updateMask() | |
| updateBorderLine() | |
| } | |
| private func updateMask() { | |
| // Définir quels coins arrondir selon choosePosition | |
| let rect = bounds | |
| var corners: UIRectCorner = [] | |
| switch choosePosition { | |
| case "top": | |
| corners = [.topLeft, .topRight] | |
| case "bottom": | |
| corners = [.bottomLeft, .bottomRight] | |
| default: | |
| corners = [] | |
| } | |
| // Créer le chemin avec coins arrondis | |
| let path = UIBezierPath(roundedRect: rect, byRoundingCorners: corners, cornerRadii: CGSize(width: cornerRadius, height: cornerRadius)) | |
| maskLayer.path = path.cgPath | |
| layer.mask = maskLayer | |
| } | |
| private func updateBorderLine() { | |
| let rect = bounds | |
| let path = UIBezierPath() | |
| switch choosePosition { | |
| case "top": | |
| // Ligne horizontale en haut | |
| path.move(to: CGPoint(x: rect.minX, y: rect.minY)) | |
| path.addLine(to: CGPoint(x: rect.maxX, y: rect.minY)) | |
| case "bottom": | |
| // Ligne horizontale en bas | |
| path.move(to: CGPoint(x: rect.minX, y: rect.maxY)) | |
| path.addLine(to: CGPoint(x: rect.maxX, y: rect.maxY)) | |
| case "left": | |
| // Ligne verticale à gauche | |
| path.move(to: CGPoint(x: rect.minX, y: rect.minY)) | |
| path.addLine(to: CGPoint(x: rect.minX, y: rect.maxY)) | |
| case "right": | |
| // Ligne verticale à droite | |
| path.move(to: CGPoint(x: rect.maxX, y: rect.minY)) | |
| path.addLine(to: CGPoint(x: rect.maxX, y: rect.maxY)) | |
| default: | |
| break | |
| } | |
| borderLine.path = path.cgPath | |
| borderLine.lineWidth = borderWidth | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment