기타 라이센스
적용 버전 정식버전(1.0이후)
어찌 어찌 하다보니 벌써 플래시 갤러리 6 개째 입니다.
이제는 조금 플래시를 알것 같기도 합니다.
이게 마지막 입니다.
이것 역시 만들어서 혼자 사용하기 아까워서 올려봅니다.
혹시 필요하신분이 있으면 사용해 보시기 바랍니다.
설치로 넘어가지전에 기본적으로 플래시 구성을 살펴보도록 하지요.
사진은 기본적으로 7개가 플래시 화면에 표시됩니다.
이 구성을 아셔야 나중에 파라메타 변경하여 여러가지로 활용하실수 있습니다.
구성은 아래와 같습니다.
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
사진0(맨 왼쪽) 사진1 사진2 사진3(중앙) 사진4 사진5 사진6(맨 오른쪽)
targetX = [centerX + targetX_0, centerX + targetX_1, centerX + targetX_2, centerX+targetX_3), centerX + targetX_4, centerX + targetX_5, centerX + targetX_6 ];
targetY = [centerY + targetY_0, centerY + targetY_1, centerY + targetY_2, centerY+targetY_3), centerY + targetY_4, centerY + targetY_5, centerY + targetY_6 ];
targetS = [targetS_0, targetS_1, targetS_2, targetS_3, targetS_4, targetS_5, targetS_6 ];
targetAlpha = [targetAlpha_0, targetAlpha_1, targetAlpha_2, targetAlpha_3, targetAlpha_4, targetAlpha_5, targetAlpha_6 ];
targetVisible = [targetVisible_0, targetVisible_1, targetVisible_2, targetVisible_3, targetVisible_4, targetVisible_5, targetVisible_6 ];
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
즉 스킨설정에서 받아들이는 것들 입니다.
50개에 달하는 설정값들을 사용합니다.
한개 한개 설명합니다.
1. targetX
7개의 값을 받아들입니다.
이 값은 플래시 화면 정 중앙을 기준으로 상대값을 주는것 입니다.
이것을 변경한다면 사진의 가로 방향 설정을 임으로 하실수 있다는 말이 됩니다.
2. targetY
사진의 세로방향 상대치 값들 입니다.
3. targetS
이것역시 7개의 사진에 대한 각각의 확대변수 입니다.
100이면 100% 입니다. 사진 중앙을 중심으로 각각 작아지도록 설정하면 되겠지요.
50 이면 50%가 됩니다.
4. targetAlpha
각 사진에 대한 투명도 입니다.
100이면 투명도가 없는것이 되고 50이면 50% 정도이 투명도가 되겠지요.
5. targetVisible
이것은 사진을 표시할것인지 아닌지를 표시합니다.
true이면 표시,false 이면 표시하지 않습니다.
이것을 변경하면 가운데 사진 하나만 혹은 양쪽으로 한개씩 2개씩,3개씩 표시할수 있지요.
위 변수들은 플래시 갤러리 올라오면서 요구하는 사항들을 거의 수용해서 프로그램 하였습니다.
설명이 너무 간략하게 해서 이해하시기 어려운 분들도 있으리라 생각합니다만
그냥 신경쓰지 않고 사용해도 기본은 되니까 걱정은 하지 않아도 됩니다.
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
그럼 설치로 들어갑니다.
1. dicasajin_flash_gallery_5.zip
역시 이것 역시 제 스타일 데로 입니다.
바탕이나 색 설정은 제 스타일로 흙백과 랜덤칼라,투명모드 지원합니다.
바탕은 현재 6개 정도 만들어 놓았으니 사용하시면 됩니다.
또한 타이틀바 사용 유무도 설정이 됩니다. 그외 복잡한 파라메터는 아래 설명합니다.
설치 결로는 "widgets/" 방에 풀어서 올리시면 됩니다.
즉 풀린것에서 "dicasajin_flash_gallery_5" 폴더를 widgets 방에 통째로 올리시면 됩니다.(스킨즈 방이 아님을 명심하세요.)
압축을 푸실때 "dicasajin_flash_gallery_5"에 압축풀기로 하시기 바랍니다.
그런다음 관리자->관리모듈->위젯에 가셔서 "디카사진 플래시 갤러리 5"를
선택해서 코드생성에 들어가셔서 스킨선택에서 "디카사진 플래시 갤러리 5 스킨 (default)"을 선택하신 다음 코드생성를 하시면 됩니다.
이때 칼러셋 및 복잡한 여러가지를 설정합니다.
추가적으로 말씀드리면 스킨은 2개가 설치됩니다.
default 와 default_2 가 됩니다.
이것은 한 화면에서 2개를 사용할때 충돌없이 사용하시라고 한개 더 만들어서 놓은것 입니다.
필요로 하시는 분들이 있어서 그리 한것 입니다.
2. 설치 경로문제
"widgets/dicasajin_flash_gallery_4/skins/default/list.html" 에 보시면
{@$Path = "";} <!--XE 설치된경로 ("/xe/")-->
가 있습니다.
간혹 이것이 문제가 되더군요.
경로도 {@$Path = "";} 이부분을 {@$Path = _XE_PATH_;}
위는 개인서버가 아닌경우 해당됩니다.
개인서버에서 _XE_PATH_ 값은 자기컴에 C:\dkdk\dkdkdk 즉 자기 컴푸터 설치된곳을 가져옵니다.
그러나 개인서버가 아닌곳에서는 제대로 가져옵니다.
개인서버는 그냥 "" 하시고 그게 아니되면 "xe" 혹은 "zbxe"로 해보시기 바랍니다.
3. 주의 사항
대개들 안되는 분들은 너무 성급하게 생각하시고 설치 안내를 잘 읽지 않고 하시는 경우가 있더군요.
설치방의 스킨 방에 보시면 xml 방이 있고 그 밑에 gallery.xml이 생성됩니다.
이 파일 권한 설정이 777로 되어야 합니다.
xml 방도 같이 설정해 주시기 바랍니다.
저는 개인 서버라 관계가 없습니다.
또한 스킨 방에 list.html은 손대실때는 신중히 하시기 바랍니다.
설정값을 리스트 할때 복잡함으로 ' 나 " 순서가 바뀐다거나 다른것으로 대체되면 이 플래시 동작 거부합니다.
4. 적용사이트 보기
http://dicasajin.goanygate.com:8080/page_dicasajin_layout_main3_test_03
5. 파폭에서 안될때
파폭용 플래시 버전이 낮아서 그렇니다.
아래 첨무한 install_flash_player.exe 를 설치하시면 됩니다.
저도 고민했는데 이것을 잊고 있었습니다.
안되던것들이 전부 이제는 됩니다.
6. 외국어 문제
일단 이것은 외국어 버전을 염두에 두지 않았습니다.
아마도 그 나라 디폴트 윈도우 언어로 될것으로 생각합니다(이 부분은 저도 잘 몰라요.)
---->결과적으로 폰트 내장형이 아니므로 DicaSajinGallery_5.swf 사이즈가 상당히 적다,(14.3KB)
그러므로 부하가 적게 든다.
7. 마지막으로 설치시 문제는
제가 올린 http://www.zeroboard.com/17698842#40
에 댓글에서도 찿으실수 있습니다.
8. 플래시 사이즈 문제
내부적으로는 640*400으로 만들어 졌습니다.
가로폭은 임으로 설정하시면 되고 (플래시 가로폭 세로폭 조절),
세로폭 설정시는 머리좀 써야 합니다.
섬브네일 세로폭 + 테두리 + 위아래 여유등을 생각하시어 설정하셔야 합니다.
정 어려우시면 제사이트 와서 도움 요청하면 만들어 드리지요.그러나 이 플래시는
엄청 설정이 다 되므로 설정으로 인해 모든것을 해결할수 있도록 되어있습니다.
9. 위젯 샘플 및 파라메터 설명
샘플 1 (적용사이트에서 상단에 있는것의 샘플코드 입니다.)
<img class="zbxe_widget_output" widget="dicasajin_flash_gallery_5" skin="default" colorset="random_color" use_title_bar="Y" title="디카사진 플래시 갤러리 5" title_cut_size="20" order_target="list_order" order_type="desc" subject_cut_size="20" flash_width="980" flash_height="400" thumbnail_type="ratio" display_subject="Y" display_author="Y" display_regdate="Y" play_direction="right" img_speed="2" rotate_speed="3000" image_fit="fit" frame_width="4" image_width="360" image_height="360" text_display="true" text_color="0xffffff" right_btnx="91" right_btny="333" left_btnx="550" left_btny="333" targetx_0="-300" targetx_1="-250" targetx_2="-150" targetx_4="150" targetx_5="250" targetx_6="300" targets_0="24" targets_1="36" targets_2="60" targets_3="100" targets_4="60" targets_5="36" targets_6="24" target_alpha_0="70" target_alpha_1="80" target_alpha_2="90" target_alpha_3="100" target_alpha_4="90" target_alpha_5="80" target_alpha_6="70" target_visible_0="true" target_visible_1="true" target_visible_2="true" target_visible_3="true" target_visible_4="true" target_visible_5="true" target_visible_6="true" list_count="20" mid_list="GalleryPerson" />
샘플 2 (적용사이트에서 하단에 있는것의 샘플코드 입니다.)
<img class="zbxe_widget_output" widget="dicasajin_flash_gallery_5" skin="default_2" colorset="random_color" use_title_bar="Y" title="디카사진 플래시 갤러리 5" title_cut_size="20" order_target="list_order" order_type="desc" subject_cut_size="20" flash_width="980" flash_height="400" thumbnail_type="ratio" display_subject="Y" display_author="Y" display_regdate="Y" play_direction="right" img_speed="2" rotate_speed="3000" image_fit="fit" frame_width="4" image_width="360" image_height="360" text_display="true" text_color="0xffffff" right_btnx="141" right_btny="333" left_btnx="500" left_btny="333" targetx_0="-346" targetx_1="-276" targetx_2="-226" targetx_4="226" targetx_5="276" targetx_6="346" targets_0="60" targets_1="36" targets_2="24" targets_3="100" targets_4="24" targets_5="36" targets_6="60" target_alpha_0="70" target_alpha_1="80" target_alpha_2="90" target_alpha_3="100" target_alpha_4="90" target_alpha_5="80" target_alpha_6="70" target_visible_0="true" target_visible_1="true" target_visible_2="true" target_visible_3="true" target_visible_4="true" target_visible_5="true" target_visible_6="true" list_count="20" mid_list="GalleryAnimal" />
샘플 2는 자세히 보시면 skin="default_2" 인것을 보실수 있습니다. 즉 스킨이 2개설치됩니다.(한 화면에서 2개를 적용할때 각각 스킨을 올려야
서로 충돌하지 않고 되겠지요.(이것도 필요하신분이 있을까 해서 같이 올립니다.
플래시 화일 사이즈가 10k 조금 넘으니까 부하에는 별로 관계 없습니다.
colorset="random_color" 이것은 제 스타일로 타이틀바를 그릴때 사용하는데 위제코드 생성하실때 보시면 원하는것 선택 하시면 됩니다.
사용하지 않을때는 저밑에 use_title_bar="N" 하시면 됩니다.
use_title_bar="Y" 타이틀바 사용유무 입니다.
title="플래시 갤러리 4" 타이틀바 제목입니다.
title_cut_size="20" 타이틀바 제목길이설정입니다.
subject_cut_size="20" 사진제목 길이 설정 입니다.
flash_width="640" 플래시 가로폭입니다. 현재 설정된 값이고 이것을 늘리면 공간이 더 늘어나서 오른쪽 작은 섬브네일 갯수를 늘릴수 있습니다.
flash_height="400" 플래시 세로폭 입니다.이것은 고정하시기 바랍니다. 부득히 변경하시려면 해 보시기 바랍니다.
이것은 또한 large_thumbnail_width 와 맞추어서 설정한것이라 변경하면 사진이 축소 또는 확대됨으로 사진의 질이 저하되어 출력될수 있습니다.
thumbnail_type="ratio" 섬브네일 생성방법입니다. 이것은 큰사진(large_thumbnail) 즉 왼쪽 사진용 설정입니다.
작은 섬브네일은 자동으로 크랍모드로 작동합니다.
large_thumbnail_width="360" 큰사진 사이즈 입니다.위에 적은데로 이것은 플래시 세로폭과 맞추었기 때문에 이 사이즈로 사용을 권장합니다.
large_thumbnail_height="360"
display_subject="Y" 사진 제목 표시 여부
display_author="Y" 작자 표시 여부
display_regdate="Y" 날짜 표시 여부
play_direction="right" 스크롤 이동방향입니다.
img_speed="2" 이 파라메터는 트윈이라 하는곳에서 사용하는데 2가 적당합니다.
테스트 해보시면 어이되는지 알수있습니다.
rotate_speed="3000" 슬라이즈 쇼 지연시간(단위는 밀리초 입니다.즉 3000이면 3초가 되겠지요.
image_fit="fit" 이것은 고정입니다. 저는 솔직히 크랍은 좋아하지 않아서....
image_width="360"
image_height="360" 섬네일 사이즈 입니다.가로 세로 조정되는것이므로 최대치를 적어주면 되겠지요.
text_display="true"
text_color="0xffffff" 텍스트 표시여부와 칼라입니다.
right_btnx="91"
right_btny="333" 왼쪽에 있는 스크롤 버튼 위치 입니다. 현재 위치이므로 이것을 조절하시면 원하시는 위치에 변경가능합니다.
left_btnx="550"
left_btny="333" 왼쪽에 있는 스크롤 버튼 위치 입니다. 현재 위치이므로 이것을 조절하시면 원하시는 위치에 변경가능합니다.
list_count="20" 기본적으로 4개이상 이면 정상 표시됩니다.(1개도 됩니다만 좀 이상하겠지요.)
mid_list="GalleryAnimal" 한개 혹은 여러개의 겔러리 선태 가능
기 외는 저 위에서 사진 관련해 설명드린 데로 설정하시면 됩니다.
약간은 첨부사진으로 설명 드리도록 하지요.
샘플 1 (적용 사이트 하단 샘플입니다. 스크롤 위치가 변하면 슬라이드 쇼는 멈추고 아래로 내리면 쇼 다시 진행합니다.)
샘플 2
샘플 3
샘플 4 (적용사이트 상단 샘플입니다. 기본적으로 사진은 7개 표시합니다.)
샘플 5
샘플 6 (적용사이트 상단 샘플입니다. 기본적으로 사진은 7개 표시합니다. targetVisible 을 사용해서 5개만 표시)
샘플 7 (적용사이트 상단 샘플입니다. 기본적으로 사진은 7개 표시합니다. targetVisible 을 사용해서 3개만 표시)
샘플 8 (적용사이트 상단 샘플입니다. 기본적으로 사진은 7개 표시합니다. targetVisible 을 사용해서 1개만 표시)
샘플 9 (가운데 사진에 마우스 올리면 타이틀이 나타납니다.(이것 역시 text_display="true" 인 경우만 표시됩니다.)
배포자 하하호호33
여기에서 행복한 시간 되십시오.