Bonjour à tous,
J'ai conçu une carte sous AI que j'ai importée dans flash pour pouvoir la rendre dynamique, à savoir créer un effet de zoom sur celle-ci, grâce à des boutons "+", "-" et une remise à zéro avec un bouton "reset". Je suis arrivée à réaliser mon effet grâce au très bon tuto d'olivier (
http://wiki.mediabox.fr/tutoriaux/fl..._fenetre_zooms).
Cependant, je ne viendrai pas vous ennuyer avec mes exploits si je n'avais pas une question:
mon effet de zoom fonctionne bien et j'aimerais maintenant pouvoir créer à l'intérieur de mon clip zoom de ma carte des boutons sur certains sites touristiques, pour pouvoir, lorsque l'on clique dessus ou au passage de la souris (cela a peu d'importance), pouvoir afficher un cadre de couleur contenant une petite description du lieu avec éventuellement une ou deux photos pour illustrer. Je souhaite que ces boutons soient accessibles du moment où la personne zoome sur une partie de la carte, elle clique/passe sa souris sur un lieu et le petit cadre de couleur contenant le texte et les images s'affiche au-dessus de la carte.
J'ai déjà essayé de transformer un lieu en bouton en rentrant dans mon clip carte, mais celui-ci n'est pas réactif au passage de la souris.
Auriez-vous une solution à me proposer?
Merci par avance à tous ceux qui pourront m'aider! ;)
Voici le code AS Zoom:
import flash.geom.Rectangle;
import flash.geom.Point;
// Changer éventuellement ces coordonnées aux dimensions désirées de votre fenêtre d'affichage :
var zoneAffichage:Rectangle = new Rectangle(50,50,474,650);
// Dessin d'un rectangle délimitant la fenêtre
var fenetreMC:MovieClip = this.createEmptyMovieClip("fenetre", this.getNextHighestDepth());
fenetreMC.lineStyle(5, 0x999999, 100)
fenetreMC.moveTo(zoneAffichage.left, zoneAffichage.bottom);
fenetreMC.lineTo(zoneAffichage.left, zoneAffichage.top);
fenetreMC.lineTo(zoneAffichage.right, zoneAffichage.top);
fenetreMC.lineStyle(5, 0x999999, 100)
fenetreMC.lineTo(zoneAffichage.right, zoneAffichage.bottom);
fenetreMC.lineTo(zoneAffichage.left, zoneAffichage.bottom);
var maskMC:MovieClip = this.createEmptyMovieClip("mask", this.getNextHighestDepth());
maskMC.beginFill(0xffffff, 100)
maskMC.moveTo(zoneAffichage.left, zoneAffichage.top);
maskMC.lineTo(zoneAffichage.right, zoneAffichage.top);
maskMC.lineTo(zoneAffichage.right, zoneAffichage.bottom);
maskMC.lineTo(zoneAffichage.left, zoneAffichage.bottom);
maskMC.endFill();
carte.setMask(maskMC);
carte.onPress = function () { this.startDrag(false); }
carte.onRelease = carte.onReleaseOutside = function () { this.stopDrag(); }
function redimensionnerProportionnellement(contenuMC:MovieClip, conteneurRect:Rectangle) {
// Dimensionne contenuMC à sa taille maximale pour qu´il rentre dans conteneurRect.
contenuMC._width = conteneurRect.width; // on met la largeur maximale.
contenuMC._yscale = contenuMC._xscale; // on fait suivre le redimensionnement vertical pour éviter la déformation.
if (contenuMC._height > conteneurRect.height) {
// Si le contenu dépasse en hauteur, on rectifie et on adapte la largeur :
contenuMC._height = conteneurRect.height;
contenuMC._xscale = contenuMC._yscale;
}
}
function centrer(contenuMC:MovieClip, conteneurRect:Rectangle) {
// Centre contenuMC dans conteneurRect.
// On calcule les coordonnées du point central de conteneurRect :
var centreX:Number = conteneurRect.width / 2 + conteneurRect.left;
var centreY:Number = conteneurRect.height / 2 + conteneurRect.top;
// On place contenuMC en fonction de ce point, en tenant compte de sa taille :
contenuMC._x = centreX - contenuMC._width / 2;
contenuMC._y = centreY - contenuMC._height / 2;
}
reset.onPress = function () {
redimensionnerProportionnellement(carte, zoneAffichage);
centrer(carte, zoneAffichage);
}
function placerPoint(carte:MovieClip, cible:Point, dest:Point):Void {
// Place le point cible de carte sur le point dest
carte._x = dest.x - cible.x * carte._xscale / 100;
carte._y = dest.y - cible.y * carte._yscale / 100;
}
function zoomerSurCentre(carte:MovieClip, zoneAffichage:Rectangle, scale:Number):Void {
// Modifie l'échelle de carte en le déplaçant de manière à garder
// immobile le point qui est au centre de zoneAffichage
// Calcul des coordonnées du point central de zoneAffichage :
var centreRectX:Number = zoneAffichage.left + zoneAffichage.width / 2;
var centreRectY:Number = zoneAffichage.top + zoneAffichage.height / 2;
var centreRect:Point = new Point(centreRectX, centreRectY);
// Calcul des coordonnées du point de carte qui occupe
// actuellement le centre de la zone d'affichage
var centreImage:Point = centreRect.clone();
carte.globalToLocal(centreImage);
// Opération de zoom :
carte._xscale = scale;
carte._yscale = scale;
// Placement de l'image :
placerPoint(carte, centreImage, centreRect)
}
btplus.onPress = function () {
zoomerSurCentre(carte, zoneAffichage, carte._xscale * 1.5)
}
btmoins.onPress = function () {
zoomerSurCentre(carte, zoneAffichage, carte._xscale / 1.5)
}
reset.onPress() // Ajuster l'image au lancement du swf
Configuration: Mac OS X
Firefox 2.0.0.14