射手影音皮肤设计制作教程

射手影音是一款国产的播放器，一直都是国产的支持者。现在射手影音播放器支持皮肤自己设计制作了哦，不会的就看看小编带来的教程吧！

射手影音皮肤设计制作教程：

一、了解影音皮肤设计框架

ok！同学们，现在开始给影音进行解剖，看看它的构造和我们人类有什么不同，解剖到任何区域我都由左往右一个个器官进行介绍，同学们要坚持住哦！ 

区域1： 

影音的顶部，由顶部背景图片、logo文字图片、缩进系统按钮、缩小按钮、延展按钮（原始大小）、关闭按钮组成。

区域2： 

影音的tips，先由tips背景图片，左边由放大1倍、放大2倍、标准画面（去上下黑边、去左右黑边）、音轨选择、画质增益，右边由正常播放（单曲循环、列表循环）、亮度对比度、截图、全屏切换（原始缩进）、窗口置前（窗口正常）、关闭按钮（全屏时才出现）组成。

区域3： 

影音的控制栏，先是控制栏背景图片，剩下的先分为左、中、右三个部分来观察它吧 

左边由logo、分享按钮、字幕左箭头、字幕按钮、字幕右箭头 

中边由上一段、快退、停止、播放（暂停）、步进、快进、下一段 

右边由打开文件、播放列表、设置面板、声音开启（静音）、声音大小调节按钮、声音调整背景图组成

区域4： 
影音的边框由影音边框组成组成

区域5： 

影音的打开文件部分，由影音打开文件按钮组成 
这个打开文件与区域3右边的打开文件功能一样但视觉大小有区别

二、影音皮肤设计制作要点

上一节我们对影音进行了全面解剖，额~大家小心点不要踩到，不然影响后期拼装，配合一下，谢谢 ……
ok，知道了影音的组成元素，要记住他们哦，麻雀虽小，五脏还是要全的！

背景图片制作方法： 
(在skins文件甲下创建一个framecfg.dat) 

区域1： 
顶部背景图片



分为abc三个部分组成一张图，a与c同等宽度与高度，b则横向无限延展

编辑framecfg.dat

//标题栏 

captionheight:31;  //标题栏框横向延展图高度b区域 

lcaptionthickwidth:3;//标题栏框左边图宽度a区域 

rcaptionthickwidth:3;//标题栏框右边图宽度c区域

区域2： 
tips背景图片，为一个颜色块来做横向无限延展背景图

区域3： 

控制栏背景图片

切掉两边取中间a部分1px图横向无限延展

声音调整背景图


作为贴图背景

区域4： 

影音边框

取4个角，4个1px边做为无限延展 

编辑framecfg.dat
//框架
framecornerwidth:3;//圆角的宽度
framecornerheight:3;//圆角的高度
lframethickheight:1;//左边框纵向延展高度
tframethickwidth:1;//顶部框横向延展宽度
rframethickheight:1;//左边框纵向延展高度
bframethickwidth:1;//底部框横向延展宽度
按钮图片制作方法：

所有的可操作按钮只需要做一张显示图即可，操作的状态效果系统会自动实现，减轻了很大的工作量，还不错吧
制作规范：
图片格式：bmp
图片尺寸：无
图片命名：需与原始文件名对应上，见影音元素命名表
图片元素命名表：
区域1：
顶部背景图片           caption
logo文字图片        captiontext
缩进系统按钮          btn_mintotray_single
缩小按钮                   minimize_single
延展按钮                    maximize_single               原始大小        restore_single
关闭按钮                   close_single   

区域2：
tips背景图片             topbackground
放大1倍                     top_1x_single
放大2倍                     top_2x_single
标准画面        top_normal_wider_single
（去上下黑边top_normal_single                、            去左右黑边top_letterbox_wider_single）
音轨选择       top_audio_single
画质增益        top_video_single
正常播放        top_nocycle_single
（单曲循环top_singlecycle_single          、        列表循环top_allcycle_single）
亮度对比度             top_gamma_single
截图                   top_capture_single
全屏切换      top_fullscreen_single               （原始缩进top_restore_single）
窗口置前      pinail2_single （窗口正常pinail_single）  
关闭按钮      top_close_single
区域3：
控制栏背景图片      bottombackground
左边由
logo                       splayer
分享按钮                btn_share_single
字幕左箭头           btn_sub_delay_reduce_single
字幕按钮               btn_sub_single
字幕右箭头          btn_sub_delay_increase_single
中边由
上一段                  btn_prev_single
快退                      fast_backword_single
停止                     btn_stop_single
播放         btn_play_single           （暂停         btn_pause_single）
步进             btn_step_single
快进              fast_forword_single
下一段          btn_next_single
右边由
打开文件              btn_openfile_small_single
播放列表              btn_playlist_single
设置面板              btn_setting_single
声音开启     volume_single      （静音   muted_single）           
声音大小调节按钮      volume_tm_single
声音调整背景图      volume_bg
区域4：
影音的边框由影音边框组成    framecorner
区域5：
影音打开文件按钮       btn_bigopen_single
其他元素：
预览图      皮肤名称 single
影音标示       watermark2

三、上传
步骤：
1：整理好图片元素，对应好图片名
2：在splayer\skins下自建文件夹命名为xxxx
3：再将整理好的图片元素放入xxxx中
4：打开射手影音播放器右键  界面==》选择xxxx皮肤
5：恭喜您已经成功的做了一套符合自己的皮肤了