Text Fields - Jetpack Compose

Подписаться 84 тыс.

Просмотров 35 тыс.

50% 1

🏆 My Online Courses
⭐Discount Coupon: LAUNCH-STEVDZA-SAN
stevdza-san.com
🐱‍👤 Wanna become a member? Join!
/ @stevdzasan
📸 Instagram
/ stevdza_san
In this video I'm going to show you how to add a Material Design input field called TextField. This predefined composable function contains many parameters which we can customize by ourselves. Also in this video I haven't mentioned one quite popular property called 'placeholder' which you can use to display a hint to your input field. And at the end of the video I'm going to show you a Basic TextField, which is just a simple and basic input field but without many additional design elements which Material Design TextField has to offer. Anyhow watch the video to learn more about it!
⌚Timestamps
0:00 - Introduction
0:32 - Explore TextField
1:51 - Preview TextInput
2:49 - Text State
4:54 - Enable/Disable TextField
5:20 - Read Only TextField
6:15 - Label
6:41 - Single/Multiple Lines
7:41 - Max Lines
8:16 - Start/Leading Icon
9:08 - End/Trailing Icon
9:54 - Keyboard Options
11:27 - Keyboard Actions
12:52 - Outlined TextField
13:20 - Basic TextField
14:36 - Conclusion

Опубликовано:

5 июл 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 42

@zachyang1041 3 месяца назад

Love it when you show us different text field in the end of this video.

@zepra2133 Год назад

awesome, always deep and understandable explanation 👏

@brigadir5830 Год назад

Спасибо за отличный курс. Всего вам хорошего.❤❤❤

@heshamabdo6024 Год назад

great video contains a lot of information, thank you

@hadjsaidaoumer3058 5 месяцев назад

Thank yooooooooooou the best one 👌👌👌👌👌👌👌👌👌👌

@zayka5640 7 месяцев назад

Thank you ❤

@ericgacoki2225 3 года назад

Nice one! Likes for this Guy!...ooookay!

@sedasavas7017 Год назад

thank you sooooooooooo muchhhhhhh

@siarheisudakou4455 2 года назад

Stefan, thanks a lot!

@StevdzaSan 2 года назад

You're welcome 👊

@arctic9016 Год назад

Hi, how can we disable bottom line of the text when textfield has focus, not the indicator ?

@Channel-kn3zq 2 года назад

@lutherevangelista605 Год назад

new subscriber!

@mustafaammar551 2 года назад

Very cool video thank you bro

@StevdzaSan 2 года назад

Happy to help 🙌

@dalaeddine4894 2 года назад

Thank you . keep going

@StevdzaSan 2 года назад

Damn right! 👊

@peterfraga4023 2 года назад

Hi Professor, I fun Greeting() { Column(modifier = Modifier .fillMaxSize(), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center ) { // error on this line (value = text, = { -> //Error on TextField as well as onValueChange, newText also... = //Error here also... }) } } Can you help please... Is there an option or import I am missing.

@kartikagarwal1795 2 года назад

How to remove initial default padding before content in Text Field with XML it easy, how to achieve in Jetpack. ?

@hackersparadise Год назад

I've a textfield in dialog that I am opening through compose navigation but whenever I try to type anything into it It erases that.

@anmolsinghsahi7991 Год назад

How to display hint in BasicTextField, stefan?

@adarshtechstore Год назад

can You Provide Login Page It Include Validation in Text Field?

@mohammadamirkanjoori138 Год назад

nice

@rafaeldeazeredo3770 2 года назад

I started learning today the Jetpack Compose, how do you save the TextField typed value when you rotate the screen?

@rafaeldeazeredo3770 2 года назад

I don't know if this is the best way but it worked I've changed this line: var text by remember { mutableStateOf("") } to: var text by rememberSaveable { mutableStateOf("") }

@StevdzaSan 2 года назад

Yep that's one way. You can also hoist the state in a ViewModel.

@wojciechmierzejewski7048 Год назад

how do you get search bar in Logcat?

@abada-s 2 года назад

I hope to add video how to migrate from xml to compose

@moforemmanuel158 2 года назад

does this have a github repo

@qusaiatoon2802 3 года назад

Is it better to manage text fiealds with Viewmodel or is that too much work for a simple thing ??

@StevdzaSan 3 года назад

Yes state hoisting to view model is a preferred way.

@qusaiatoon2802 3 года назад

@@StevdzaSan Ok, but do I make a ViewModel for every textFieald in my Application, Or should I put it in the viewModel that manages the usecase that the textField is involved in?

@StevdzaSan 3 года назад

@@qusaiatoon2802 You can make a View Model per one screen of yours.

@qusaiatoon2802 3 года назад

@@StevdzaSan Thanks for replying You are a great developer And Teacher ❤

@hassanharera 2 года назад

Very nice, I think it's better to make the android studio theme high contrast for better see

@aminelhag 2 года назад

Thank to You Stevdza-san ( ﾉﾟｰﾟ)ﾉ Keep Going

@geoffreyengatkinson 2 года назад

Column( modifier = Modifier .fillMaxSize(), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center ) { val text = remember { mutableStateOf(TextFieldValue("Text")) } OutlinedTextField(value = text.value, onValueChange = { text.value = it }, label = { Text("Test") }) }

@siva_subramaniam Год назад

bm: 11:27

@testwhwhja 3 года назад

why did't use xml for the design

@allanandliftedhands2669 2 года назад

Jetpack compose has now replaced xml

@andreray1795 Год назад

background color don't work in textField

@poultrydiseaseandtreatmentapp 6 месяцев назад

colors = TextFieldDefaults.colors( focusedTextColor = Color.Black, unfocusedTextColor = Color.Gray, focusedContainerColor = Color.White, unfocusedContainerColor = Color.White, focusedIndicatorColor = Color.Blue, unfocusedIndicatorColor = Color.Blue, focusedLabelColor = Color.Gray, unfocusedLabelColor = Color.Gray, cursorColor = Color.Black, ) .