Tutoriel "Les papillons"
Idée et fichier scc de Odin
tutoriel écrit par Lorenza
Idée et fichier scc de Odin
tutoriel écrit par Lorenza
Si vous voulez voir une réalisation modèle, cliquez ICI .
1) Insert/background: mettez ici une tuile de votre choix: voici la mienne:
2) Insert/Top Border Scroll et insérez une barre horizontale de 500 par 25 pixels.
Voici la mienne :
Mais vous pourrez en créer vous-mêmes dans PSP: il est indispensable qu'elle ait 15 pixels de hauteur, autrement il faudra donner d'autres dimensions au fichier graphique qui servira aux 4 coins.
Scroll direction : none.
3) Insert/Bottom Border Scroll: et mettez la barre mise au point 2.
Scroll direction : none.
4) Insert/Left Border Scroll et insérez une barre verticale de 25 par 500 pixels.
Voici la mienne:
Mais vous pourrez en créer vous-mêmes dans PSP: il est indispensable qu'elle ait 15 pixels de largeur, autrement il faudra donner d'autres dimensions au fichier graphique qui servira aux 4 coins.
Scroll direction: none.
5) Insert/Right Border Scroll et insérez la même barre verticale de 25 par 25 pixels que vous avez mise précédemment au point 4.
Scroll direction: none.
6) Insert/Positioned Image : cliquez sur browse pour aller chercher un fichier image de 32 par 28 pixels (il servira aux 4 coins). Voici le mien:
Si vous en construisez vous-même un, il est indispensable qu'il ait environ ces dimensions pour qu'il recouvre bien le coin.
From Left : 0.
From Top : 0.
7) Insert/Positioned Image : cliquez sur browse pour aller chercher le fichier image de 28 pixels, déjà utilisé au point 6.
From Right : 0.
From Top : 0.
8) Insert/Positioned Image : cliquez sur browse pour aller chercher le fichier image de 28 pixels, déjà utilisé au point 6.
From Left : 0.
From Bottom : 0.
9) Insert/Positioned Image : cliquez sur browse pour aller chercher le fichier image de 28 pixels, déjà utilisé au point 6.
From Right : 0.
From Bottom : 0.
10) Insert/Positioned Image (il va servir pour placer le cadre: cliquez sur browse pour aller chercher votre cadre.
Center : 0.
From Top : 50.
11) Insert/Positioned container (de ce container vont dépendre les 4 positioned containers qui suivront).
Horizontal Layout: (première colonne) Left : From Left: 30 ; Specified size : 400.
Vertical Layout: (deuxième colonne): From Top : 50 ; From Bottom : 50.
12) Insert/Positioned container et laissez-le à droite.
Horizontal Layout: (première colonne) Left : From Left: 15 ; Specified size : 2.
Vertical Layout: (deuxième colonne): From Top : 15 ; From Bottom : 15.
13) Insert/Background : et mettez une tuile de votre choix: voici la mienne:
Scrolling position : Up+Right. Cochez Smooth Scroll. Pixels per second : 300 ;
Pixels per move: 3.
Vertical spacing : 100.
Vertical start : 100.
14-15) Faites un copier-coller de la case 12 et placez la case 14 bien en correspondance de la case 12.
Faites les changements suivants:
- case 14: respectivement 20/2/25/25.
- case 15: Vertical spacing : 100. Vertical start : 75.
16-17) Faites un copier-coller de la case 12 et placez la case 16 bien en correspondance de la case 12.
Faites les changements suivants:
- case 16: respectivement 25/2/35/35.
- case 17: Vertical spacing : 100. Vertical start : 50.
18-19) Faites un copier-coller de la case 12 et placez la case 18 bien en correspondance de la case 12.
Faites les changements suivants:
- case 18: respectivement 30/2/45/45.
- case 19: Vertical spacing : 100. Vertical start : 25.
20-28) Faites un copier-coller de la case 11 placez la case 20 complètement à gauche.
Faites les changements suivants:
- case 20 : respectivement 50/400/50/50.
- case 21 : 15/2/45/45.
- case 22 : Vertical spacing : 100. Vertical start : 25.
- case 23 : 20/2/35/35.
- case 24 : Vertical spacing : 100. Vertical start : 50.
- case 25 : 25/2/25/25.
- case 26 : Vertical spacing : 100. Vertical start : 75.
- case 27 : 30/2/15/15.
- case 28 : Vertical spacing : 100. Vertical start : 100.
29-37) Faites un copier-coller de la case 11 et placez la case 29 complètement à gauche.
Faites les changements suivants:
- case 29 : respectivement 30/400/50/50.
- case 30 : 15/2/15/15.
- case 31 : Vertical spacing : 100. Vertical start : 100.
- case 32 : 20/2/25/25.
- case 33 : Vertical spacing : 100. Vertical start : 75.
- case 34 : 25/2/35/35.
- case 35 : Vertical spacing : 100. Vertical start : 50.
- case 36 : 30/2/45/45.
- case 37 : Vertical spacing : 100. Vertical start : 25.
38-46) Faites un copier-coller de la case 11 et placez la case 38 complètement à gauche.
Faites les changements suivants:
- case 38 : respectivement 50/400/50/50.
- case 39 : 15/2/45/45.
- case 40 : Vertical spacing : 100. Vertical start : 25.
- case 41 : 20/2/35/35.
- case 42 : Vertical spacing : 100. Vertical start : 50.
- case 43 : 25/2/25/25.
- case 44 : Vertical spacing : 100. Vertical start : 75.
- case 45 : 30/2/15/15.
- case 46 : Vertical spacing : 100. Vertical start : 100.
On vient de terminer tous les contours.
Maintenant on va construire le rectangle pour le message area.
47) Insert/Positioned Container.
Horizontal Layout: (première colonne) Centre : 0 ; Specified size : 418.
Vertical Layout: (deuxième colonne): From Top : 650 (cette valeur dépendra de la hauteur de votre cadre); From Bottom : 100.
48) Insert/Background: mettez la tuile mise à la case 13. Scrolling: No Scrolling.
49) Insert/Frame: Style : solid ; Widht : 1: couleur : une couleur de votre choix. Voici la mienne: #000000.
50) Insert/Positioned Container (il restera dans la position où il se trouve).
Complétez dans la deuxième colonne: From Left : 5; From Right : 5; From Top : 5 ; From Bottom : 5.
51) Insert/Backgroud: mettez la tuile mise à la case 1. Scrolling: No Scrolling.
52) Insert/Frame: Style : solid ; Widht : 1: couleur : une couleur de votre choix. Voici la mienne: #000000.
53) Insert/Message area: le mettre complètement à gauche. Pour que le message puisse bien rentrer dans le rectangle construit précédemment, mettez les marges suivantes (elles tiennent comptent des positions mises pour le container en question): Left : 200; Right : 200; Top : 660 ; Bottom : 100.
Cochez Scrollbar Colors et mettez des couleurs en cliquant sur Set Base Color et Set Shadow Color.
Moi, j'ai mis réciproquement la couleur #C17667 et la couleur #C17667.
Cela servira à colorer le scrollbar externe, puisqu'il n'y aura pas de scrollbar pour le rectangle de message.
Ajoutez maintenant Sound, Ticker et Loading Message.
Odin pour l'idée et la réalisation du fichier SSC
Lorenza pour la création du tutoriel pour le groupe franco-scrippy
03/11/05