[iOS, Swift] Slider 양 옆 공간이 남을 때

iOS 15.5, Xcode 13.31, Swift 5, UIKit 환경에서 진행했습니다.

 

Value = 0

Value = 100

 

Slider를 구현함에 있어 양 사이드가 꽉 채워지지 않는 문제가 있었다.

슬라이더의 버튼이 슬라이더의 중앙에, 슬라이더의 버튼이 컸다면 문제가 없었겠지만 디자인 요구사항에 맞춰 개발하다보니

왼쪽 공간하고 오른쪽 공간이 남는 문제가 있었다.

 

import UIKit

class CustomSlider: UISlider {
    
    override func layoutSubviews() {
        super.layoutSubviews()
    }
    
    override func thumbRect(forBounds bounds: CGRect, trackRect rect: CGRect, value: Float) -> CGRect {
        var originalRect = super.thumbRect(forBounds: bounds, trackRect: rect, value: value)
        
        var offsetForValue: CGFloat = 0
        offsetForValue = originalRect.size.width * CGFloat(value / (self.maximumValue - self.minimumValue)) - ((value > 0) ? 20 : 14)

        originalRect.origin.x += offsetForValue
        return CGRect(x: originalRect.origin.x, y: newY, width: originalRect.width, height: originalRect.height)
    }
    
}

 

슬라이더의 Value 값에 따라 thumbRect의 위치를 변화시켜 양 끝에도 슬라이더 버튼이 갈 수 있게끔 수정했다.

 

 

참고 : https://stackoverflow.com/questions/21520940/thumb-image-does-not-move-to-the-edge-of-uislider