Swift를 이용하여 CoreGraphics 이미지 만들기(기본)[비고]

9096 단어 SwiftiOS

Swift로 CoreGraphics 이미지를 만듭니다.


코어그래픽스는 UIImageView와 UIImage 등 기존 이미지 처리를 사용한 것이 아니라 오리지널 그래픽 등을 그릴 때 활용할 수 있는 프레임을 그렸다.
UIImage 등지에는 XXX가 있습니다.그림 보이기, 확대, 회전jpg 등 파일을 표시할 수 있으며, 이 그림들을 합성하고 편집할 때 사용하면 매우 편리합니다.
UIView에 직접 그림을 쓰는 등 원래는 다양한 사용법이 있었지만, 코어그래픽에 그려진 이미지를 UIImage로 응용에서 활용하겠다는 생각에만 집중해 확인했다.

CoreGraphics를 이용하여 그리는 기본 절차


여기서 CoreGraphics에서 그린 이미지를 UIImage 변수에 대입하기 전의 단계를 고려합니다.
  • 그래픽 컨텍스트 작성
  • 드로잉 설정(색상 및 크기 등)
  • 그릴 도형 정보 만들기(경로와 결합하여 도형 만들기)
  • 도면 그리기(생성된 경로를 기반으로 도면 그리기)
  • 그래픽 컨텍스트의 정보를 UIImage
  • 로 가져오기
    기본적으로 이런 절차에 따라 그려진다.그래프가 복잡해지면 3, 4단계가 추가됩니다.

    CoreGraphics의 기본 코드 그리기


    선 이미지를 만드는 코드는 다음과 같습니다.

    swift
    //1.グラフィックスコンテキストをサイズ指定
    UIGraphicsBeginImageContext(CGSizeMake(300, 300))
    //1.グラフィックスコンテキストを取得
    let context:CGContextRef = UIGraphicsGetCurrentContext()
    
    //2.描画用の設定(図形の線の太さを設定)
    CGContextSetLineWidth(context, 2.0)
    //2.描画用の設定(図形の線の色を設定)
    let color:CGColorRef = UIColor.redColor().CGColor
    CGContextSetStrokeColorWithColor(context, color)
    
    //3.パスを作成
    CGContextMoveToPoint(context, 50, 50)
    CGContextAddLineToPoint(context, 250, 250)
    
    //4.パスを閉じる
    CGContextClosePath(context)
    //4.パスで指定した図形を描画
    CGContextStrokePath(context)
    
    //5.UIImageの取得
    let img:CGImageRef = CGBitmapContextCreateImage(context)
    self.imageView.image = UIImage(CGImage: img)
    

    코드의 보충 설명


    도면 컨텍스트 작성


    swift
    //1.グラフィックスコンテキストをサイズ指定
    UIGraphicsBeginImageContext(CGSizeMake(300, 300))
    //1.グラフィックスコンテキストを取得
    let context:CGContextRef = UIGraphicsGetCurrentContext()
    
    이 섹션에서는 스토리지에서 작성할 그래픽 컨텍스트의 크기를 지정합니다.
    CoreGraphics에 사용되는 많은 함수에는 CGContextRef(그래픽 컨텍스트 참조) 변수가 필요합니다.이번에는 화면 밖으로 보이지 않는 메모리에 새로운 영역을 만들어 그렸지만, drawInRect 방법에서 그리면 사이즈를 지정할 필요가 없을 것 같다.
    이번 코드는 최종적으로 이곳에서 제작된 사이즈(300300)의 UIImage를 제작할 예정이다.

    드로잉 설정(색상 및 크기 등)


    swift
    //2.描画用の設定(図形の線の太さを設定)
    CGContextSetLineWidth(context, 2.0)
    //2.描画用の設定(図形の線の色を設定)
    let color:CGColorRef = UIColor.redColor().CGColor
    CGContextSetStrokeColorWithColor(context, color)
    
    이 섹션에서는 그래픽 선의 두께와 색상을 설정합니다.색상과 관련해서는 UIView에서 사용하는 UIColor를 직접 사용할 수 없으며 CGColor라는 색상 체계를 사용해야 합니다.UIColor는 CGColor 값을 읽어들일 등록 정보를 준비하기 때문에 기본적으로 다음과 같은 형식으로 CGColor를 가져올 수 있습니다.
    swift
    UIColor.redColor().CGColor    //... CGColorのredColorとなる
    UIColor.clearColor().CGColor  //... CGColorのclearColor(透過色)となる
    
    //RGB値を組み合わせて色を指定
    UIColor(red: 0.9, green: 0.1, blue: 0.1, alpha: 1).CGColor
    

    도면 작성


    swift
    //3.パスを作成
    CGContextMoveToPoint(context, 50, 50)
    CGContextAddLineToPoint(context, 250, 250)
    
    선을 그릴 때 차례대로 좌표를 지정합니다.CGContext MoveToPoint를 통해 시작점을 결정하고 CGContextAddLine ToPoint를 지정할 때마다 경로를 연속으로 설정합니다.
    드로잉 경로에 사용되는 함수에는 다음과 같은 함수가 있습니다.
    CGContextAddLineToPoint ... 직선을 긋다
    CGContextAddRect ... 사각형 그리기(사각형에서 사각형)
    CGContextAddEllipseInRect ... 원 그리기(사각형에 내접된 원 그리기)
    CGContextAddCurveToPoint ... 커브 그리기
    또한 UIBezierPath를 사용하여 베젤 커브 등을 표시할 수도 있습니다.
    【참고: 베셀 곡선(UIBezierPath)】
    http://atmarkplant.com/uibezierpath/

    드로잉 그리기


    swift
    //4.パスを閉じる
    CGContextClosePath(context)
    //4.パスで指定した図形を描画
    CGContextStrokePath(context)
    
    드로잉을 그릴 때 생성된 경로에 대한 정보를 닫습니다.그런 다음 경로 정보를 기반으로 그립니다.또 그림을 그리는 데는 두 가지 방법이 있다.
    CGContextStrokePath ... 밑줄(밑줄만 긋는 경우)
    CGContextFillPath ... 경로가 덮어쓰는 영역 채우기
    CGContext FillPath를 사용하여 채우려면 색상을 설정할 때 CGCo n textSetFill Color 함수를 사용하여 채우기 색상을 지정해야 합니다.

    UIImage로 가져오기


    swift
    
    //5.UIImageの取得
    let img:CGImageRef = CGBitmapContextCreateImage(context)
    self.imageView.image = UIImage(CGImage: img)
    
    마지막으로 그래픽 컨텍스트의 이미지 정보를 기반으로 UIImage 객체를 작성하여 화면에 표시합니다.

    좋은 웹페이지 즐겨찾기