Thunkable FR
  • 👋 Bienvenue dans Thunkable
  • 👶Pour Commencer
    • S'inscrire
    • Votre page de projets Thunkable
    • Tutoriels
    • L'application Thunkable Live
  • 🆕Créer un nouveau projet
    • Modifier les paramètres du projet
    • Actifs et taille des projets
    • Exemples de projets Thunkable
    • Galerie publique des projets
  • 🛠️ Composants
    • 🔘Interface Utilisateur
      • Button (Bouton)
      • Label (Etiquette)
      • Text Input (Saisie de texte)
      • List Viewer (Visionneuse de liste) (relecture en cours)
      • Web Viewer (Visionneuse Web)
      • Switch (commutateur)
      • Slider (curseur)
      • Alert (Alerte)
      • Loading Icon (Chargement de l'icône)
      • Date Input (Saisie de la date)
      • Time Input (Saisie du temps)
      • PDF Reader (Lecteur de PDF)
      • Rating (Classement)
      • 📊Data Viewers (Visualiseurs de données)
        • Data Viewer List (Liste de visualisation de données)
        • Data Viewer Grid (Grille de visualisation des données)
        • Custom Data Viewer Layout (Disposition personnalisée du visualiseur de données)
    • 📐Mise en page
      • Top Tab Navigator (Onglet supérieur Navigateur)
      • Bottom Tab Navigator (Onglet de navigation inférieur)
      • Stack Navigator (Navigateur à pile)
      • Drawer Navigator (Navigateur à tiroir)
      • Screen (Ecran)
      • Row (Ligne)
      • Column (Colonne)
    • 🔊Voix
      • Sound (Son)
      • Audio Recorder (Enregistreur Audio)
      • Text to Speech (Texte au discours)
      • Speech Recognizer (Reconnaissance de discours)
      • Assistant by Dialogflow (Assistant par Dialogflow)
      • Translator by Yandex (Traducteur par Yandex)
    • 📷 Image
      • Image
      • Photo Library (Photothèque)
      • Camera (Appareil photo)
      • Barcode Scanner (Lecteur de codes-barres)
      • Image Recognizer (Reconnaissance d'image)
      • Animation by Lottie (Animation par Lottie)
      • Video (Vidéo)
      • Video Recorder (Enregistreur vidéo)
    • 🗄️ Stockage des Données
      • Local Storage (Stockage local)
      • LocalDB (base de données locale)
      • Airtable
      • Media DB par Cloudinary
      • RealtimeDB par Firebase
      • Web API (API Web)
      • Smart Contract by Oasis (Contrat intelligent par Oasis)
      • Blockchain Wallet by Oasis (Portefeuille Blockchain par Oasis)
    • 🌍Localisation
      • Maps By Google and Apple (Cartes de Google et Apple)
      • Location Sensor (Capteur de localisation)
    • ⏲️ Capteurs
      • Timer
      • Accéléromètre
      • Gyroscope
      • Magnétomètre
      • Bluetooth Low Energie
    • ✉️ Authentification
      • Email Sign In by Firebase (Connexion au courrier électronique par Firebase)
    • 🤝Social
      • Share (Partager)
      • Notifications Push par One Signal
    • 💲Monétisation
      • Ads by Admob (Annonces par AdMob)
    • 🎮Gaming
      • Canvas (toile)
      • Sprites
      • Canvas Label
  • 🤖Blocs
    • Control (Contrôle)
    • Logic (Logique)
    • Math
    • Text (Texte)
    • Lists (Listes)
    • Color (Couleur)
    • Objects (Objets)
    • Device (Appareil)
    • Variables
    • Functions (Fonctions)
    • "Any Component" Blocks (Blocs "Généraliste")
    • Data Sources
    • 🤖🎮Gaming Blocks (en cours)
      • Events (événements)
      • Motion (Mouvement)
      • Looks (Apparence)
      • Direction
      • Sensing (Détection)
      • Add & Remove (Ajouter et Supprimer)
      • Stage (Scène)
      • Canvas Label (Etiquette de la Toile)
  • Post-Developpement
    • 🖥️ Emulateurs et test de l'application (en cours)
    • 🔒Confidentialité des données de l'application
    • 🔗Blockchain & Data Privacy
    • ➕Faire une Copie
    • 📥Téléchargement
    • 📤Partager
    • 📱Publication
      • Publier dans l'App Store (iOS)
      • Publier sur Play Store (Android)
      • Publier en tant qu'application Web (PRO)
    • Générer des captures d'écran
    • 🔎Résolution des problèmes
      • Problèmes de connexion
      • FAQs
    • 📏Introduction à l'espacement
    • 🖼️ Introduction au dimensionnement
    • 🔤Polices
    • 💾Gérer le stockage
    • 📝Bugs et demandes de fonctionnalités
  • Non-Officiel (à faire)
    • Google, Facebook and Github Sign In/Up (à faire)
    • 4 Keys To Designing A Great Mobile App
Powered by GitBook
On this page
  • Vue d'ensemble
  • Ajouter des éléments à une visionneuse de liste
  • Petite Liste
  • Liste Moyenne
  • Longue liste
  • Sélectionner un élément à partir d'une visionneuse de liste
  • Style de la visionneuse de liste
  • Modifier la hauteur de la visionneuse de liste
  • Ajouter un espacement

Was this helpful?

  1. 🛠️ Composants
  2. Interface Utilisateur

List Viewer (Visionneuse de liste) (relecture en cours)

Le composant List Viewer vous permet d'ajouter, de visualiser et de cliquer sur les éléments d'une liste.

PreviousText Input (Saisie de texte)NextWeb Viewer (Visionneuse Web)

Last updated 3 years ago

Was this helpful?

Vue d'ensemble

Ajouter des éléments à une visionneuse de liste

Petite Liste

Nous recommandons d'ajouter une courte liste d'éléments dans l'application elle-même lorsque l'écran démarre. Bien que le bloc liste lui-même puisse gérer un grand nombre d'éléments, en pratique, vous ne souhaiterez probablement utiliser cette approche que si votre projet comporte des dizaines d'éléments.

Liste Moyenne

Longue liste

Sélectionner un élément à partir d'une visionneuse de liste

Propriété

Description

ItemClick

Renvoie une valeuritemet un numéro d'indexnumérique lorsqu'un article est sélectionné

Style de la visionneuse de liste

Vous pouvez personnaliser le composant List Viewer avec les propriétés suivantes :

  • Show Arrow: Pour voir une flèche à côté de chaque élément de la liste, réglez le commutateur sur "True"

  • Visible: Pour voir le texte saisi dans votre application, réglez le commutateur sur "True"

  • Border

    • Width: Indiquez la largeur de la bordure du composant List Viewer que vous souhaitez

    • Color: Choisissez une couleur pour la bordure du composant List Viewer

    • Style: Choisissez si vous souhaitez que la bordure soit en pointillés, en tirets ou en traits pleins

    • Radius: Indiquez le tour que vous souhaitez donner aux bords de la bordure pour le composant List Viewer

  • Background Colour (Advanced): Définit la couleur de fond du composant List Viewer

Modifier la hauteur de la visionneuse de liste

Le composant List Viewer remplit automatiquement 100% de la largeur de l'écran

Vous pouvez définir la hauteur du composant List Viewer en utilisant la propriété de hauteur.

Height

  • Fill container - Le composant List Viewer remplit tout l'écran verticalement

  • Fit contents - La hauteur du composant List Viewer change pour s'adapter au contenu qu'il contient

  • Relative size - Le composant List Viewer remplit le pourcentage spécifié de l'écran

  • Absolute size - Dimensionne le composant List Viewer à un nombre de pixels déterminé

Ajouter un espacement

Vous modifiez l'espacement et le positionnement du composant List Viewer avec les propriétés Margin (Marge) et Padding (Remplissage).

Margin

  • Vous pouvez spécifier l'espace que vous souhaitez entre la bordure et le contenu du composant List Viewer en utilisant des valeurs en pixels ou en pourcentage.

Padding

  • Vous pouvez spécifier l'espace que vous souhaitez entre les bords du composant List Viewer et l'écran en utilisant des valeurs en pixels ou en pourcentage.

Pour les listes plus longues, nous recommandons d'utiliser le composant (SpreadSheet)

🔘
Tableur
Ajouter des éléments à une visionneuse de liste
Sélectionnez un élément dans une visionneuse de liste
Style de la visionneuse de liste
Modifier la hauteur de la visionneuse de liste
Ajouter un espacement