OVH Cloud OVH Cloud

[Dir8.5] Thumbnail slider- défilement de photos

12 réponses
Avatar
KO Multimédia
Je cherche à mettre sur cd mes photos personnelles et utiliser ce démo pour
monter mon projet:
http://www.lingoworkshop.com/Code/thumbnailnav2.asp

Le code du démo dit qu'il faut s'assurer que toutes les images soient à la
même dimension pour fonctionner avec le slider.

J'ai différent formats de photo 291 x 440; 366 x 366; 540 x 126; 540 x 293
et 440 x 291.

Est-ce que quelqu'un connaît une solution à mon problème.

Merci
Jak

10 réponses

1 2
Avatar
bubar
KO Multimédia wrote:
Je cherche à mettre sur cd mes photos personnelles et utiliser ce
démo pour monter mon projet:
http://www.lingoworkshop.com/Code/thumbnailnav2.asp

Le code du démo dit qu'il faut s'assurer que toutes les images soient
à la même dimension pour fonctionner avec le slider.

J'ai différent formats de photo 291 x 440; 366 x 366; 540 x 126; 540
x 293 et 440 x 291.


Une méthode simple, SI ton fond est de couleur uni : tu ajoutes un fond
à toutes tes images, de telle sorte qu'au final elles aient la même
taille (soit 540*440). Ainsi plus de problème.

Si tu as un fond non uni, le problème est plus complexe et il faudra
sans doute modifier le code. Dis moi si ça te convient.

