App Widgets are greyed out on home screen only

Question

I am making an app using storyboards and adding Widgets to it later. I get greyed out widgets on home screen.

It looks fine when opening in widgets drawer.

Here is my widget UI code

ZStack {
        Image(affirmationBGImage)
            .resizable()
            .scaledToFill()
            .edgesIgnoringSafeArea(.all)
        HStack {
            Spacer(minLength: 5)
            HStack {
                Text(affirmationText)
                    .font(.headline)
                    .foregroundColor(.black)
            }
            .background(Color.white.opacity(0.2))
            .cornerRadius(5)
            Spacer(minLength: 5)
        }
        .padding(0)
    }

Also this is my timeline class code

import WidgetKit
import SwiftUI
import Intents

struct Provider: IntentTimelineProvider {
    func placeholder(in context: Context) -> SimpleEntry {
        SimpleEntry(date: Date(), affirmationDetails: AffirmationWidgetDetails.random(), configuration: ConfigurationIntent())
    }
    
    func getSnapshot(for configuration: ConfigurationIntent, in context: Context, completion: @escaping (SimpleEntry) -> ()) {
        let entry = SimpleEntry(date: Date(), affirmationDetails: AffirmationWidgetDetails.random(), configuration: configuration)
        completion(entry)
    }
    
    func getTimeline(for configuration: ConfigurationIntent, in context: Context, completion: @escaping (Timeline<Entry>) -> ()) {
        var entries: [SimpleEntry] = []
        
        // Generate a timeline consisting of five entries an hour apart, starting from the current date.
        let currentDate = Date().zeroSeconds
        for hourOffset in 0 ..< 60 {
            let entryDate = Calendar.current.date(byAdding: .minute, value: hourOffset, to: currentDate!)!
            let entry = SimpleEntry(date: entryDate, affirmationDetails: AffirmationWidgetDetails.random(), configuration: configuration)
            entries.append(entry)
        }
        
        let timeline = Timeline(entries: entries, policy: .atEnd)
        completion(timeline)
    }
}

struct SimpleEntry: TimelineEntry {
    let date: Date
    let affirmationDetails: AffirmationWidgetDetails
    let configuration: ConfigurationIntent
}

struct AffirmationWidgetEntryView: View {
    
    var entry: Provider.Entry
    
    var body: some View {
        AffirmationWidgetView(affirmationDetails: entry.affirmationDetails)
    }
    
}

@main
struct AffirmationWidget: Widget {
    let kind: String = "AffirmationWidget"
    
    var body: some WidgetConfiguration {
        IntentConfiguration(
            kind: kind,
            intent: ConfigurationIntent.self,
            provider: Provider()
        ) { entry in
            AffirmationWidgetEntryView(entry: entry)
        }
        .configurationDisplayName("Random Affirmation")
        .description("Displays a widget with an affirmation")
        .supportedFamilies([.systemLarge, .systemMedium, .systemSmall])
    }
}

struct AffirmationWidget_Previews: PreviewProvider {
    static var previews: some View {
        AffirmationWidgetEntryView(entry: SimpleEntry(date: Date(), affirmationDetails: AffirmationWidgetDetails.random(), configuration: ConfigurationIntent()))
            .previewContext(WidgetPreviewContext(family: .systemSmall))
    }
}

So my question is how can I fix this issue so that it appears correctly on home screen just as it shows on Widget drawer?

NOTE It works fine on simulator but not on devices for some reason.

Answer 1

Allowed memory to a widget is limited and I reduced the size of image files that I was using and it is working fine now.