How to handle parameters and use @PreviewParameter in Jetpack Compose

The article aims to show how to handle parameters of compose functions and use @PreviewParameter in Jetpack Compose UI. For any concerns about the article, contact me here. 🤝

I create a basic Android application with only Jetpack Compose in this article. This app includes a basic card design which includes text, image and button. It does not contain any network request, complex UI or business logic.

Table of contents:

1. Compose Design with Traditional Way (If you know compose, you can skip this part.)
2. Management of parameters of compose functions in Jetpack Compose
3. @PreviewParameter approach in Compose Preview
4. References

Note: Table of contents may not show bonus parts 🎁

Now, we can start to create a basic card with some components. In addition, we need to create this card for common usages. For example, app uses this card component for informing users about different kind errors. Firstly, we should see screenshot of the app.