Flutter Textfield, необходимо изменить позицию метки Textfield и решить метку всегда показана сфокусированной позиции изAndroid

Форум для тех, кто программирует под Android
Ответить Пред. темаСлед. тема
Anonymous
 Flutter Textfield, необходимо изменить позицию метки Textfield и решить метку всегда показана сфокусированной позиции из

Сообщение Anonymous »

Я пытаюсь создать идеальное дизайн в пикселях в Flutter, который включает в себя текстовое поле. Дизайн требует, чтобы этикетка ведет себя так: < /p>
  • Когда текстовое поле не сфокусировано и пустоте позиция).
мне нужно:
Мне нужно спроектировать Pixel-Perfect UI в соответствии с дизайном ниже:
prcy./pr> prc = "/https://i.sstatic.net/otv555rva. /> Но в настоящее время у меня есть это:

Проблема:
affiebe widester (например, как кантри -код. Из -за этого этикетка ведет себя так, как будто текстовое поле всегда сосредоточено - она ​​всегда отображается в своем плавающем положении, даже когда поле не сфокусировано или не заполнено.TextField(
keyboardType: TextInputType.phone,
scrollPadding: EdgeInsets.zero,
decoration: InputDecoration(
floatingLabelBehavior: FloatingLabelBehavior.always,
label: Text(
'Phone number',
style: TextStyle(
color: AppColors.secondaryTextColor,
fontSize: 12,
fontWeight: FontWeight.w500,
),
),
errorText: showError ? formState['phoneError'] : null,
errorMaxLines: 2,
errorStyle: const TextStyle(fontSize: 12),

// Content Padding
contentPadding:
const EdgeInsets.symmetric(vertical: 16, horizontal: 12),

// Prefix for country code
prefix: IntrinsicHeight(
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
CountryCodePicker(
onChanged: (country) {
formNotifier.updateCountryCode(
country.dialCode ?? '+91', country.name ?? 'India');
},
textStyle: const TextStyle(
fontSize: 16,
color: AppColors.primaryTextColor,
fontWeight: FontWeight.w600,
),
initialSelection: formState['countryCode'],
favorite: const ['IN', 'BD', 'US'],
showFlag: false,
showDropDownButton: true,
alignLeft: false,
padding: EdgeInsets.zero,
flagWidth: 24,
builder: (country) => Row(
mainAxisSize: MainAxisSize.min,
children: [
Text(
country?.dialCode ?? '+91',
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
),
),
Gap(8),
],
),
),
const VerticalDivider(
thickness: 1,
width: 1,
color: AppColors.defaultBorderColor,
),
const SizedBox(width: 8),
],
),
),

// Suffix Icons for validation
suffixIcon: showError
? const Icon(Icons.close, color: Colors.red)
: isValid
? const Icon(Icons.check, color: Colors.green)
: null,

// Borders
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide:
const BorderSide(color: AppColors.defaultBorderColor),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(
color: AppColors.darkBackgroundColor, width: 2),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide:
const BorderSide(color: AppColors.defaultBorderColor),
),
errorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(color: Colors.red, width: 1.5),
),
focusedErrorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(color: Colors.red, width: 2),
),
),
onChanged: (value) => formNotifier.updateField('phone', value),
)


Подробнее здесь: https://stackoverflow.com/questions/796 ... abel-being
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «Android»