1
votes

Comment agrandir ces points de mot de passe dans obscureText

Regardez cette image ci-dessous.

Je souhaite agrandir les points du mot de passe.

J'ai essayé TextStyle fontSize.

Cela a agrandi ces points.

Mais cela rendra aussi la ligne de mot de passe plus haute.

Ce n'est pas ce que je veux.

Existe-t-il des solutions?

ListView(
          children: <Widget>[
            TextField(
              controller: _usernameController,
              textAlign: TextAlign.center,
            ),
            TextField(
              controller: _passwordController,
              textAlign: TextAlign.center,
              obscureText: true,
            ),
          ],
        ),

flutter dart

2 commentaires

pouvez-vous ajouter votre code?

donc augmenter la taille de la police ne fonctionne pas pour vous, non?

4 Réponses :

1
votes

Utilisez la propriété decoration de votre TextField et définissez contentPadding sur zéro.

     TextField(
                textAlign: TextAlign.center,
                obscureText: true,
                controller: _passwordController,
                style: TextStyle(fontSize: 30),
                scrollPadding: EdgeInsets.zero,
                decoration: InputDecoration(
                  contentPadding: EdgeInsets.zero,
                ),
              ),

1 commentaires

Désolé, je n'ai pas été clair. Ce sont des points de mot de passe.

0
votes

Pensez à utiliser TextFormField https: // docs .flutter.io / flutter / material / TextFormField / TextFormField.html

Il est également suggéré dans la documentation Flutter. Voir https://docs.flutter.io/flutter/material/TextField-class .html

Pour intégrer TextField dans un formulaire avec d'autres widgets FormField, pensez à utiliser TextFormField.

Ici, vous pouvez définir le TextStyle pour la taille de votre choix.

3 commentaires

OP a mentionné qu'il utilisait TextStyle , non seulement cela augmentait la taille des points, mais aussi la taille de TextField / TextFormField .

@CopsOnRoad OP a modifié la question pour résoudre ce problème.

OK, cela a du sens :) Mais avez-vous essayé cela par vous-même avant de l'écrire comme réponse?

0
votes

Il existe plusieurs façons de résoudre ce problème. Vous pouvez utiliser TextStyle , augmenter la fontSize puis ajuster la height qui ajuste la hauteur de la ligne.

Ce n'est pas une bonne solution car si un utilisateur veut voir l'entrée de caractères la plus récente comme ceci ••••• ord alors la police de votre mot de passe sera différente du reste le formulaire.

Flutter, lors de l'obscurcissement, entre simplement le caractère • comme masque. Ce caractère est différent pour chaque police et il est donc probablement préférable de choisir simplement une police différente.

Cela étant dit, vous pourriez probablement changer la taille de ce personnage spécifique, mais cela impliquerait de modifier le SDK Flutter à un niveau profond, ce qui n'est pas quelque chose qui est généralement recommandé.

Au lieu de cela, je pense que la meilleure solution serait de modifier la police elle-même pour que le caractère • s'affiche comme vous le souhaitez! Ou simplement créer votre propre widget obscurcissant!

0 commentaires

3
votes

Passez au canal maître (exécutez flutter channel master puis flutter upgrade ). Après cela, vous pouvez personnaliser avec le paramètre obscuringCharacter dans TextField .

0 commentaires