How to fix the Jetpack Compose Preview Error:ViewModels creation is not supported
<p>When you create complex enough Views in Jetpack Compose, you reach the point when you need to couple the View with an IO operation controller. One of the standard solutions for that that I prefer, for now, is the MVVM pattern and the HiltViewModel.</p>
<p>Usually, when a view appears on the screen (during the LaunchedEffect), it calls the <strong>init</strong> or <strong>load</strong> method of the ViewModel that interacts with a repository and network. When data is ready, the ViewModel updates the ui state, and Compose framework re-composes the View.</p>
<p>The root Composable function that represents the screen has to keep the reference to the ViewModel, and when you try to build a preview for this view/screen, you get the Android Studio error:<em> “ViewModels creation is not supported”.</em></p>
<p>Full Error Message in the Issue Panel:</p>
<blockquote>
<p><strong>This preview uses a ViewModel. ViewModels often trigger operations not supported by Compose Preview, such as database access, I/O operations, or network requests. You can read more about preview limitations in our external documentation.</strong></p>
</blockquote>
<p>Well, without further ado, the solution is to implement the whole UI in the second-level composable function and keep the reference to the ViewModel in the root (top-level) composable function only.<br />
Then, use in the Preview, the second-level function that accepts only unwrapped state variables on which the nested UI depends and the lambdas to hoist the interactions with the ViewModel to the top. Of course, you can split this second-level function into as many units as you need to keep the blocks as simple as possible.</p>
<p><a href="https://levelup.gitconnected.com/one-of-the-ways-to-fix-the-jetpack-compose-preview-error-viewmodels-creation-is-not-supported-62826674e474">Click Here</a></p>