How do I load cached Image from only pressing the button Once

54 Views Asked by At

I have a problem that I can't seem to resolve, am fairly new to swift programming I don't understand what is happening, why is my cached image loading only when I press the button twice instead of once

@State var openCameraRoll = false
@State private var imageSelected = UIImage()
@State private var showImagePicker = false
@State private var sourceType: UIImagePickerController.SourceType = .photoLibrary
let imageCache = ImageCache.shared

Button(action: {

    openCameraRoll = true
    ImageCache.shared.checkIfImageExistsInCache(forKey: "ProfileImage")
    imageCache.set(imageSelected, forKey: "ProfileImage")
}) {
    if let cachedImage = imageCache.get(forKey: "ProfileImage") {
            Image(uiImage: cachedImage)
                .resizable()
                .aspectRatio(contentMode: .fill)
                .frame(width: 100, height: 100)
                .clipShape(Circle())
                .overlay(
                    Circle()
                        .fill(Color.red)
                        .padding([.top, .leading], 70)
                )
                .overlay(
                    Image(systemName: "plus.circle.fill")
                        .symbolRenderingMode(.palette)
                        .foregroundStyle(.red, .white)
                        .padding([.top, .leading], 70)
                        .font(.system(size: 23))
                )
                .onAppear {
                    print(cachedImage)
                }
    }
    else {
        Image(systemName: "person.circle.fill")
            .resizable()
            .scaledToFit()
            .frame(width: 100, height: 100)
            .foregroundColor(.white)
            .clipShape(Circle())
            .overlay(
                Circle()
                    .fill(Color.red)
                    .padding([.top, .leading], 70)
            )
            .overlay(
                Image(systemName: "plus.circle.fill")
                    .symbolRenderingMode(.palette)
                    .foregroundStyle(.red, .white)
                    .padding([.top, .leading], 70)
                    .font(.system(size: 23))
            )
    }
}
.sheet(isPresented: $showImagePicker) {
    ImagePicker(selectedImage: $imageSelected, sourceType: sourceType)
}
.actionSheet(isPresented: $openCameraRoll) {
    ActionSheet(
        title: Text("Choose Source"),
        buttons: [
            .default(Text("Library")) {
                sourceType = .photoLibrary
                showImagePicker = true
            },
            .default(Text("Camera")) {
                sourceType = .camera
                showImagePicker = true
            },
            .cancel()
        ]
    )
}
class ImageCache {
    static let shared = ImageCache()
    
    private init() {}
    
    func set(_ image: UIImage, forKey key: String) {
        // Convert the image to data
        if let imageData = image.jpegData(compressionQuality: 1.0) {
            // Save the image data to UserDefaults
            UserDefaults.standard.set(imageData, forKey: key)
        }
    }
    func get(forKey key: String) -> UIImage? {
        // Retrieve the image data from UserDefaults
        if let imageData = UserDefaults.standard.data(forKey: key),
           let image = UIImage(data: imageData) {
            return image
        }
        return nil
    }
    func delete(forKey key: String) {
            // Remove the image data from UserDefaults
            UserDefaults.standard.removeObject(forKey: key)
        }
}

here's the link to the video, sorry but I wasn't able to get it below 2mb thanks text

I tried a function that refreshes the app once the image is placed but that didn't work

0

There are 0 best solutions below