Aller au contenu

Code source wiki de Saisie Intuitive

Modifié par Julien EYMERY le 2015/08/31 11:06
Afficher les derniers auteurs
1 (((
2 = Introduction =
3 )))
4
5 Le but de la saisie intuitive est d'offrir à l'utilisateur, pendant qu'il tape des caractères dans un champs de saisie, une vue des valeurs possibles sous forme d'une liste déroulante. [[image:Visual_Saisie_Intuitive_exemple.jpg||data-xwiki-image-style-alignment="center"]]
6 (((
7 = Utilisation =
8 )))
9
10 Pour permettre l'utilisation d'une (% style="color: rgb(51,102,255);" %)**saisie intuitive**(%%), il faut utiliser un objet (% style="color: rgb(51,102,255);" %)**Liste de valeurs**(%%) dont la propriété (% style="color: rgb(51,102,255);" %)**Type**(%%) sera positionnée à la valeur (% style="color: rgb(51,102,255);" %)**Simple**(%%).
11
12 [[image:Visual_Saisie_Intuitive_Lsv_Creation.jpg||data-xwiki-image-style-alignment="center"]]
13 En Initialisation de la fenêtre, pour que l'objet ne présente pas de liste de valeur, on fixera sa hauteur à la hauteur du seul champs de saisie.
14
15
16 {{code language="none"}}
17 /* ___ On ne voit que la partie "Champs de saisie" ____________________________
18 Lsv_Saisie:Hauteur = 20
19
20 {{/code}}
21
22
23 Sur l'événement (% style="color: rgb(51,102,255);" %)**ChangementValeur**(%%) de l'objet (% style="color: rgb(51,102,255);" %)**Liste de valeurs**(%%), on alimente la liste des valeurs possibles en fonction des caractères tapés, puis on ajuste la hauteur de la liste en fonction du nombre d'éléments à afficher.
24 Si on veut que la liste ait une hauteur maximale il faudra veiller à ce qu'elle ne la dépasse pas :
25
26
27 {{code language="none"}}
28 /* ___ Alimentation de la liste avec les valeurs correspondant à ______________
29 /* ___ la saisie effectuée ____________________________________________________
30
31 Vider_Lst Lsv_Saisie:liste 
32 Lecture_Lst lst_Mois 
33    Si elt_mois Commence_Par Lsv_Saisie:valeur 
34       Lsv_Saisie:valeur_courante = elt_mois 
35       Inserer_Elt Lsv_Saisie:liste 
36    Fin 
37 Fin_Lecture_Lst 
38
39 /* ___ On ajuste la hauteur de la liste de valeurs en fonction ________________
40 /* ___ du nombre d'éléments à afficher dans la liste __________________________
41
42 Lsv_Saisie:hauteur = 20 + &nbr_elt(Lsv_Saisie:liste)* 15 
43 Si &Nbr_Elt(Lsv_Saisie:liste) >= 1 
44    Lsv_Saisie:hauteur = Lsv_Saisie:hauteur + 5 
45 Fin 
46
47 /* ___ On veut que la liste ait une hauteur maximale __________________________
48
49 Si  Lsv_Saisie:hauteur > 150
50   Lsv_Saisie:hauteur = 150
51 Fin
52
53 {{/code}}
54
55
56 Sur l'événement (% style="color: rgb(0,102,255);" %)**GainFocus**(%%) de l'objet (% style="color: rgb(0,102,255);" %)**Liste de va**(%%)(% style="color: rgb(51,102,255);" %)**leur**(%%)(% style="color: rgb(0,102,255);" %)**s**(%%), (% style="color: rgb(0,0,0);" %)on ajuste(%%) la hauteur de la liste de valeurs en fonction du nombre d'éléments à afficher.
57 Si on veut que la liste ait une hauteur maximale il faudra veiller à ce qu'elle ne la dépasse pas :
58
59
60 {{code language="none"}}
61 /* ___ On ajuste la hauteur de la liste de valeurs en fonction ________________
62 /* ___ du nombre d'éléments à afficher dans la liste __________________________
63
64 Lsv_Saisie:hauteur = 20 + &nbr_elt(Lsv_Saisie:liste)* 15 
65 Si &Nbr_Elt(Lsv_Saisie:liste) >= 1 
66    Lsv_Saisie:hauteur = Lsv_Saisie:hauteur + 5 
67 Fin 
68
69 /* ___ On veut que la liste ait une hauteur maximale __________________________
70
71 Si  Lsv_Saisie:hauteur > 150
72   Lsv_Saisie:hauteur = 150
73 Fin
74
75 {{/code}}
76
77
78 Sur l'événement (% style="color: rgb(51,102,255);" %)**PerteFocus**(%%) de l'objet (% style="color: rgb(51,102,255);" %)**Liste de valeurs**(%%), on ajuste la hauteur de la liste de valeurs à celle du seul champs de saisie.
79
80
81 {{code language="none"}}
82 /* ___ On ne voit que la partie "Champs de saisie" ____________________________
83 Lsv_Saisie:hauteur = 20
84
85 {{/code}}
86
87
88 {{hardis-info title="Pour aller plus loin..." type="tip" icon="true"}}
89 Dans un but d'optimisation, on peut ne charger la liste qu'après qu'un certain nombre de caractères aient été tapés ou encore qu'un temps de latence ait été atteint depuis la dernière frappe.
90 De même, lorsqu'on ajoute un caractère au champs de saisie, on pourrait éliminer des valeurs de la liste plutôt que d'alimenter de nouveau la liste à partir de la base de données.
91 {{/hardis-info}}
92