In a new Android Compose project using material3, I'm trying to set focusedLabelColor
of OutlinedTextField
as follows but it didn't work unless setting color on Text
.
OutlinedTextField(
label = { Text("Label") },
colors = OutlinedTextFieldDefaults.colors(
focusedLabelColor = Color.Blue,
focusedTextColor = Color.Red
),
value = "",
onValueChange = {}
)
I tired setting colors for TextField
and it didn't work, either.
In a new Android Compose project using material3, I'm trying to set focusedLabelColor
of OutlinedTextField
as follows but it didn't work unless setting color on Text
.
OutlinedTextField(
label = { Text("Label") },
colors = OutlinedTextFieldDefaults.colors(
focusedLabelColor = Color.Blue,
focusedTextColor = Color.Red
),
value = "",
onValueChange = {}
)
I tired setting colors for TextField
and it didn't work, either.
- According to the source code, the label has 4 parameters to set the text color disabledLabelColor, errorLabelColor, focusedLabelColor, unfocusedLabelColor. I think you need unfocusedLabelColor so that the label color is the right color before the keyboard comes up and starts entering data into the OutlinedTextField. In the source code labelColor and textColor do not affect each other. – dmortal Commented Jan 11 at 7:24
- @dmortal: What does this have to do with the question asked? – tyg Commented Jan 11 at 10:25
- @tyg I'm using composeBom version 2024.12.01 (material3 1.3.1) and I don't reproduce this bug, also on version 2024.01.00 (1.1.2), so I thought in the other direction. – dmortal Commented Jan 11 at 11:41
2 Answers
Reset to default 1After discovering through testing that setting text colors in the typography
of MaterialTheme
would invalidate LocalContentColor
, I removed them as shown in the following code. As a result, not only does LocalContentColor
work properly now, but the colors parameter of TextField
also functions correctly.
If you set colors on Typography
, these colors from styles already bound to certain parts of Material components, such as TextField
, will take precedence over the colors parameter of TextField
or LocalContentColor
MaterialTheme(
colorScheme = colorScheme,
typography = Typography(
bodyMedium = TextStyle(
color = Color.Black // removed
),
// ...
),
content = content
)
This seems to be a bug that is fixed in version 1.4.0
of Compose Material 3.
At the time of writing that version is still in alpha. If you don't want to wait for the stable version to be releaseed you can change from the stable Compose BOM androidxpose:compose-bom
to the newest alpha BOM androidxpose:compose-bom-alpha
(version 2024.12.01
at the time of writing) to use the alpha version of Compose instead.