Swift: UISlider 轨道的一侧没有圆角

Question

我有一个自定义的 UISlider，但是滑块的一侧不是圆的

这是我的自定义视图：

class PrimarySliderView: UISlider {

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

    required init?(coder: NSCoder) {
        super.init(coder: coder)
        setup()
    }

    override func trackRect(forBounds bounds: CGRect) -> CGRect {
        return CGRect(origin: bounds.origin, size: CGSize(width: bounds.width, height: 6))
    }

    func setup() {
        tintColor = .cornFlowerBlue
    }

如何将右侧也圆化？

编辑

由于我的应用程序是 RTL，滑块被切断，当我更改为 LTR 时此显示正确但在 RTL 中不显示，如何解决此问题？

在我的 AppDelegate 中，我强制 RTL：

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
        // Override point for customization after application launch.
        UIView.appearance().semanticContentAttribute = .forceRightToLeft

        return true
    }

Answer 1

试试这个

if(UIApplication.sharedApplication().userInterfaceLayoutDirection == UIUserInterfaceLayoutDirection.RightToLeft)
{
   uiSlider.transform = CGAffineTransformMakeScale(-1.0, 1.0);
}

Answer 2

您是否需要为最小和最大轨道添加圆角图像或者您可以使用颜色创建圆形视图

其他解决方法是

override func layoutSubviews() {
          super.layoutSubviews()

        self.layer.sublayers![1].cornerRadius = 10

    }

Answer 3

这是一个solution/workaround，它与基于this answer的iOS 14一起工作。此外，还对其进行了调整以解决边缘模糊问题。

if UIApplication.shared.userInterfaceLayoutDirection == .rightToLeft {
        setMinimumTrackImage(getImageWithColor(color: .blue, size: frame.size).resizableImage(withCapInsets: UIEdgeInsets(top: 3, left: 3, bottom: 3, right: 3), resizingMode: .stretch), for: .normal)
}

这里是 getImageWithColor 的实现：

private func getImageWithColor(color: UIColor, size: CGSize) -> UIImage {
    
    let layer: CALayer =  CALayer()
    layer.frame = CGRect(x: 0, y: 0, width: size.width, height: size.height)
    layer.masksToBounds = true
    layer.cornerRadius = 3
    layer.backgroundColor = color.cgColor
    
    UIGraphicsBeginImageContextWithOptions(size, false, 0)
    layer.render(in: UIGraphicsGetCurrentContext()!)
    let image: UIImage = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()
    return image
}

注意：不要忘记更改 cornerRadius 和 UIEdgeInsets 以满足您的需要。

应用修复之前：

应用修复后：

Answer 4

iOS14+

版本

final class RoundedSlider: UISlider {
    override func layoutSubviews() {
        super.layoutSubviews()

        if #available(iOS 14.0, *) {
            if let layers = layer.sublayers?.first?.sublayers, layers.count > 0, let layer = layers[1] {
                layer.cornerRadius = layer.bounds.height / 2
            }
        } else {
            if let layers = layer.sublayers, layers.count > 0, let layer = layers[1] {
                layer.cornerRadius = layer.bounds.height / 2
            }
        }
    }
}

Swift: UISlider 轨道的一侧没有圆角

Swift: UISlider one side of track not rounded

uislider

ios

swift