Hello everyone I want to show the placeholder in t...

# multiplatform

[Mahvi]

Hello everyone
I want to show the placeholder in the basic text field.
can anyone tell me how to do that?

[Mahvi]

BasicTextField(
            value = value,
            singleLine = singleLine,
            onValueChange = { onChange(it) },
            keyboardOptions = keyboardOptions,
            modifier = Modifier.fillMaxWidth().background(
                brush = Brush.linearGradient(
                    listOf(ColorPalette.White, ColorPalette.White),
                ), shape = RoundedCornerShape(8.dp)

            ).padding(finalPadding),

            )

[Devashish Bala]

basic text field doesn't give placeholder option but you can try making one using decorationBox

this may help
https://stackoverflow.com/questions/75672346/jetpack-compose-basictextfield-placeholder-blocks-getting-a-focus-when-clicked

[Mahvi]

Thank you @Devashish Bala It helped a lot.

Can you also tell me how to user icons in text fields?

[Devashish Bala]

icons can be used normally like this
trailingIcon = {
val image = if (passwordVisible) Icons.Filled.Visibility else Icons.Filled.VisibilityOff
val description =
if (passwordVisible) stringResource(R.string._hide_password_) else stringResource(
R.string._show_password_
)
IconButton(onClick = { passwordVisible = !passwordVisible }) {
Icon(imageVector = image, description)
}
}
and example for password trailing icon in outlined textfield or textfield this option is not available in basic textfield

[Mahvi]

@Devashish Bala then how to acheive this in basic textfield

[Devashish Bala]

ah you know you can achieve it same way as above link

[Mahvi]

I'll try. I'm a very beginner here coming from a react native background. Thanks for your help Sir @Devashish Bala

[Devashish Bala]

BasicTextField(
     modifier = Modifier.height(32.dp),
     //... more arguments
     decorationBox = @Composable {
         TextFieldDefaults.OutlinedTextFieldDecorationBox(
             contentPadding = TextFieldDefaults.textFieldWithoutLabelPadding(
                 top = 0.dp,
                 bottom = 10.dp,
                 start = 12.dp,
                 end = 0.dp
             ),

like this

[Devashish Bala]

oh Welcome, my pleasure i am also kind of a fresher but documentations helps a lot.