Passer au contenu principal

TextArea

Ouvrir dans ChatGPT
Ombre dwc-textarea 24.10
Java API

Le composant TextArea fournit un champ de saisie de texte multi-lignes où les utilisateurs peuvent taper et éditer des blocs de texte plus longs. Il prend en charge des limites de caractères maximales, la structure des paragraphes, le retour à la ligne et des règles de validation pour contrôler la manière dont l'entrée est gérée.

Création d'un TextArea​

Créez un TextArea en passant une étiquette à son constructeur. Des propriétés comme le texte de remplacement, les limites de caractères et le comportement de retour à la ligne peuvent être configurées via des méthodes de réglage.

Afficher le code

Gestion des paragraphes​

Le composant TextArea fournit des fonctionnalités pour gérer les paragraphes de texte, le rendant idéal pour les applications qui nécessitent l'édition de documents ou la saisie de texte structurée.

Voici un exemple rapide de la façon de constituer et de manipuler le contenu des paragraphes :

TextArea textArea = new TextArea();

// Insérer un paragraphe au début
textArea.addParagraph(0, "Ceci est le premier paragraphe.");

// Ajouter un autre paragraphe à la fin
textArea.addParagraph("Voici un deuxième paragraphe.");

// Ajouter du contenu supplémentaire au premier paragraphe
textArea.appendToParagraph(0, " Cette phrase continue la première.");

// Supprimer le deuxième paragraphe
textArea.removeParagraph(1);

// Récupérer et imprimer tous les paragraphes actuels
List<String> paragraphs = textArea.getParagraphs();
for (int i = 0; i < paragraphs.size(); i++) {
  System.out.println("Paragraphe " + i + ": " + paragraphs.get(i));
}

Validation​

Le composant TextArea prend en charge deux types de validation complémentaires : les contraintes structurelles et les contraintes de contenu.

Les contraintes structurelles se concentrent sur la façon dont le texte est organisé et disposé visuellement. Par exemple :

  • setLineCountLimit(int maxLines) limite le nombre de lignes autorisées dans le champ de texte.
  • setParagraphLengthLimit(int maxCharsPerLine) limite le nombre de caractères par paragraphe (ou ligne), aidant à faire respecter les normes de lisibilité ou de formatage.

Les contraintes de contenu, en revanche, traitent de la quantité totale de texte saisie, quel que soit sa distribution :

  • setMaxLength(int maxChars) fixe le nombre maximal de caractères autorisés dans tous les paragraphes.
  • setMinLength(int minChars) impose une longueur minimale, garantissant qu'un contenu suffisant soit fourni.

La démo suivante permet aux utilisateurs d'ajuster les limites de validation—comme le nombre maximal de caractères, la longueur des paragraphes et le nombre de lignes—en temps réel et de voir comment le TextArea réagit.

Afficher le code

Retour à la ligne et renvoi de ligne​

Vous pouvez contrôler si le texte se renvoie ou fait défiler horizontalement en utilisant setLineWrap(). Lorsque le retour à la ligne est désactivé, les lignes continuent horizontalement au-delà de la zone visible, nécessitant un défilement. Lorsqu'il est activé, le texte se renvoie automatiquement à la ligne suivante lorsqu'il atteint le bord du composant.

Pour affiner davantage le comportement du retour à la ligne, setWrapStyle() vous permet de choisir entre deux styles :

  • WORD_BOUNDARIES renvoie le texte à des mots entiers, préservant le flux de lecture naturel.
  • CHARACTER_BOUNDARIES renvoie à des caractères individuels, permettant un contrôle plus strict sur la disposition, en particulier dans des conteneurs étroits ou à largeur fixe.

Ces options de retour à la ligne fonctionnent main dans la main avec des contraintes structurelles comme les limites de nombre de lignes et de longueur de paragraphes. Alors que le retour à la ligne détermine comment le texte s'écoule dans l'espace disponible, les limites structurelles définissent combien d'espace le texte est autorisé à occuper. Ensemble, ils aident à maintenir à la fois la structure visuelle et les limites des entrées utilisateur.

Afficher le code

Texte prédit​

Le composant TextArea prend en charge des suggestions de texte intelligentes pour aider les utilisateurs à taper plus rapidement et avec moins d'erreurs. Lorsque les utilisateurs saisissent du texte, des suggestions prédictives apparaissent en fonction de l'entrée actuelle, leur permettant de compléter des phrases courantes ou attendues.

Les prédictions peuvent être acceptées en appuyant sur la touche Tab ou Flèche droite, insérant le texte suggéré dans le champ de saisie sans effort. Si aucune prédiction appropriée n'est disponible à un moment donné, l'entrée reste inchangée, et l'utilisateur peut continuer à taper sans interruption, garantissant que la fonctionnalité ne soit jamais un obstacle.

Ce comportement prédictif améliore à la fois la rapidité et la précision, en particulier dans les scénarios de saisie répétée ou dans les applications où la cohérence de la formulation est importante.

Afficher le code

info

Cette démo utilise l'API Datamuse pour fournir des suggestions de mots basées sur l'entrée de l'utilisateur. La qualité et la pertinence des prédictions dépendent entièrement de l'ensemble de données et du mécanisme de notation de l'API. Elle n'utilise pas de modèles d'IA ou de modèles de langage de grande taille (LLMs) ; les suggestions sont générées à partir d'un moteur léger basé sur des règles axées sur la similarité lexicale.

État en lecture seule et désactivé​

Le composant TextArea peut être défini comme lecture seule ou désactivé pour contrôler l'interaction de l'utilisateur.

Un champ de texte lecture seule permet aux utilisateurs de visualiser et de sélectionner le contenu, mais pas de l'éditer. Cela est utile pour afficher des informations dynamiques ou pré-remplies qui ne doivent pas être modifiées.

Un champ de texte désactivé, en revanche, bloque toute interaction—y compris le focus et la sélection de texte—et est généralement stylé comme inactif ou grisé.

Utilisez le mode lecture seule lorsque le contenu est pertinent mais immuable, et le mode désactivé lorsque l'entrée n'est pas actuellement applicable ou devrait être temporairement inactive.

Afficher le code

Style​

Loading...