둥근 진행 트랙 가장자리가있는 UIProgressView - Swift 3

Question

UIProgressView가 있는데 채워진 부분 (진행 부분)에 대한 반경을 지정하려는 경우 cornerRadius 속성을 사용하여 진행 뷰의 모서리를 반올림 할 수 있습니다. 채워진 진행 가장자리가 둥글게되기를 원합니다. 진행 막대가 지금 어떻게 보이는지 아래에서 찾으십시오.

난 적색 부분의 에지가 둥글게 할.

둥근 모서리가있는 이미지로 progressImage를 설정하려고했지만 문제가 해결되는 동안 이미지 자체가 멀리 늘어나고 모퉁이의 반경이 유지되지 않습니다.

내가 시도한 다른 것은 직사각형을 그려서 진행 색상으로 채우고 다음 코드로 UIImage로 변환하고 진행률로 설정 한 이미지입니다.이 경우 이미지는 항상 검정색이나 확실하지 않습니다 내가 무엇을 놓치고 있는지. 있는 UIView

class func imageWithView(view: UIView) -> UIImage { 
    UIGraphicsBeginImageContextWithOptions(view.bounds.size, view.isOpaque, 0.0) 
    view.drawHierarchy(in: view.bounds, afterScreenUpdates: true) 
    let img = UIGraphicsGetImageFromCurrentImageContext() 
    UIGraphicsEndImageContext() 
    return img! 
} 

Answer 1

이 질문에있는 UIImage로 변환에 대한 코드를 검색하면 몇 개월,하지만 난이 같은 의심을 가지고 있기 때문에, 나는 내가 찾은 답을 공유하고자합니다. UIProgressView를 직접 수정하여이 작업을 수행 할 수있는 방법을 찾지 못했습니다. 가장 쉬운 방법은보기를 진행 막대처럼 보이도록 사용자 정의하는 것입니다. 이 질문에 UMAIR 아프의 내 대답을 기반 : https://stackoverflow.com/a/41373525/1775356 그것은 내 요구에 맞게 수정 약간의 그것은 또한 내가 진행 색조의 색상과 같은 색상을 사용하고

import Foundation 

import UIKit 

class CustomHorizontalProgressView: UIView { 
    var color: UIColor = UIColor.red 
    var progress: CGFloat = 0.0 { 

     didSet { 
      setNeedsDisplay() 
     } 
    } 

    override init(frame: CGRect) { 
     super.init(frame: frame) 

     setup() 
    } 

    required init?(coder aDecoder: NSCoder) { 
     super.init(coder: aDecoder) 

     setup() 
    } 

    func setup() { 
     self.backgroundColor = color.withAlphaComponent(0.4) 
    } 

    override func draw(_ rect: CGRect) { 
     super.draw(rect) 

     var progress = self.progress 
     progress = progress > 1.0 ? progress/100 : progress 

     self.layer.cornerRadius = self.frame.height/2.0 

     let margin: CGFloat = 0 
     var width = (self.frame.width - margin) * progress 
     let height = self.frame.height - margin 

     if (width < height) { 
      width = height 
     } 

     let pathRef = UIBezierPath(roundedRect: CGRect(x: margin/2.0, y: margin/2.0, width: width, height: height), cornerRadius: height/2.0) 

     color.setFill() 
     pathRef.fill() 

     UIColor.clear.setStroke() 
     pathRef.stroke() 

     pathRef.close()    
    } 
} 

스위프트 3. 업데이트됩니다 배경색의 알파 40 %. 다른 배경색을 선택하면 쉽게 변경할 수 있습니다. 기록을 위해 외부 둥근 모서리가 IB에 추가되었습니다. 이는 프로그래밍 방식으로도 수행 할 수 있습니다. 다음과 같이 보입니다 :