# List Viewer (Visionneuse de liste) (relecture en cours)
## Vue d'ensemble
* [Ajouter des éléments à une visionneuse de liste](/thunkable/components/user-interface/list-viewer.md#add-items-to-a-list-viewer)
* [Sélectionnez un élément dans une visionneuse de liste](/thunkable/components/user-interface/list-viewer.md#select-item-from-a-list-viewer)
* [Style de la visionneuse de liste](/thunkable/components/user-interface/list-viewer.md#style-the-list-viewer)
* [Modifier la hauteur de la visionneuse de liste](/thunkable/components/user-interface/list-viewer.md#edit-the-listviewer-height)
* [Ajouter un espacement](/thunkable/components/user-interface/list-viewer.md#add-spacing)
## 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
Pour les listes plus longues, nous recommandons d'utiliser le composant [Tableur ](/thunkable/components/untitled-3/airtable.md)(SpreadSheet)
### Longue liste
## Sélectionner un élément à partir d'une visionneuse de liste
| Propriété | Description |
| --------- | ----------------------------------------------------------------------------------------- |
| ItemClick | Renvoie une valeur`item`et un numéro d'`index`numé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.
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://bastien-dosreis.gitbook.io/thunkable/components/user-interface/list-viewer.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.