Ajouter des composants à une page d'application Kis

Ajouter des composants

Kis fonctionne sur un système de containers au sein desquels vous pouvez intégrer un large choix de composants.

Concrètement, vous pouvez séparer votre page en autant de sections que vous voulez pour placer les composants selon vos préférences.

Quel que soit le nombre de containers par ligne, Kis est responsive et s’adapte au support sur lequel il est visualisé : ordinateur, smartphone ou tablette.

1. Ajouter un container

Dans une nouvelle page, un container vide est toujours disponible par défaut.

Vous pouvez en ajouter autant que vous le souhaitez en cliquant sur le symbole "+" juste en dessous.

2. Ajouter un composant

Dans la rubrique Composants, choisissez l'élément de votre choix et faites-le simplement glisser-déposer ans le container vide. Votre composant est prêt à être édité !

Pensez bien à enregistrer dès que vous ajouter un nouveau composant dans votre page.

Votre page n'est pas gravée dans le marbre. À n'importe quel moment, vous pouvez ajouter, déplacer ou supprimer des lignes de containers sans perdre tous vos composants.

3. Redimensionner et déplacer le composant

Pour harmoniser et personnaliser votre page, vous pouvez redimensionner certains éléments.

Sélectionner un composant : il doit être entouré d'un cadre vert en pointillés.

Positionne le curseur sur le bord droit ou gauche du cadre et redimensionnez le composant comme vous le souhaitez.

Il est possible d'intégrer plusieurs composants au sein d'un même container. Vous devez glisser-déposer le deuxième élément à l'une des extrémités du composant déjà en place, symbolisées par une barre verte.

Également, vous pouvez décider librement de l'ordre des containers et des composants, et les déplacer dans la page.

Il suffit de cliquer sur le symbole des 6 boutons, en haut à gauche de votre container ou de votre composant, de rester appuyé et de le déplacer où vous le souhaitez.

Les containers (cadres gris) peuvent être placés au-dessus ou en dessous d'un autre container.

Les composants, dans un cadre vert après les avoir sélectionnés, peuvent être placés indifféremment au-dessus, en-dessous ou à côté d'un composant déjà intégré dans un container.

5. Configurer la source de données

Sélectionnez le composant pour ouvrir son panneau de configuration, puis choisissez la liste ou la source de données qui doit l'alimenter.

Le composant apparaît sur la page et affiche les données de la source choisie.

Vous pouvez ajouter d'autres composants de la même façon pour construire une page complète.

En cas de problème : Si un composant semble vide après l'avoir déposé, vérifiez qu'une source de données a bien été sélectionnée dans son panneau de configuration.

6. Modifier le wording

Personnalisez les titres et noms de vos composants pour que votre application Kis parle le même langage métier que vous.

Pour modifier le wording, sélectionnez le composant et, dans le cadre Titre, nommez votre élément comme vous le souhaitez.

Certains composants disposent même d'un cadre Sous-titre pour apporter davantage de précisions.

Détails des composants

Kis propose un large choix de composants qui permettent aux utilisateurs de personnaliser leurs applications en fonction de leurs besoins.

Voici la liste de tous les composants que vous pouvez intégrer dans vos applications, avec un aperçu rapide de leur utilité.

Retrouvez un tuto détaillé et illustré pour chaque élément dans notre rubrique Composants, en bas de page.

Graphiques et visualisation

Intégrez des éléments graphiques dans votre application pour visualiser toutes vos données très simplement :

Ajouter des composants à une page d'application