Affiche d'une quantité aléatoire d'image et utilisation d'un curseur ("slider")

Version imprimable

16/04/2010, 15h28
Stefounette

Affiche d'une quantité aléatoire d'image et utilisation d'un curseur ("slider")

Bonjour,

J'ai pas mal de difficulté à faire ce que je veux.

Voilà j'ai créer en gros un rectangle dans ma fenêtre avec en dessous un curseur.

Ensuite je fais une requête sql pour voir combien j'ai de dossier dans ma base de donnée.

Mon 1er problème est que je voudrais afficher dans mon rectangle une image tant que j'ai des dossiers dans ma base de donnée. Donc par exemple si un utilisateur à 10 dossier, j'afficherais 10 petite images, s'il en a 100 j'en afficherai 100.

Mon 2ème problème c'est que mon rectangle fait une certaine taille et il ne peut contenir qu'un certain nombre d'image. C'est pour cela, que j'ai créer un curseur. Lorsque l'utilisateur le pousse je voudrais qu'il puisse voir d'autres image.

Mais je n'y arrive pas, pouvez-vous m'aider?

Il faut jouer avec la zone de clip.
Pour pas changer voici :ccool:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
 
def label = Label {
    font: Font.font("Arial bold", 40);
    text: "YOUP C'EST MOI LE TEXTE QUI SLIDE, "
    "LA CLASSE!"
}
def size = bind label.boundsInLocal.width;
var pos: Number = 0 on replace {
    def ratio = pos/100.;
    label.translateX = -ratio*(size-300);
}
Stage {
    title : "Scroll"
    scene: Scene {
        width: 340
        height: 100
        content: [
            Group {
                translateX: 20
                translateY: 20
                clip: Rectangle {
                    width: 300 height: 50
                }
                content: [
                    Rectangle {
                        width: 298 height: 48
                        fill: Color.TRANSPARENT stroke: Color.BLACK
                    }
                    label
                ]
            }
            Slider {
                translateY: 70
                translateX: 20
                min: 0 max: 100
                value: bind pos with inverse
            }
        ]
    }
}

19/04/2010, 10h55
Stefounette

Ok merci beaucoup.

Et pour mon premier problème est-ce que quelqu'un pourrais m'aider? J'essaie diverses choses mais ca fait que planter :(
19/04/2010, 11h55
Stefounette
Ah bon c'est bon j'ai réussis à régler mon premier probleme.

J'ai utiliser un tableau d'ImageView que je rempli de mon nombre aléatoire d'image. Puis j'affiche ce tableau. Un lien qui m'a aidé: Les images dans JavaFx.

Bon sinon galien est-ce que tu pourrais m'expliquer un peu plus cette partie là de ton code ?
Code:

1 2 3 4 def size = bind label.boundsInLocal.width; var pos: Number = 0 on replace { def ratio = pos/100.; label.translateX = -ratio*(size-300);
Merci d'avance :).
20/04/2010, 10h33
galien

la valeur size est bindée, ou automatiquement liée, à la taille en pixels du rectangle qui inclus le label.
pour ensuite faire défiler le label 'au plus juste' on calcul la taille qui n'est pas affichée cad: longueur totale - longueur d'affichage (size-200).
le 200 est la longueur du Rectangle pour clip.
ratio est juste la valeur du slider normalisée entre 0 et 1 (max: 100).
translateX permet de faire défiler le Label, de gauche à droite, d'ou la valeur négative.

Sinon prends garde à imageView, il faut mettre la valeur backGroundloading à false à cause d'un bug qui sera fixé avec la version 1.3
20/04/2010, 10h40
Stefounette

Oki Merci beaucoup. J'avais fini par comprendre toute seule :) mais ça ne fait que confirmer ce que je pensais :).