Changed the variables to [String] in the TimelineEntry and I achieved what I want.
I updated my struct and entry line like this:
var newsList: [String] = [] // First, appending the fetched data here
var imageList: [String] = []
struct NewsEntry: TimelineEntry {
var date: Date
let configuration: ConfigurationIntent
let header: [String]
let imageUrl: [String]
}
for index in 0 ..< 5 {
newsList.append(data[index].title!)
imageList.append(data[index].imageUrlDetail!)
}
// Then using passing the arrays to TimelineEntry as [String]
for hourOffset in 0 ..< 5 {
let entryDate = Calendar.current.date(byAdding: .minute, value: hourOffset, to: currentDate)!
let entry = NewsEntry(date: entryDate, configuration: configuration, header: newsList, imageUrl: imageList)
entries.append(entry)
}
The only problem right now is I don't know if I'm using it correctly because I get crash with "Index out of range" on entry.imageUrl[index]. This is the LazyVGrid my updated View function:
LazyVGrid(columns: columns) {
ForEach((0..<4)) { index in
ZStack (alignment: .bottomLeading) {
if let url = URL(string: entry.imageUrl[index]), let imageData = try? Data(contentsOf: url),
let uiImage = UIImage(data: imageData) { // Thread 1: Fatal error: Index out of range
Image(uiImage: uiImage)
.centerCropped()
.frame(maxHeight: 150, alignment: .center)
.cornerRadius(10)
.overlay(RoundedRectangle(cornerRadius: 10)
.stroke(Color.gray, lineWidth: 1))
.shadow(radius: 10)
} else {
Image("ph_background")
.centerCropped()
.frame(maxHeight: 150, alignment: .center)
.cornerRadius(10)
.overlay(RoundedRectangle(cornerRadius: 10)
.stroke(Color.gray, lineWidth: 1))
.shadow(radius: 10)
}
Text(entry.header[index])
.font(.system(size: 12))
.foregroundColor(.white)
.fontWeight(.light)
// .frame(maxHeight: 50)
.background(Rectangle().fill(Color.black).blur(radius: 20))
.padding(.bottom, 5)
.padding(.leading, 5)
.padding(.trailing, 5)
.padding(.top, 5)
}
}
.frame(height: 160)
}