--
Bubar
Avatar
KO Multimédia
J'ai déja fait l'essai mais le problème réside au niveau de la roulette
(slider) j'aimerais que l'image réduite soit 176 x 176 (non pas réduite mais
coupé pour qu'on ne voit une partie de l'image dans la roulette.
Va voir les résultats à ces deux adresses:

http://www.komultimedia.com/Pogz.html
Regarde l'image 291 x 440 roulette + agrandi tu vois dans la roulette
l'image que ça donne.

Voilà le résultat escompté:
http://www.pogz.com/extranet/imagicom

Merci de ton aide.

KO Multimédia wrote:
Je cherche à mettre sur cd mes photos personnelles et utiliser ce
démo pour monter mon projet:
http://www.lingoworkshop.com/Code/thumbnailnav2.asp

Le code du démo dit qu'il faut s'assurer que toutes les images soient
à la même dimension pour fonctionner avec le slider.

J'ai différent formats de photo 291 x 440; 366 x 366; 540 x 126; 540
x 293 et 440 x 291.


Une méthode simple, SI ton fond est de couleur uni : tu ajoutes un fond
à toutes tes images, de telle sorte qu'au final elles aient la même
taille (soit 540*440). Ainsi plus de problème.

Si tu as un fond non uni, le problème est plus complexe et il faudra
sans doute modifier le code. Dis moi si ça te convient.

--
Bubar



Avatar
bubar
KO Multimédia wrote:
J'ai déja fait l'essai mais le problème réside au niveau de la
roulette (slider) j'aimerais que l'image réduite soit 176 x 176 (non
pas réduite mais coupé pour qu'on ne voit une partie de l'image dans
la roulette.
Va voir les résultats à ces deux adresses:

http://www.komultimedia.com/Pogz.html
Regarde l'image 291 x 440 roulette + agrandi tu vois dans la roulette
l'image que ça donne.

Voilà le résultat escompté:
http://www.pogz.com/extranet/imagicom


Je n'ai aps regardé précisément le source de pogz, mais il me semble
qu'il soit nécessaire que toutes les images aient la même taille. Ne
peux-tu pas les retravailler pour cela, en leur donnant un fond uni si
nécessaire ?

--
Bubar
Avatar
bubar
bubar wrote:
KO Multimédia wrote:
J'ai déja fait l'essai mais le problème réside au niveau de la
roulette (slider) j'aimerais que l'image réduite soit 176 x 176 (non
pas réduite mais coupé pour qu'on ne voit une partie de l'image dans
la roulette.
Va voir les résultats à ces deux adresses:

http://www.komultimedia.com/Pogz.html
Regarde l'image 291 x 440 roulette + agrandi tu vois dans la roulette
l'image que ça donne.

Voilà le résultat escompté:
http://www.pogz.com/extranet/imagicom


Je n'ai aps regardé précisément le source de pogz, mais il me semble
qu'il soit nécessaire que toutes les images aient la même taille. Ne
peux-tu pas les retravailler pour cela, en leur donnant un fond uni si
nécessaire ?


Après un coup d'oeil rapide, le script ne permet pas en l'état
d'utiliser d'images qui n'ont pas exactement la même taille.
J'ai modifié leur script pour qu'il fonctionne :
Dans la cast thumbNailSlider, édite le comportement 1 TileSlider.
Dans la fonction beginsprite, remplace tout le bloc repeat with ... end
repeat par celui-ci :

repeat with i = 1 to membersToDraw.count
srcImg = member(membersToDraw[i]).image
sw=srcImg.width*tilescale
sh=srcImg.height*tilescale
rc=rect(0,0,tileWidth,tileHeight)
rap=float(sw)/sh>1
if rap>1 then
demi=(tileHeight-sh)/2
rc[2]Þmi
rc[4]=rc[4]-demi
else if rap<1 then
demi=(tileWidth-sw)/2
rc[1]Þmi
rc[3]=rc[3]-demi
end if
tImg = image(tileWidth, tileHeight,16)

tImg.fill(tImg.rect,[#shapetype:#rect,#linesize:0,#color:rgb(0,0,0)])
--remplace le rgb(0,0,0) par la couleur de fond que tu veux
tImg.copyPixels(srcImg, rc, srcImg.rect)
imageList.addProp(membersToDraw[i], tImg)
end repeat

J'ai fait ça rapidement donc à tester. A vue de nez, le thumbnail ne
sera pas parfait si la hauteur et/ou largeur sont impair (le thumb sera
en fait trop grand ou trop petit d'un pixel), mais visuellement, ça n'a
aucune importance.

--
Bubar
Avatar
KO Multimédia
Jak

bubar wrote:
KO Multimédia wrote:
J'ai déja fait l'essai mais le problème réside au niveau de la
roulette (slider) j'aimerais que l'image réduite soit 176 x 176 (non
pas réduite mais coupé pour qu'on ne voit une partie de l'image dans
la roulette.
Va voir les résultats à ces deux adresses:

http://www.komultimedia.com/Pogz.html
Regarde l'image 291 x 440 roulette + agrandi tu vois dans la roulette
l'image que ça donne.

Voilà le résultat escompté:
http://www.pogz.com/extranet/imagicom


Je n'ai aps regardé précisément le source de pogz, mais il me semble
qu'il soit nécessaire que toutes les images aient la même taille. Ne
peux-tu pas les retravailler pour cela, en leur donnant un fond uni si
nécessaire ?


Après un coup d'oeil rapide, le script ne permet pas en l'état
d'utiliser d'images qui n'ont pas exactement la même taille.
J'ai modifié leur script pour qu'il fonctionne :
Dans la cast thumbNailSlider, édite le comportement 1 TileSlider.
Dans la fonction beginsprite, remplace tout le bloc repeat with ... end
repeat par celui-ci :

repeat with i = 1 to membersToDraw.count
srcImg = member(membersToDraw[i]).image
sw=srcImg.width*tilescale
sh=srcImg.height*tilescale
rc=rect(0,0,tileWidth,tileHeight)
rap=float(sw)/sh>1
if rap>1 then
demi=(tileHeight-sh)/2
rc[2]Þmi
rc[4]=rc[4]-demi
else if rap<1 then
demi=(tileWidth-sw)/2
rc[1]Þmi
rc[3]=rc[3]-demi
end if
tImg = image(tileWidth, tileHeight,16)

tImg.fill(tImg.rect,[#shapetype:#rect,#linesize:0,#color:rgb(0,0,0)])
--remplace le rgb(0,0,0) par la couleur de fond que tu veux
tImg.copyPixels(srcImg, rc, srcImg.rect)
imageList.addProp(membersToDraw[i], tImg)
end repeat

J'ai fait ça rapidement donc à tester. A vue de nez, le thumbnail ne
sera pas parfait si la hauteur et/ou largeur sont impair (le thumb sera
en fait trop grand ou trop petit d'un pixel), mais visuellement, ça n'a
aucune importance.

--
Bubar



J'essai ça et je te reviens. Merci pour ton aide.

Jak
Avatar
KO Multimédia
Jak

bubar wrote:
KO Multimédia wrote:
J'ai déja fait l'essai mais le problème réside au niveau de la
roulette (slider) j'aimerais que l'image réduite soit 176 x 176 (non
pas réduite mais coupé pour qu'on ne voit une partie de l'image dans
la roulette.
Va voir les résultats à ces deux adresses:

http://www.komultimedia.com/Pogz.html
Regarde l'image 291 x 440 roulette + agrandi tu vois dans la roulette
l'image que ça donne.

Voilà le résultat escompté:
http://www.pogz.com/extranet/imagicom


Je n'ai aps regardé précisément le source de pogz, mais il me semble
qu'il soit nécessaire que toutes les images aient la même taille. Ne
peux-tu pas les retravailler pour cela, en leur donnant un fond uni si
nécessaire ?


Après un coup d'oeil rapide, le script ne permet pas en l'état
d'utiliser d'images qui n'ont pas exactement la même taille.
J'ai modifié leur script pour qu'il fonctionne :
Dans la cast thumbNailSlider, édite le comportement 1 TileSlider.
Dans la fonction beginsprite, remplace tout le bloc repeat with ... end
repeat par celui-ci :

repeat with i = 1 to membersToDraw.count
srcImg = member(membersToDraw[i]).image
sw=srcImg.width*tilescale
sh=srcImg.height*tilescale
rc=rect(0,0,tileWidth,tileHeight)
rap=float(sw)/sh>1
if rap>1 then
demi=(tileHeight-sh)/2
rc[2]Þmi
rc[4]=rc[4]-demi
else if rap<1 then
demi=(tileWidth-sw)/2
rc[1]Þmi
rc[3]=rc[3]-demi
end if
tImg = image(tileWidth, tileHeight,16)

tImg.fill(tImg.rect,[#shapetype:#rect,#linesize:0,#color:rgb(0,0,0)])
--remplace le rgb(0,0,0) par la couleur de fond que tu veux
tImg.copyPixels(srcImg, rc, srcImg.rect)
imageList.addProp(membersToDraw[i], tImg)
end repeat

J'ai fait ça rapidement donc à tester. A vue de nez, le thumbnail ne
sera pas parfait si la hauteur et/ou largeur sont impair (le thumb sera
en fait trop grand ou trop petit d'un pixel), mais visuellement, ça n'a
aucune importance.

--
Bubar



Salut

Tu peux aller voir ce que ça donne:
http://www.komultimedia.com/Pogz.html

Aurait-il un moyen que chaque image (avec sa dimension) apparaissent coupé
en 176 x 176 dans le thumbnail pour qu'on voit bien qu'une partie de l'image
dans le thumbnail?
Avatar
KO Multimédia
> Salut Bubar

Tu peux aller voir ce que ça donne:
http://www.komultimedia.com/Pogz.html

Aurait-il un moyen que chaque image apparaissent coupé (crop) (qu'on ne voit


qu'une partie de l'image en 176 x 176 dans le thumbnail?

Jak


Jak

bubar wrote:
KO Multimédia wrote:
J'ai déja fait l'essai mais le problème réside au niveau de la
roulette (slider) j'aimerais que l'image réduite soit 176 x 176 (non
pas réduite mais coupé pour qu'on ne voit une partie de l'image dans
la roulette.
Va voir les résultats à ces deux adresses:

http://www.komultimedia.com/Pogz.html
Regarde l'image 291 x 440 roulette + agrandi tu vois dans la roulette
l'image que ça donne.

Voilà le résultat escompté:
http://www.pogz.com/extranet/imagicom


Je n'ai aps regardé précisément le source de pogz, mais il me semble
qu'il soit nécessaire que toutes les images aient la même taille. Ne
peux-tu pas les retravailler pour cela, en leur donnant un fond uni si
nécessaire ?


Après un coup d'oeil rapide, le script ne permet pas en l'état
d'utiliser d'images qui n'ont pas exactement la même taille.
J'ai modifié leur script pour qu'il fonctionne :
Dans la cast thumbNailSlider, édite le comportement 1 TileSlider.
Dans la fonction beginsprite, remplace tout le bloc repeat with ... end
repeat par celui-ci :

repeat with i = 1 to membersToDraw.count
srcImg = member(membersToDraw[i]).image
sw=srcImg.width*tilescale
sh=srcImg.height*tilescale
rc=rect(0,0,tileWidth,tileHeight)
rap=float(sw)/sh>1
if rap>1 then
demi=(tileHeight-sh)/2
rc[2]Þmi
rc[4]=rc[4]-demi
else if rap<1 then
demi=(tileWidth-sw)/2
rc[1]Þmi
rc[3]=rc[3]-demi
end if
tImg = image(tileWidth, tileHeight,16)

tImg.fill(tImg.rect,[#shapetype:#rect,#linesize:0,#color:rgb(0,0,0)])
--remplace le rgb(0,0,0) par la couleur de fond que tu veux
tImg.copyPixels(srcImg, rc, srcImg.rect)
imageList.addProp(membersToDraw[i], tImg)
end repeat

J'ai fait ça rapidement donc à tester. A vue de nez, le thumbnail ne
sera pas parfait si la hauteur et/ou largeur sont impair (le thumb sera
en fait trop grand ou trop petit d'un pixel), mais visuellement, ça n'a
aucune importance.

--
Bubar



Salut

Tu peux aller voir ce que ça donne:
http://www.komultimedia.com/Pogz.html

Aurait-il un moyen que chaque image (avec sa dimension) apparaissent coupé
en 176 x 176 dans le thumbnail pour qu'on voit bien qu'une partie de l'image
dans le thumbnail?


Avatar
bubar
KO Multimédia wrote:
Salut Bubar

Tu peux aller voir ce que ça donne:
http://www.komultimedia.com/Pogz.html

Aurait-il un moyen que chaque image apparaissent coupé (crop) (qu'on
ne voit


qu'une partie de l'image en 176 x 176 dans le thumbnail?


Si tu es d'accord, je vais te laisser chercher un peu en te donnant
juste quelques pistes :
dans la fonction que j'ai modifiée, il utilise une seule cast pour les
images en grand et la réduction en thumbnail. Tu peux facilement
modifier le code pour qu'il affiche les images d'une cast en grand et
les images d'une autre (nouvelle) cast en thumbnail. Dans ce cas, tu
peux mettre ce que tu veux dans la 2eme cast.

--
Bubar
Avatar
KO Multimédia
Bubar,
Ça fait deux jours que je cherche, je sais que sa ne doit pas être compliqué
mais ça ne marche jamais, je cherche dans mon super livre lingo. Bon je vais
continué merci de tes conseils.

Jak


Jak

KO Multimédia wrote:
Salut Bubar

Tu peux aller voir ce que ça donne:
http://www.komultimedia.com/Pogz.html

Aurait-il un moyen que chaque image apparaissent coupé (crop) (qu'on
ne voit


qu'une partie de l'image en 176 x 176 dans le thumbnail?


Si tu es d'accord, je vais te laisser chercher un peu en te donnant
juste quelques pistes :
dans la fonction que j'ai modifiée, il utilise une seule cast pour les
images en grand et la réduction en thumbnail. Tu peux facilement
modifier le code pour qu'il affiche les images d'une cast en grand et
les images d'une autre (nouvelle) cast en thumbnail. Dans ce cas, tu
peux mettre ce que tu veux dans la 2eme cast.

--
Bubar



Avatar
KO Multimédia
Bubar,

J'ai beau chercher je suis assez novice en lingo, j'essai de changer
fonctions et commandes mais ça n'arrivent à rien. Est-ce qu'il s'agit
seulement de modifier les chiffres ou dois-je formuler un code précis avec
la commande crop ou la fonction rect?

Si tu connais la solution peux seulement me guider un peu plus, à force de
chercher on fini par apprendre!!

Jak

-- create a list of thumbnail images from this list of members
-- (Note - assumes all the images are the same size)
imageList = [:]
tileWidth = myDrawRect.width
tileScale = float(tileWidth)/member(membersToDraw[1]).image.width
tileHeight = integer(member(membersToDraw[1]).image.height * tileScale)
repeat with i = 1 to membersToDraw.count
srcImg = member(membersToDraw[i]).image
sw=srcImg.width*tilescale
sh=srcImg.height*tilescale
rc=rect(0,0,tileWidth,tileHeight)
rap=float(sw)/sh>1
if rap>1 then
demi=(tileHeight-sw)/2
rc[2]Þmi
rc[4]=rc[4]-demi
else if rap<1 then
demi=(tileWidth-sw)/2
rc[1]Þmi
rc[3]=rc[3]-demi
end if
tImg = image(tileWidth, tileHeight,16)

tImg.fill(tImg.rect,[#shapetype:#rect,#linesize:0,#color:rgb(0,0,0)])
--remplace le rgb(0,0,0) par la couleur de fond que tu veux
tImg.copyPixels(srcImg, rc, srcImg.rect)
imageList.addProp(membersToDraw[i], tImg)
end repeat


Si tu es d'accord, je vais te laisser chercher un peu en te donnant
juste quelques pistes :
dans la fonction que j'ai modifiée, il utilise une seule cast pour les
images en grand et la réduction en thumbnail. Tu peux facilement
modifier le code pour qu'il affiche les images d'une cast en grand et
les images d'une autre (nouvelle) cast en thumbnail. Dans ce cas, tu
peux mettre ce que tu veux dans la 2eme cast.

--
Bubar




1 2