how would you go about using color resources in a seperate compose function from main-CodePudding

I have this code where i try to reach the resources in my app specifically the resources within colors. I am using Jetpack compose and have made a Filelayout that i think is pretty good. So i have a folder called components where i put my components that i will use more then once. So i built a component that i called Applogo basically and wanted to reach the colors i had set up within the resources. I have no clue why i cant reach R.colors though... I have commented out where i wanna reach the resources. i tried to use

color = colorResource(R.color.LogoColor)

this did not work though

@Composable
    fun PaperSellerLogo(){
        val color = Color()
        Surface(modifier = Modifier
            .padding(15.dp)
            .width(400.dp)
            .height(120.dp),
            shape = RectangleShape,
            color = // this is where i wanna reach colorResource
            border = BorderStroke(width = 2.dp, color = Color.Black)
        ) {
            Column(modifier = Modifier.padding(1.dp),
            horizontalAlignment = Alignment.CenterHorizontally,
            verticalArrangement = Arrangement.Center) {
                Text(text = "Paper-Seller", style = MaterialTheme.typography.h3, color = Color.White.copy(alpha = 0.5f))
                Spacer(modifier = Modifier.height(15.dp))
                Text(text = "Your fellow paper selling customer tool")
                
    
            }
    
        }
}

CodePudding user response：

Maybe you have a wrong R import because colorResouce(id = R.color.yourColor) is correct. Anyway try this, in the proyect package, in ui.theme package is the file Color.kt, in this file you can create color variables and call them in all the proyect like a global variable. For example:

In Color.kt :

val myCustomColor = Color(0xFFFFFFFF) //White color

In your class or file:

(...)
Surface(modifier = Modifier
            .padding(15.dp)
            .width(400.dp)
            .height(120.dp),
            shape = RectangleShape,
            color = myCustomColor
            border = BorderStroke(width = 2.dp, color = Color.Black)
        )
(...)

CodePudding user response：

If used in jetpack compose

XML:

<color name="LogoColor">#FFBB86FC</color>

Kotlin:

import androidx.compose.ui.graphics.Color
val LogoColor = Color(0xFFBB86FC)

In your class or file:

Surface(modifier = Modifier
                .padding(15.dp)
                .width(400.dp)
                .height(120.dp),
                shape = RectangleShape,
                color = LogoColor
                border = BorderStroke(width = 2.dp, color = Color.Black)
        )