ios – Get dominant coloration from picture in SwiftUI?

For movies, the idea is analogous however requires extracting a body from the video first. You need to use AVAssetImageGenerator to generate a body from a video after which cross it to the dominantColor() perform

To calculate the dominant (common) coloration of a picture, you should use Core Picture’s CIFilter.areaAverage. Beneath is an instance that demonstrates easy methods to obtain this in Swift and combine it with a SwiftUI view. Beneath is an instance extension for UIImage:

import SwiftUI
import CoreImage
import CoreImage.CIFilterBuiltins

extension UIImage {
    func dominantColor() -> UIColor? {
        guard let inputImage = CIImage(picture: self) else { return nil }
        
        let filter = CIFilter.areaAverage()
        filter.inputImage = inputImage
        filter.extent = inputImage.extent // Use CGRect immediately
        
        let context = CIContext()
        guard let outputImage = filter.outputImage else { return nil }
        
        var bitmap = [UInt8](repeating: 0, rely: 4) // RGBA format
        context.render(
            outputImage,
            toBitmap: &bitmap,
            rowBytes: 4,
            bounds: CGRect(x: 0, y: 0, width: 1, top: 1), // 1x1 pixel
            format: .RGBA8,
            colorSpace: CGColorSpaceCreateDeviceRGB()
        )
        
        return UIColor(
            purple: CGFloat(bitmap[0]) / 255.0,
            inexperienced: CGFloat(bitmap[1]) / 255.0,
            blue: CGFloat(bitmap[2]) / 255.0,
            alpha: CGFloat(bitmap[3]) / 255.0
        )
    }
}

That is an instance of easy methods to use the dominantColor() technique dynamically in a SwiftUI view. It showcases a mini-player with a button to replace the dominant coloration primarily based on totally different pictures

struct MiniPlayerView: View {
    @State personal var dominantColor: Colour = .clear
    @State var selectedImg: UIImage? = UIImage(named: "3")
    
    var physique: some View {
        VStack {
            ZStack {
                if let img = selectedImg{
                    Picture(uiImage: img)
                }
                
                HStack {
                    Picture(systemName: "pause.rectangle.fill")
                        .resizable()
                        .aspectRatio(contentMode: .match)
                        .body(width: 100)
                        .foregroundColor(dominantColor.opacity(0.7))
                        .background(Colour.white)
                        .cornerRadius(24.0)
                }
            }
            
            HStack{
                if let img1 = UIImage(named: "1"){
                    Button(motion: {
                        selectedImg = img1
                        if let uiColor = selectedImg?.dominantColor() {
                            dominantColor = Colour(uiColor)
                        }
                    }, label: {
                        Picture(uiImage: img1)
                            .resizable()
                            .body(width: 70, top: 70)
                    })
                }
                
                if let img1 = UIImage(named: "2"){
                    Button(motion: {
                        selectedImg = img1
                        if let uiColor = selectedImg?.dominantColor() {
                            dominantColor = Colour(uiColor)
                        }
                    }, label: {
                        Picture(uiImage: img1)
                            .resizable()
                            .body(width: 70, top: 70)
                    })
                }
                
                if let img1 = UIImage(named: "3"){
                    Button(motion: {
                        selectedImg = img1
                        if let uiColor = selectedImg?.dominantColor() {
                            dominantColor = Colour(uiColor)
                        }
                    }, label: {
                        Picture(uiImage: img1)
                            .resizable()
                            .body(width: 70, top: 70)
                    })
                }
                
                if let img1 = UIImage(named: "4"){
                    Button(motion: {
                        selectedImg = img1
                        if let uiColor = selectedImg?.dominantColor() {
                            dominantColor = Colour(uiColor)
                        }
                    }, label: {
                        Picture(uiImage: img1)
                            .resizable()
                            .body(width: 70, top: 70)
                    })
                }
            }
        }
        .onAppear {
            if let uiColor = selectedImg?.dominantColor() {
                dominantColor = Colour(uiColor)
            }
        }
    }
}