0

I have a Horizontal ScrollView with some Content received from an API. However, when I scroll the Content, after a certain amount of Scrolling, the content shrinks. Is there a way to prevent this? The 2nd Image shows the content Shrinking after scrolling.

Normal View

ScrollView Content Getting Shrunk

My Code is as Follows:

 ScrollView(.horizontal){
                        LazyHStack(alignment:.center, spacing: 5){
                            
                           
                                ForEach(recipe?.extendedIngredients ?? [], id: \.self){ extendedIngredient in
                                    
                                    VStack(spacing:4){
                                        AsyncImage(url: URL(string: "https://spoonacular.com/cdn/ingredients_100x100/" + (extendedIngredient.image ?? "apple.jpg") )) { image in
                                            image
                                                .resizable()
                                                .scaledToFit()
                                                //.frame(width:100, height: 100)
                                        } placeholder: {
                                            ProgressView()
                                                .tint(.gray)
                                        }
                                        
                                        Text(extendedIngredient.name ?? "Unknown")
                                        
                                    }//Inner VStack
                                    
                                
                                }//ForEach
                        }
                        
                      }//Inner ScrollView

Update-- I added a frame modifier with a Height of 150 to the LazyHStack and that seemed to have solved the issue. However, is the the right way to get around this issue?

Amey079
  • 131
  • 7

1 Answers1

-2

There are many ways to solve this problem. As you did, I would suggest you to add a frame modifier but also consider making it with the Height variable (Using a GeometryReader for example) so it won't look weird in other devices.