슬라이딩 갤러리2

슬라이딩 갤러리2

1. Properties - Movie Properties창에서  Background color: 검정
   색, Width: 600, Height: 450, Frame rate: 15, SWF9

2. Scene1선택  content로 이미지 9장 불러오고 작업창으
   로 img01~09, 불러와 Transform에서 O=X 센타 X=300 Y=225
   로 하고 다시 O=X, 좌상에 놓고(좌상에 놓으면 X=50 Y=37.5가
   됨, Properties창의 name에 img01~09(아래서부터), Width=500,
   Height=375

3. Outline의 img09~01선택 우클릭→Convert→Convert to Movie
   Clip, Properties창의 Stop Playing at end 체크 해제

4. Outline의 img09~01에 우클릭→Grouping→Group as Movie
   Clip, 이름: img O=X 센타에 놓고 앵커포인트를 끓어다
   stage의 좌상에 놓고 x/y 좌표0/0 되게 (stage좌상)

5. Scene1선택 Tools의 Rectangle Tool선택 Stage에 그려주고
   Properties창에서 W/H=600/450, Line=None, Fill=Solid, 색=검
   정색 O=X 센타 X=300 Y=225

6. Tools 의 Rectangle Tool선택 Stage에 그려주고 Properties창에
   서 W=500 H=375, Line=None, Fill=Solid, 색=검정색 O=X 센타
   X=300 Y=225

7. Outline 의 2개의 Shape 에 우클릭→Grouping→Group as
   Shape, 예 이름: olb

8. Scene1선택 img1 폴더의 img01~09 불러와  Transform에서
   O=X, 좌상, Properties창에서 name에 btn09~01(아래서부터),
   Width=36, Height=27, Line=실선, 색=흰색, 굵기=0

9. Outline의 btn09~01선택 우클릭→Convert→Convert to Movie
   Clip, Properties창에서 Stop Playing at end 체크 해제

10. Outline의 btn09~01선택 Transform에서 O=X 좌상 X=130
   Y=417.75로놓고 btn09만 선택해서 X=434로하고 얼라인 정렬하
   면 아래와 같다, btn09는 434, 417.75, btn08은 396, 417.75,
   btn07은 358, 417.75, btn06은 320, 417.75,
   btn05는 282, 417.75, btn04는 244, 417.75, btn03은 206,
   417.75, btn02는 168, 417.75, btn01은 130, 417.75 로

11. Outline의 btn09~01선택 우클릭→Grouping→Group as Movie
   Clip, 이름: btn, Transform에서 O=X, 센타 작업창의 앵커포인
   트를 끓어다 좌상에놓고 X,Y=0 이 되게 놓고 10번의 좌표값을
   다시확인

12. Tools 의 Rectangle Tool선택 Stage에 그려주고 Properties에
   서 이름: ol, W=500 H=375, Line=실선, 색=흰색, 굵기=1,
   Fill=None, Transform에서 O=X, 센타 X=300 Y=225

13. Tools의 Rectangle Tool선택 Stage에 그려주고 Properties에서
   이름: imgb, W=500 H=375, Line=None, Fill=Solid, 색=파란색,
   Alpha=25%, Transform에서 O=X, 센타 X=300 Y=225

14. Timeline의 imgb라인 30F에 더블클릭 PF 해제, Transform에서
   W=0.1 H=0.1로 30F에 PF활성화 Transform에서 W=500
   H=375, 60F에 더블클릭 활성화, Transform에서 W=0.1 H=0.1로
   PF 해제

15. Outline의 imgb선택 우클릭→Grouping→Group as Movie Clip,
   이름: imgb O=X 센타 Timeline에서 1F에 1프레임추가(imgb열고
   선택  1프레임에 우클릭 insert Freme클릭) imgb의 1F과 31F에
   stop (※Frame 추가요령 1F선택후 F5키를 누러도 됨)

16. Scene1선택 Components →Utility→ColorPicker더블클릭 선택
   된 상태에 Window→Parameters에서 General Settings열고
   mode의Compact선택 , palette Type의 Websafe선택
   Swatch Button Settings열고 use Button의 true,  vertical
   Alignment의 Above선택,  Horizontal Alignment의 Left선택,
   Event Notification열고 Target Object에 _root.imgb입력,
   Transforn에서 O=X 좌상 X=365 Y=283

17. Scene1선택 Components→Effects →Filters →GlowFilter더블
   클릭 이름: gf, Transform: O=X, 센타, Outline: gf 안의 텍스트
   를 삭제한 후 사각형 툴로 적당히 드래그 한다. Properties에서
   이름: gfol, W=36 H=27, Line=실선, 색=흰색, 굵기=0, Fill=Solid,
   색=흰색, Alpha=0%, O=X 좌상

18. Outline의 gf선택 Transform에서 O=X, 좌상, X=434 Y=417.75,
   Window→Parameters에서 색=기본색, inner=false,
   knockout=false, Filter Settings열고 blurx=4, blury=4,
   quality=medium, strength=3, Transition Settings열고
   transition의 repeat선택, direction의 alternate선택, frames=30,
   transition qualit의 medium선택,  Transitioned Filter Settings열
   고 색=기본색, finalBlurX=4, finalBlurY=4, finalStrength=3

19. Scene1선택 Components→Buttons →pushbutton
   button_glossy_rectangle더블클릭 Stage에 들어옴

20. Outline의 버튼의 이름을 Button1, Window→Parameters→
   Ladel 에 Scene1입력, Size and color...열고 W/H=65/25,
   Event goto열고 goto scene의  Next, 그아래=1  Transform의
   O=X, 센터 적색 Next.1은 Scene의 2.3이만들어진 후 적용함
   Event Goto에서 Goto Scene에서 Next를 선택하면 1이 자동 선택
   됨(Scene3은 Next를 First로)

23. Outline의 Button1선택 Transform에서 X=510 Y=431.25

   (Scene마다 Script가 다르니 swi파일 참고 하세요
   용량 때문에 Scene2, Scene3은 이미지를 바꾸지 않았습니다)

24. Outline - img - img09~01 -Script

onSelfEvent(load){
    targetx = 50;
    speedx = 0.1;
}
onSelfEvent(enterFrame){
    this._x = this._x + speedx * (targetx - this._x);
}

25. Outline - btn - btn09~btn01 - Script

onSelfEvent(load){
    this._alpha = 50;
}
onSelfEvent(rollOver){
    this._alpha = 100;
}
onSelfEvent(rollOut){
    this._alpha = 50;
}
on(rollOver){                         ※on(rollOver)에서 rollOve의 아무데나 커서를놓고 Scrit
                                             창의 밑에 의문 표시를  선택 releaseOutside에 첵크를 함   
_root.img.img01.targetx = 50;
    _root.img.img02.targetx = 50;    50의 숫자에 500의 숫자를 적용함으로 전면의 사신이
                                                    위치를 바꿈
    _root.img.img03.targetx = 50;
    _root.img.img04.targetx = 50;
    _root.img.img05.targetx = 50;
    _root.img.img06.targetx = 50;
    _root.img.img07.targetx = 50;
    _root.img.img08.targetx = 50;
    _root.img.img09.targetx = 50;
    _root.gf.targetx = 434;     ※해당 x 좌표의 값으로 수정
}
on(press){
    _root.imgb.play();
}

26. Outline - gf - Script

onSelfEvent(load){
    targetx = 434;
    speedx = 0.2;
}
onSelfEvent(enterFrame){
    this._x = this._x + speedx * (targetx - this._x);
}

27. Outline의 Scene1선택 Timeline, Scene1의 1F에 stop()

28. Outline의 Scene1에 우클릭→Copy Scene , 우클릭→Paste
   (2번)

29. Outline의 Scene의 이름을 위에서부터 Scene1, 2, 3으로 한다.

30. Outline의 Scene2를 열고 선택한다.

31. Outline 의 Scene2안의 개체의 이름을 Button2(Scene2), gf2,
   imgb2, btn2, img2 (cp2선택 Window→Parameters에서
   Target Object에 _root.imgb을 _root.imgb2로 입력)

32. Outline의 Scene2의 gf2선택 Transform에서 X= 557, Y=330.5

33. Outline의 Scene2 의 btn2열고 btn09~01(Transform: x, y)
- btn09: 557, 330.5 - btn08: 557, 301.05 - btn07: 557, 271.65
- btn06: 557, 242.2 - btn05: 557, 212.75 - btn04: 557, 183.3
- btn03: 557, 153.9 - btn02: 557, 124.45 - btn01: 557, 95

34. Outline - Scene2 - img2 - img09~01 -Script

onSelfEvent(load){
    targety = 37.5;
    speedy = 0.1;
}
onSelfEvent(enterFrame){
    this._y = this._y + speedy * (targety - this._y);
}

35. Outline - Scene2 - btn2 - btn09~btn01 - Script

onSelfEvent(load){
    this._alpha = 50;
}
onSelfEvent(rollOver){
    this._alpha = 100;
}
onSelfEvent(rollOut,releaseOutside){
    this._alpha = 50;
}
on(rollOver){
    _root.img2.img01.targety = 37.5;
    _root.img2.img02.targety = 37.5;
    _root.img2.img03.targety = 37.5;
    _root.img2.img04.targety = 37.5;
    _root.img2.img05.targety = 37.5;
    _root.img2.img06.targety = 37.5;
    _root.img2.img07.targety = 37.5;
    _root.img2.img08.targety = 37.5;
    _root.img2.img09.targety = 37.5;
    _root.gf2.targety = 330.5;
}
on(press){
    _root.imgb2.play();
}

※gf2의 script

 onSelfEvent(load){
    targety = 330.5;
    speedy = 0.2;
}
onSelfEvent(enterFrame){
    this._y = this._y + speedy * (targety - this._y);
}

36. Outline의 Scene3을 열고 선택한다.

37. Outline의 Scene3의 개체 이름: Button3(Scene3, first, 1), gf3,
   imgb3, btn3, img3 (cp3선택 Window→Parameters에서
   Target Object에 _root.imgb을 _root.imgb3으로 입력)

38. Outline의 Scene3의 gf3: Transform: x/y = 557, 290.5, cp선
   택 O=X 좌상 X=346.5 Y=263.5로, button3선택 O=X 센타 X=345
   Y=431.25로

39. Outline 의 Scene3의 btn3 - btn09~01(Transform: x, y)
   tn09: 557, 290,  btn08: 557, 321.95,   btn07: 557, 353.9
   btn06: 557, 385.8,    btn05: 557, 417.75
   btn04: 515.25, 417.75,    btn03: 473.5, 417.75,
   btn02: 431.75, 417.75,    btn01: 390, 417.75

40. Outline - Scene3 - img3 - img09~01 -Script

onSelfEvent(load){
    targetx = 50;
    speedx = 0.1;
    targety = 412.5;
    speedy = 0.1;
}
onSelfEvent(enterFrame){
    this._x = this._x + speedx * (targetx - this._x);
    this._y = this._y + speedy * (targety - this._y);
}

41. Outline - Scene3 - btn3 - btn09~btn01 - Script

onSelfEvent(load){
    this._alpha = 50;
}
onSelfEvent(rollOver){
    this._alpha = 100;
}
onSelfEvent (rollOut,releaseOutside){
    this._alpha = 50;
}
on(rollOver){
    _root.img3.img01.targetx = 50;
    _root.img3.img02.targetx = 50;
    _root.img3.img03.targetx = 50;
    _root.img3.img04.targetx = 50;
    _root.img3.img05.targetx = 50;
    _root.img3.img06.targetx = 50;
    _root.img3.img07.targetx = 50;
    _root.img3.img08.targetx = 50;
    _root.img3.img09.targetx = 50;

    _root.img3.img01.targety = 412.5;
    _root.img3.img02.targety = 412.5;
    _root.img3.img03.targety = 412.5;
    _root.img3.img04.targety = 412.5;
    _root.img3.img05.targety = 412.5;
    _root.img3.img06.targety = 412.5;
    _root.img3.img07.targety = 412.5;
    _root.img3.img08.targety = 412.5;
    _root.img3.img09.targety = 412.5;    

    _root.gf3.targetx = 557;
    _root.gf3.targety = 290.5;
}
on(press){
    _root.imgb3.play();
}

42 gf3의 script

    onSelfEvent(load){
    targetx =557;
    speedx = 0.2;
    targety = 290.5;
    speedy = 0.2;
}
onSelfEvent(enterFrame){
    this._x = this._x + speedx * (targetx - this._x);
    this._y = this._y + speedy * (targety - this._y);
}

※Scene3의 img 열고 안의img01~img09까지 선택 O=X 좌하에 놓
   고 X=50 Y=412 인지 확인

※ColorPicker의 각 Scene에서 적용하기위하여 이를 약어로 cp1
    cp2 cp3로 바꾸어 Scene1 Scene2 Scene3 에 각각 아래 script
    를 적용한다

Scene1 (기존의 소스에 덮어 씌운다)
 onFrame (1) {
    stop();
    _root.cp2._visible=0;
    _root.cp3._visible = 0;
}

Scene2
onFrame (1) {
    stop();
    _root.cp1._visible=0;
    _root.cp3._visible=0;
}

Scene3
onFrame (1) {
    stop();
    _root.cp1._visible=0;
    _root.cp2._visible=0;
}

content로 이미지 18장 더 불러와 Scene2열고 img2열고
   img01~img09까지열고 안의 이미지 각 각 다른이미지로 바꿔주고
   btn2 열고 btn01~btn09까지모두열고 img2의 이미지와 같은 이미
   지로 모두바꿔주고 Scene3도 이와같이 바꿔준다

 

 

슬라이딩 갤러리2.swi

슬라이딩 갤러리2.swi

4.21MB