WebImage doesn't always resize to its frame with ForEach inside List

ykaito21 commented 3 years ago

I use WebImage with ForEach inside List, but it doesn't always work well. First case works with ios 13, but not with ios 14; other cases don't work with ios 13 but work with ios 14.

Is there any possible solution?, or is there any problem with my implementation?

First Case:

var body: some View {
        return List {
            ForEach(0..<10, id: \.self) { message in
                WebImage(url: URL(string: "https://i.pinimg.com/736x/50/df/34/50df34b9e93f30269853b96b09c37e3b.jpg"))
                    .resizable()
                    .placeholder {
                        Rectangle().foregroundColor(.lightGray)
                    }
                    .indicator(.activity)
                    .aspectRatio(contentMode: .fit)
                    .frame(width: 260)
                    .background(Color.red)
                    .frame(width: 260)
            }
        }
    }

Second Case:

   var body: some View {
        let messageList = some my own list
        return List {
            ForEach(0..<messageList.count, id: \.self) { message in
                WebImage(url: URL(string: "https://i.pinimg.com/736x/50/df/34/50df34b9e93f30269853b96b09c37e3b.jpg"))
                    .resizable()
                    .placeholder {
                        Rectangle().foregroundColor(.lightGray)
                    }
                    .indicator(.activity)
                    .aspectRatio(contentMode: .fit)
                    .frame(width: 260)
                    .background(Color.red)
                    .frame(width: 260)
            }
        }
    }

Third Case:

   var body: some View {
        let messageList = some my own list
        return List {
            ForEach(messageList) { message in
                WebImage(url: URL(string: "https://i.pinimg.com/736x/50/df/34/50df34b9e93f30269853b96b09c37e3b.jpg"))
                    .resizable()
                    .placeholder {
                        Rectangle().foregroundColor(.lightGray)
                    }
                    .indicator(.activity)
                    .aspectRatio(contentMode: .fit)
                    .frame(width: 260)
                    .background(Color.red)
                    .frame(width: 260)
            }
        }
    }

ios 13 Result:

ios 14 Result:

atharvsharma1998 commented 3 years ago

im also facing this issue. images do not resize to the frame defined inside forEach.

dreampiggy commented 3 years ago

Sorry for delay. SwiftUI integration has some inconsistent behavior because of Apple's SwiftUI internal changes. This is a pain for both developer and community.

Maintain different code path for iOS 13/iOS 14, as well as watchOS 6/7, apply patch for Apple, will make this library too complicated.

I'll decide to remove iOS 13 support in next big version, which only considerate the iOS 14's behavior. Also, fix this issue.

mboiman commented 3 years ago

I I think I have the same problem, when I fill the picture in a ForEach. The Picture looks good, but the non seen part of the pictures goes over the Frame and blocks the possibility to click buttons from another picture