[解決済み] ビューコントローラからプログラム的に線を引くには？

質問

私は UIViewController . プログラムで作成されたビューに線を引くにはどうしたらよいでしょうか？

どのように解決するのですか？

一般的な方法は2つあります。

1. 使用方法 CAShapeLayer :

   • を作成します。 UIBezierPath (を作成します（座標は好きなものに置き換えてください）。

     UIBezierPath *path = [UIBezierPath bezierPath];
     [path moveToPoint:CGPointMake(10.0, 10.0)];
     [path addLineToPoint:CGPointMake(100.0, 100.0)];
     
     

   • を作成します。 CAShapeLayer を作成し、その UIBezierPath :

     CAShapeLayer *shapeLayer = [CAShapeLayer layer];
     shapeLayer.path = [path CGPath];
     shapeLayer.strokeColor = [[UIColor blueColor] CGColor];
     shapeLayer.lineWidth = 3.0;
     shapeLayer.fillColor = [[UIColor clearColor] CGColor];
     
     

   • 追加する CAShapeLayer をビューのレイヤーに追加します。

     [self.view.layer addSublayer:shapeLayer];
     
     

   Xcode の以前のバージョンでは、手動で QuartzCore.framework をプロジェクトの "Link Binary with Libraries" に追加してください。 をインポートし <QuartzCore/QuartzCore.h> ヘッダーをインポートする必要がありますが、これはもう必要ありません ("Enable Modules" と "Link Frameworks Automatically" ビルド設定をオンにしている場合)。

2. もう一つの方法は、サブクラス UIView をサブクラス化し コアグラフィックス の呼び出しを drawRect メソッドを呼び出します。

   • を作成します。 UIView サブクラスを作成し drawRect を定義し、線を引く。

     Core Graphicsでできます。

     - (void)drawRect:(CGRect)rect {
         CGContextRef context = UIGraphicsGetCurrentContext();
     
         CGContextSetStrokeColorWithColor(context, [[UIColor blueColor] CGColor]);
         CGContextSetLineWidth(context, 3.0);
         CGContextMoveToPoint(context, 10.0, 10.0);
         CGContextAddLineToPoint(context, 100.0, 100.0);
         CGContextDrawPath(context, kCGPathStroke);
     }
     
     

     あるいは UIKit :

     - (void)drawRect:(CGRect)rect {
         UIBezierPath *path = [UIBezierPath bezierPath];
         [path moveToPoint:CGPointMake(10.0, 10.0)];
         [path addLineToPoint:CGPointMake(100.0, 100.0)];
         path.lineWidth = 3;
         [[UIColor blueColor] setStroke];
         [path stroke];
     }
     
     

   • 次に、このビュークラスを NIB/ストーリーボードやビューのベースクラスとして使用するか、ビューコントローラにサブビューとしてプログラム的に追加させることができます。

     PathView *pathView = [[PathView alloc] initWithFrame:self.view.bounds];
     pathView.backgroundColor = [UIColor clearColor];
     
     [self.view addSubview: pathView];
     
     

上記の2つのアプローチのSwiftでの表現は以下の通りです。

1. CAShapeLayer :

   // create path
   
   let path = UIBezierPath()
   path.move(to: CGPoint(x: 10, y: 10))
   path.addLine(to: CGPoint(x: 100, y: 100))
   
   // Create a `CAShapeLayer` that uses that `UIBezierPath`:
   
   let shapeLayer = CAShapeLayer()
   shapeLayer.path = path.cgPath
   shapeLayer.strokeColor = UIColor.blue.cgColor
   shapeLayer.fillColor = UIColor.clear.cgColor
   shapeLayer.lineWidth = 3
   
   // Add that `CAShapeLayer` to your view's layer:
   
   view.layer.addSublayer(shapeLayer)
   
   

2. UIView のサブクラスです。

   class PathView: UIView {
   
       var path: UIBezierPath?           { didSet { setNeedsDisplay() } }
       var pathColor: UIColor = .blue    { didSet { setNeedsDisplay() } }
   
       override func draw(_ rect: CGRect) {
           // stroke the path
   
           pathColor.setStroke()
           path?.stroke()
       }
   
   }
   
   

   そして、それをビューの階層に追加します。

   let pathView = PathView()
   pathView.translatesAutoresizingMaskIntoConstraints = false
   view.addSubview(pathView)
   
   NSLayoutConstraint.activate([
       pathView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
       pathView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
       pathView.topAnchor.constraint(equalTo: view.topAnchor),
       pathView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
   ])
   
   pathView.backgroundColor = .clear
   
   let path = UIBezierPath()
   path.move(to: CGPoint(x: 10, y: 10))
   path.addLine(to: CGPoint(x: 100, y: 100))
   path.lineWidth = 3
   
   pathView.path = path
   
   

   上では PathView を追加していますが、IB で追加することもできます。 path を設定するだけです。