Coil's AsyncImage will try to perform a network request to load your image in the Preview - but it will always fail because network access is disabled in the preview environment. This leaves you with a white space for your AsyncImage in the Preview.
Having functioning Previews saves time and reduces the cognitive load of constantly switching between your app and the Preview. This is especially useful if you’re building heterogenous layouts - as the presence of the image can influence how the content is laid out in your Column / LazyColumn.
So how can this be fixed? 🤔
AsyncImagePreviewHandler to the rescue! 🚀
It doesn’t load an image, but it allows you to show a “FakeImage” with a certain color which is still good enough for previewing your layout. This makes it easier to fine-tune your layout without having to run the app repeatedly.
Have you faced this issue with AsyncImage previews? How did you handle it?
Comments