شما میتوانید بر اساس دکمهی فعال/غیرفعال کردن رمز عبور، یک آیکون برای مخفی کردن یا نمایش آن ایجاد کنید تا امنیت و تجربهی کاربری بهبود یابد.
نتایج
سازگاری نسخه
این پیادهسازی مستلزم آن است که minSDK پروژه شما روی سطح API 21 یا بالاتر تنظیم شده باشد.
وابستگیها
نمایش یا پنهان کردن رمز عبور بر اساس تغییر وضعیت کاربر
برای نمایش یا پنهان کردن رمز عبور بر اساس دکمهی تغییر وضعیت کاربر، یک فیلد ورودی برای وارد کردن اطلاعات ایجاد کنید و از یک آیکون قابل کلیک برای دکمهی تغییر وضعیت استفاده کنید:
@Composable fun PasswordTextField() { val state = remember { TextFieldState() } var showPassword by remember { mutableStateOf(false) } BasicSecureTextField( state = state, textObfuscationMode = if (showPassword) { TextObfuscationMode.Visible } else { TextObfuscationMode.RevealLastTyped }, modifier = Modifier .fillMaxWidth() .padding(6.dp) .border(1.dp, Color.LightGray, RoundedCornerShape(6.dp)) .padding(6.dp), decorator = { innerTextField -> Box(modifier = Modifier.fillMaxWidth()) { Box( modifier = Modifier .align(Alignment.CenterStart) .padding(start = 16.dp, end = 48.dp) ) { innerTextField() } Icon( if (showPassword) { Icons.Filled.Visibility } else { Icons.Filled.VisibilityOff }, contentDescription = "Toggle password visibility", modifier = Modifier .align(Alignment.CenterEnd) .requiredSize(48.dp).padding(16.dp) .clickable { showPassword = !showPassword } ) } } ) }
نکات کلیدی در مورد کد
- وضعیت نمایش رمز عبور را در
showPasswordحفظ میکند. - از یک
BasicSecureTextFieldقابل ترکیب برای ورود رمز عبور استفاده میکند. - یک آیکون انتهایی قابل کلیک دارد که مقدار
showPasswordرا تغییر میدهد. - ویژگی
textObfuscationModeو وضعیت قابل مشاهده/غیرقابل مشاهده بودن آیکون انتهایی را با استفاده از وضعیتshowPasswordتعریف میکند.
مجموعههایی که حاوی این راهنما هستند
این راهنما بخشی از این مجموعههای راهنمای سریعِ برگزیده است که اهداف گستردهتر توسعه اندروید را پوشش میدهد:

نمایش متن
