如何在swift中创建虚线？

gt0wga4j  于 2024-01-05  发布在  Swift
关注(0)|答案(8)|浏览(155)

我想知道如何在swift中创建一条虚线，就像这样：-而不是像这样的常规直线：--，我知道我可以创建多行，但如果我只能用一行来写，那将需要很多不必要的代码。

swift

8条答案

按热度按时间
plupiseo

plupiseo1#

  • 斯威夫特4号酒店，纽约**
  1. @IBOutlet var dashedView: UIView!
  3. func drawDottedLine(start p0: CGPoint, end p1: CGPoint, view: UIView) {
  4.     let shapeLayer = CAShapeLayer()
  5.     shapeLayer.strokeColor = UIColor.lightGray.cgColor
  6.     shapeLayer.lineWidth = 1
  7.     shapeLayer.lineDashPattern = [7, 3] // 7 is the length of dash, 3 is length of the gap.
  9.     let path = CGMutablePath()
  10.     path.addLines(between: [p0, p1])
  11.     shapeLayer.path = path
  12.     view.layer.addSublayer(shapeLayer)
  13. }

字符串

调用函数

  1. drawDottedLine(start: CGPoint(x: dashedView.bounds.minX, y: dashedView.bounds.minY), end: CGPoint(x: dashedView.bounds.maxX, y: dashedView.bounds.minY), view: dashedView)

型
有了上面的你将有一条直线，你也可以改变点，因为你想，例如，如果你改变端点的y从dashedView.bounds.minY到dashedView.bounds.maxY，你将有对角线。
如果你将在UIView的子类中使用它，你将没有出口，所以你将使用它与self代替。

