You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何提取UISlider滑块位置处最小轨道渐变色以同步滑块颜色?

UISlider滑块颜色与渐变轨道同步问题

我希望将UISlider的滑块(thumb)颜色设置为与最小轨道颜色一致,需要提取滑块移动时对应位置的轨道颜色,使滑块颜色随最小轨道的渐变色彩同步变化。

渐变轨道实现代码

func setSlider(slider:UISlider) {
    let tgl = CAGradientLayer()
    let frame = CGRect(x: 0.0, y: 0.0, width: slider.bounds.width, height: 10.0)
    tgl.frame = frame
    tgl.colors = [UIColor.black.cgColor, UIColor.red.cgColor, UIColor.yellow.cgColor, UIColor.green.cgColor]
    tgl.borderWidth = 1.0
    tgl.borderColor = UIColor.gray.cgColor
    tgl.cornerRadius = 5.0
    tgl.endPoint = CGPoint(x: 1.0, y:  1.0)
    tgl.startPoint = CGPoint(x: 0.0, y:  1.0)
    UIGraphicsBeginImageContextWithOptions(tgl.frame.size, false, 10.0)
    tgl.render(in: UIGraphicsGetCurrentContext()!)
    let backgroundImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    slider.setMaximumTrackImage(getBgImage(width: slider.bounds.width), for: .normal)
    slider.setMinimumTrackImage(backgroundImage, for: .normal)
}

尝试提取颜色的代码

let color = sliderRating.minimumTrackImage(for: .normal)?.getPixelColor(point: CGPoint(x: Int(sender.value), y: 1))

func getPixelColor(point: CGPoint) -> UIColor? {
    guard let cgImage = cgImage else { return nil }

    let width = Int(size.width)
    let height = Int(size.height)
    let colorSpace = CGColorSpaceCreateDeviceRGB()

    guard let context = CGContext(data: nil,
                                  width: width,
                                  height: height,
                                  bitsPerComponent: 8,
                                  bytesPerRow: width * 4,
                                  space: colorSpace,
                                  bitmapInfo: CGBitmapInfo.byteOrder32Little.rawValue | CGImageAlphaInfo.premultipliedFirst.rawValue)
    else {
        return nil
    }

    context.draw(cgImage, in: CGRect(origin: .zero, size: size))

    guard let pixelBuffer = context.data else { return nil }

    let pointer = pixelBuffer.bindMemory(to: UInt32.self, capacity: width * height)
    let pixel = pointer[Int(point.y) * width + Int(point.x)]

    let r: CGFloat = CGFloat(red(for: pixel))   / 255
    let g: CGFloat = CGFloat(green(for: pixel)) / 255
    let b: CGFloat = CGFloat(blue(for: pixel))  / 255
    let a: CGFloat = CGFloat(alpha(for: pixel)) / 255

    return UIColor(red: r, green: g, blue: b, alpha: a)
}

private func alpha(for pixelData: UInt32) -> UInt8 {
    return UInt8((pixelData >> 24) & 255)
}

private func red(for pixelData: UInt32) -> UInt8 {
    return UInt8((pixelData >> 16) & 255)
}

private func green(for pixelData: UInt32) -> UInt8 {
    return UInt8((pixelData >> 8) & 255)
}

private func blue(for pixelData: UInt32) -> UInt8 {
    return UInt8((pixelData >> 0) & 255)
}

private func rgba(red: UInt8, green: UInt8, blue: UInt8, alpha: UInt8) -> UInt32 {
    return (UInt32(alpha) << 24) | (UInt32(red) << 16) | (UInt32(green) << 8) | (UInt32(blue) << 0)
}

当前问题

提取到的颜色只有白、灰、深灰色调,而轨道实际是从黑到绿的渐变,当前效果如下:
滑块颜色异常效果1
滑块颜色异常效果2


内容的提问来源于stack exchange,提问作者Shalini

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.07 04:30:20