From the arrival of Jetpack Compose, developer can store and access color values in 2 ways.
i. Color.kt – Modern approach.
ii. XML – Traditional approach.
both methods are acceptable in jetpack compose.
but which one is better ?
It actually depends on the scenario.
i. For New Jetpack Compose projects
Here, Its better to store colors in Color.kt because its more efficient than resolving xml resources by id. Additionally it provides type safety and IDE can automatically suggest colors.
Using this approach, we can assign different color for light and dark theme. If you are making a multiplatform project. recommended to use this approach.
You can easily found the file in app/src/main/java/com/userName/packagename/ui/theme/Color.kt
val Colors.topAppBarBackgroundColor: Color @Composable get() = if(isSystemInDarkTheme()) Color.Black else Color.White
- Above code, just implementing dark and light theme based on the isSystemInDarkTheme() method.
ii. Projects with XML + Jetpack compose
In this situation, you can store color values in colors.xml file. So both views and composable can easily access from a central location.
For implementing Dark theme, you can make use of night mode of colors.xml.
Colors.xml file can be found in app/src/main/res/values/colors.xml.
val appBarBackgroundColor = colorResource(R.color.topAppBarBackgroundColor)
Summmary
Users can still store color values in both files. However for Jetpack Compose, the preferred approach is storing color values in Color.kt file which make IDE to suggest and assures type safety. But if you are working on a project with both Jetpack Compose and XML, you can store values in colors.xml as the traditional way.
Whatever it is, try to store all color code in one file for easy access and maintenance.