展开查看全部
赞(0）分享  回复(0）举报  2024-01-05
stszievb

stszievb2#

创建虚线的方法与使用Swift的方法相同，不同的是使用Swift。
以下是使用UIBezierPath的方法：

  1. let  path = UIBezierPath()
  3. let  p0 = CGPoint(x: self.bounds.minX, y: self.bounds.midY)
  4. path.move(to: p0)
  6. let  p1 = CGPoint(x: self.bounds.maxX, y: self.bounds.midY)
  7. path.addLine(to: p1)
  9. let  dashes: [ CGFloat ] = [ 16.0, 32.0 ]
  10. path.setLineDash(dashes, count: dashes.count, phase: 0.0)
  12. path.lineWidth = 8.0
  13. path.lineCapStyle = .butt
  14. UIColor.magenta.set()
  15. path.stroke()

字符串
以下是如何使用UIBezierPath绘制虚线：

  1. let  path = UIBezierPath()
  3. let  p0 = CGPointMake(CGRectGetMinX(self.bounds), CGRectGetMidY(self.bounds))
  4. path.moveToPoint(p0)
  6. let  p1 = CGPointMake(CGRectGetMaxX(self.bounds), CGRectGetMidY(self.bounds))
  7. path.addLineToPoint(p1)
  9. let  dashes: [ CGFloat ] = [ 0.0, 16.0 ]
  10. path.setLineDash(dashes, count: dashes.count, phase: 0.0)
  11. path.lineWidth = 8.0
  12. path.lineCapStyle = .Round
  13. UIColor.magentaColor().set()
  14. path.stroke()

型
以下是如何使用CGContext绘制虚线：

  1. let  context: CGContext = UIGraphicsGetCurrentContext()!
  3. let  p0 = CGPointMake(CGRectGetMinX(self.bounds), CGRectGetMidY(self.bounds))
  4. CGContextMoveToPoint(context, p0.x, p0.y)
  6. let  p1 = CGPointMake(CGRectGetMaxX(self.bounds), CGRectGetMidY(self.bounds))
  7. CGContextAddLineToPoint(context, p1.x, p1.y)
  9. let  dashes: [ CGFloat ] = [ 16.0, 32.0 ]
  10. CGContextSetLineDash(context, 0.0, dashes, dashes.count)
  12. CGContextSetLineWidth(context, 8.0)
  13. CGContextSetLineCap(context, .Butt)
  14. UIColor.blueColor().set()
  15. CGContextStrokePath(context)

型

展开查看全部
赞(0）分享  回复(0）举报  2024-01-05
xwbd5t1u

xwbd5t1u3#

通过使用继承自UIView的自定义类，也支持故事板。

你所需要做的就是在故事板中创建一个视图，为这个视图分配类，然后看看故事板中的魔力。

  1. @IBDesignable
  2. class DashedLineView : UIView {
  3.     @IBInspectable var perDashLength: CGFloat = 2.0
  4.     @IBInspectable var spaceBetweenDash: CGFloat = 2.0
  5.     @IBInspectable var dashColor: UIColor = UIColor.lightGray
  7.     override func draw(_ rect: CGRect) {
  8.         super.draw(rect)
  9.         let  path = UIBezierPath()
  10.         if height > width {
  11.             let  p0 = CGPoint(x: self.bounds.midX, y: self.bounds.minY)
  12.             path.move(to: p0)
  14.             let  p1 = CGPoint(x: self.bounds.midX, y: self.bounds.maxY)
  15.             path.addLine(to: p1)
  16.             path.lineWidth = width
  18.         } else {
  19.             let  p0 = CGPoint(x: self.bounds.minX, y: self.bounds.midY)
  20.             path.move(to: p0)
  22.             let  p1 = CGPoint(x: self.bounds.maxX, y: self.bounds.midY)
  23.             path.addLine(to: p1)
  24.             path.lineWidth = height
  25.         }
  27.         let  dashes: [ CGFloat ] = [ perDashLength, spaceBetweenDash ]
  28.         path.setLineDash(dashes, count: dashes.count, phase: 0.0)
  30.         path.lineCapStyle = .butt
  31.         dashColor.set()
  32.         path.stroke()
  33.     }
  35.     private var width : CGFloat {
  36.         return self.bounds.width
  37.     }
  39.     private var height : CGFloat {
  40.         return self.bounds.height
  41.     }
  42. }

字符串

展开查看全部
赞(0）分享  回复(0）举报  2024-01-05
fbcarpbf

fbcarpbf4#

这里有一个易于使用的UIView，它画了一条虚线。
我接受了@Fan Jin的回答，并创建了一个UIView子类，它应该可以很好地与Auto Layout一起工作。

Swift 5.3，Xcode 12

  1. import UIKit
  3. public class DashedView: UIView {
  5.     public struct Configuration {
  6.         public var color: UIColor
  7.         public var dashLength: CGFloat
  8.         public var dashGap: CGFloat
  10.         public init(
  11.             color: UIColor,
  12.             dashLength: CGFloat,
  13.             dashGap: CGFloat) {
  14.             self.color = color
  15.             self.dashLength = dashLength
  16.             self.dashGap = dashGap
  17.         }
  19.         static let `default`: Self = .init(
  20.             color: .lightGray,
  21.             dashLength: 7,
  22.             dashGap: 3)
  23.     }
  25.     // MARK: - Properties
  27.     /// Override to customize height
  28.     public class var lineHeight: CGFloat { 1.0 }
  30.     override public var intrinsicContentSize: CGSize {
  31.         CGSize(width: UIView.noIntrinsicMetric, height: Self.lineHeight)
  32.     }
  34.     public final var config: Configuration = .default {
  35.         didSet {
  36.             drawDottedLine()
  37.         }
  38.     }
  40.     private var dashedLayer: CAShapeLayer?
  42.     // MARK: - Life Cycle
  44.     override public func layoutSubviews() {
  45.         super.layoutSubviews()
  47.         // We only redraw the dashes if the width has changed.
  48.         guard bounds.width != dashedLayer?.frame.width else { return }
  50.         drawDottedLine()
  51.     }
  53.     // MARK: - Drawing
  55.     private func drawDottedLine() {
  56.         if dashedLayer != nil {
  57.             dashedLayer?.removeFromSuperlayer()
  58.         }
  60.         dashedLayer = drawDottedLine(
  61.             start: bounds.origin,
  62.             end: CGPoint(x: bounds.width, y: bounds.origin.y),
  63.             config: config)
  64.     }
  66. }
  68. // Thanks to: https://stackoverflow.com/a/49305154/4802021
  69. private extension DashedView {
  70.     func drawDottedLine(
  71.         start: CGPoint,
  72.         end: CGPoint,
  73.         config: Configuration) -> CAShapeLayer {
  74.         let shapeLayer = CAShapeLayer()
  75.         shapeLayer.strokeColor = config.color.cgColor
  76.         shapeLayer.lineWidth = Self.lineHeight
  77.         shapeLayer.lineDashPattern = [config.dashLength as NSNumber, config.dashGap as NSNumber]
  79.         let path = CGMutablePath()
  80.         path.addLines(between: [start, end])
  81.         shapeLayer.path = path
  82.         layer.addSublayer(shapeLayer)
  84.         return shapeLayer
  85.     }
  86. }

字符串

展开查看全部
赞(0）分享  回复(0）举报  2024-01-05
hwazgwia

hwazgwia5#

我的扩展方法是从@FanJins的答案构建的

  1. extension UIView {
  3.     func createDashedLine(from point1: CGPoint, to point2: CGPoint, color: UIColor, strokeLength: NSNumber, gapLength: NSNumber, width: CGFloat) {
  4.         let shapeLayer = CAShapeLayer()
  6.         shapeLayer.strokeColor = color.cgColor
  7.         shapeLayer.lineWidth = width
  8.         shapeLayer.lineDashPattern = [strokeLength, gapLength]
  10.         let path = CGMutablePath()
  11.         path.addLines(between: [point1, point2])
  12.         shapeLayer.path = path
  13.         layer.addSublayer(shapeLayer)
  14.     }
  15. }

字符串
然后调用方法看起来像这样：

  1. let topPoint = CGPoint(x: view.frame.midX, y: view.bounds.minY)
  2. let bottomPoint = CGPoint(x: view.frame.midX, y: view.bounds.maxY)
  4. view.createDashedLine(from: topPoint, to: bottomPoint, color: .black, strokeLength: 4, gapLength: 6, width: 2)

型

展开查看全部
赞(0）分享  回复(0）举报  2024-01-05
i34xakig

i34xakig6#

非常简单的SWIFT 4.2UIView扩展：

  1. extension UIView {
  2.     private static let lineDashPattern: [NSNumber] = [2, 2]
  3.     private static let lineDashWidth: CGFloat = 1.0
  5.     func makeDashedBorderLine() {
  6.         let path = CGMutablePath()
  7.         let shapeLayer = CAShapeLayer()
  8.         shapeLayer.lineWidth = UIView.lineDashWidth
  9.         shapeLayer.strokeColor = UIColor.lightGray.cgColor
  10.         shapeLayer.lineDashPattern = UIView.lineDashPattern
  11.         path.addLines(between: [CGPoint(x: bounds.minX, y: bounds.height/2),
  12.                                 CGPoint(x: bounds.maxX, y: bounds.height/2)])
  13.         shapeLayer.path = path
  14.         layer.addSublayer(shapeLayer)
  15.     }
  16. }

字符串

展开查看全部
赞(0）分享  回复(0）举报  2024-01-05
4c8rllxm

4c8rllxm7#

目标C**

  • @user3230875* 的回答帮助我理解了画虚线需要什么。

所以我希望这个答案可以帮助Obj-C搜索者

  1. //dashed line
  2.     path = [UIBezierPath bezierPath];
  3.     [path moveToPoint:CGPointMake(dashedLineStartX, dashedLineStartY)];
  4.     [path addLineToPoint:CGPointMake(dashedLineEndX, dashedLineEndY)];
  5.     path.lineWidth = 5;
  6.     [color setStroke];
  7.     CGFloat dashes[] = {4.0,8.0};
  8.     [path setLineDash:dashes count:2 phase:0.0];
  9.     path.lineCapStyle = kCGLineCapButt;
  10.     [path stroke];

字符串

展开查看全部
赞(0）分享  回复(0）举报  2024-01-05
ecfsfe2w

ecfsfe2w8#

@clément-cardonnel的回答的修改版本。
通过isVertical选项和IBInspectable属性增强

  1. class DottedLineView : UIView {
  2.         @IBInspectable var perDashLength: CGFloat = 2.0
  3.         @IBInspectable var spaceBetweenDash: CGFloat = 2.0
  4.         @IBInspectable var dashColor: UIColor = UIColor.gray
  5.         @IBInspectable var lineWidth: CGFloat = 2.0
  6.         @IBInspectable var isVertical: Bool = false
  7.         
  8.     private var dashedLayer: CAShapeLayer?
  9.     
  10.     override public func layoutSubviews() {
  11.         super.layoutSubviews()
  12.         
  13.         guard bounds.width != dashedLayer?.frame.width,
  14.               bounds.height != dashedLayer?.frame.height
  15.         else { return }
  16.         
  17.         drawDottedLine()
  18.     }
  19.     
  20.     private func drawDottedLine() {
  21.         if dashedLayer != nil {
  22.             dashedLayer?.removeFromSuperlayer()
  23.         }
  24.         
  25.         var startPoint = CGPoint(
  26.             x: bounds.width / 2 + lineWidth / 2,
  27.             y: 0
  28.         )
  29.         var endPoint = CGPoint(
  30.             x: bounds.width / 2 + lineWidth / 2,
  31.             y: bounds.height
  32.         )
  33.         
  34.         if !isVertical {
  35.             startPoint = CGPoint(
  36.                 x: 0,
  37.                 y: bounds.height / 2 + lineWidth / 2
  38.             )
  39.             endPoint = CGPoint(
  40.                 x: bounds.width,
  41.                 y: bounds.height / 2 + lineWidth / 2
  42.             )
  43.         }
  44.         
  45.         dashedLayer = drawDottedLine(
  46.             startPoint: startPoint,
  47.             endPoint: endPoint
  48.         )
  49.     }
  50.     
  51.     private func drawDottedLine(startPoint: CGPoint, endPoint: CGPoint) -> CAShapeLayer {
  52.         let shapeLayer = CAShapeLayer()
  53.         shapeLayer.strokeColor = dashColor.cgColor
  54.         shapeLayer.lineWidth = self.lineWidth
  55.         shapeLayer.lineDashPattern = [perDashLength as NSNumber, spaceBetweenDash as NSNumber]
  56.         
  57.         let path = CGMutablePath()
  58.         path.addLines(between: [startPoint, endPoint])
  59.         shapeLayer.path = path
  60.         layer.addSublayer(shapeLayer)
  61.         
  62.         return shapeLayer
  63.     }
  64. }

字符串

展开查看全部
赞(0）分享  回复(0）举报  2024-01-05
我来回答

相关问题

    查看更多

    热门标签

    更多
    JavaquerypythonNode开发语言requestUtil数据库Table后端算法LoggerMessageElementParser

    最新问答

    更多
    • 蜀ICP备13028337号-1 大数据知识库 https://www.saoniuhuo.com © All rights reserved
    • 本站内容来源互联网,如果侵犯您的权益请联系我们删除, 联系方式：448109455@qq.com