`

Photoshop切图批处理脚本

 
阅读更多
http://www.wxwdesign.com/archives/photoshop%E5%88%87%E5%9B%BE%E6%89%B9%E5%A4%84%E7%90%86%E8%84%9A%E6%9C%AC



类似Google地图的东西,整个地图尺寸很大,要在网页上用,需要切成小的碎片,Google地图的每一片是256px*256px。

目前恰好遇到了这样一个问题,手里拿到了一张很大的图,需要切成碎片,粗略算了一下,最后生成的切片大概2000张左右,如果手工一点一点的切,按10秒/张的速度,需要连续不停地切5.56个小时,擦,这不是闲得蛋疼吗?

于是乎,想到了用批处理,但这个工程又不是个简单的批处理,只有一个原图,需要把一张图切成2000张,最后感觉还是用脚本比较合适。

这种脚本在百度和谷歌里很难找,一个用PS做设计的人,难道你想让她琢磨脚本程序?搜了一番,发现还是有人写过PS的脚本,下载来参考了一下,又到Adobe官网下载了Scripts参考手册,自己也写了一个切图的脚本。



[脚本截图]



另外推荐一个PS脚本论坛,感觉比adobe的官方论坛还要好一些。(http://ps-scripts.com/)

脚本源代码:(参考了蓝色理想Photoshop版的一个“改变尺寸”脚本)


//激活Photoshop,设置为活动窗口
app.bringToFront();

var PRESOLUTION=72;
var startRulerUnits=app.preferences.rulerUnits;
var startTypeUnits=app.preferences.typeUnits;
app.preferences.rulerUnits = Units.PIXELS;
app.preferences.typeUnits = TypeUnits.PIXELS;

var dialogue="dialog{\
    text:'自动切图V0.1',\
	group:Group{\
		orientation:'column',\
		alignChildren:'left',\
	    process:StaticText{text:'处理进度:',bounds:[0,0,300,14]},\
		timeline:Progressbar{bounds:[0,0,300,10],minvalue:0,maxvalue:100}\
		corrdination:Panel{\
			orientation:'row',\
            text:'裁剪尺寸',\
            x:Group{\
				orientation: 'row', \
                s: StaticText { text:'宽:' }, \
                e: EditText { preferredSize: [50, 20],text:128} ,\
                p: StaticText { text:'px' }, \
            }, \
            y: Group {\
				orientation: 'row', \
                s: StaticText { text:'高:' }, \
                e: EditText { preferredSize: [50, 20],text:64}, \
                p: StaticText { text:'px' }, \
            } ,\
        }, \
		fileResource:Group{\
			orientation: 'row', \
			buttonSelect: Button{text:'待裁剪文件', properties:{name:'open'} ,helpTip:'请选择待裁剪的文件'},\
			inputText: EditText{ text:'C:/Users/wxw/Desktop/map5_5.jpg', preferredSize: [180, 20] },\
		},\
	},\
	saveFileType:Group{\
		orientation:'row', \
		s:StaticText{text:' 存储类型:'},\
		typeList:Group{\
			jpeg:RadioButton {text:'JPEG',value:true},\
			gif:RadioButton {text:'GIF'},\
			png8:RadioButton {text:'PNG-8'},\
			png24:RadioButton {text:'PNG-24'},\
		}\
	}, \
	saveAsOptions:Panel{\
		orientation: 'column',\
		alignChildren:'left',\
        text: '另存为设置', \
		Quality:Group{\
			orientation: 'row',  \
			q: StaticText { text:'压缩质量:' }, \
			e: EditText {text:'60',preferredSize: [50,20],helpTip:'范围0-100,值越大图像越好'} ,\
			color: StaticText { text:'颜色:' }, \
			select: DropDownList { alignment:'left', itemSize: [26,14] },\
			opacity:Checkbox {text:'透明',value:true,helpTip:'包含基于颜色不透明度的透明性'},\
		}, \
		filePrefix:Group{\
			orientation: 'row',  \
			s: StaticText { text:'在文件名前添加字符:' }, \
			e: EditText { preferredSize: [50,20],text:'cutCopy'} ,\
			s2: StaticText { text:'勿含非法字符' , enabled:flase }, \
		}, \
		fileSubfix: Group {\
			orientation: 'row',  \
			s: StaticText { text:'在文件名后添加字符:' }, \
			e: EditText { preferredSize: [50, 20] }, \
			s2: StaticText { text:'勿含非法字符' , enabled:flase}, \
		} ,\
		fileNameType:Group{\
			orientation: 'row',  \
			q: StaticText { text:'输出文件命名方式:' }, \
			typeList:Group{\
			    single:RadioButton {text:'序列化'},\
			    double:RadioButton {text:'双循环',value:true},\
		    }\
		}, \
		finishProcess:Group{\
			orientation: 'row',  \
			q: StaticText { text:'处理完成后:' }, \
			c:Checkbox {text:'关闭文件',value:true},\
			c2:Checkbox {text:'显示处理时间',value:true},\
		}, \
		saveAsFolder:Group{\
			orientation: 'row', \
			buttonSelect: Button {text:'另存至', properties:{name:'save'} ,helpTip:'请选择文件要保持的目录'},\
			inputText: EditText  { text:'C:/Users/wxw/Desktop/cutCopys', preferredSize: [180, 20] },\
		},\
	},\
	tips:Panel{\
	    orientation:'row',\
		alignment:'left',\
        text: '提醒', \
	    s:StaticText{text:'默认保存方式为直接覆盖,请注意做好备份。'},\
	},\
	buttons:Group{\
		orientation:'row',\
		alignment:'right',\
        about:StaticText {text:'[关于程序]'},\
		Btnok: Button { text:'确定', properties:{name:'ok'} }, \
        Btncancel: Button { text:'取消', properties:{name:'cancel'} } \
    }, \
}";

//初始窗口对象
var win=new Window(dialogue);
//初始保存设置
var saveFileType="JPEG";
var exportOptions=new ExportOptionsSaveForWeb();
exportOptions.format=SaveDocumentType.JPEG;
exportOptions.quality=60;
var saveFileSubFix='jpg';
var filePrefix="",fileSubfix="";

//选择要裁剪的文件
win.group.fileResource.buttonSelect.onClick= function(){
    var selectedFile=File.openDialog('选择待裁剪文件');
    if(selectedFile!=null){
       win.group.fileResource.inputText.text=selectedFile.fsName;
	   win.group.fileResource.inputText.helpTip=selectedFile.fsName.toString();
    }
}

//另存为目录选择
win.saveAsOptions.saveAsFolder.buttonSelect.onClick=function(){
    var saveFolder=win.saveAsOptions.saveAsFolder;
    var defaultFolder=saveFolder.inputText.text;
	var testFolder=new Folder(defaultFolder);
	if(!testFolder.exists){
		defaultFolder="~";
	}
	var selectFolder=Folder.selectDialog("选择存储文件夹",defaultFolder);
	if(selectFolder!= null ){
	    saveFolder.inputText.text=selectFolder.fsName;
		saveFolder.inputText.helpTip=selectFolder.fsName.toString();
	}
}

//颜色下拉选择
var colorList=[256,128,64,32,16,8,4,2];
for(var i=0,len=colorList.length;i<len;i++){
    win.saveAsOptions.Quality.select.add("item",colorList[i]);
}
win.saveAsOptions.Quality.select.items[0].selected=true;
//对象不可用
win.saveAsOptions.Quality.color.enabled=false;
win.saveAsOptions.Quality.select.enabled=false;
win.saveAsOptions.Quality.opacity.enabled=false;

//选择存储格式
var saveFileTypeList=win.saveFileType.typeList;

function toggleQuality(Options){
    //开启颜色选项
	win.saveAsOptions.Quality.color.enabled=Options.enableColor;
    win.saveAsOptions.Quality.select.enabled=Options.enableColor;
    win.saveAsOptions.Quality.opacity.enabled=Options.enableColor;
	//关闭压缩质量
	win.saveAsOptions.Quality.q.enabled=Options.enablePack;
    win.saveAsOptions.Quality.e.enabled=Options.enablePack;
}

function selectFileType(target){
    saveFileType=target.text;
	exportOptions=new ExportOptionsSaveForWeb();
    switch(saveFileType){
	    case 'JPEG':
		    toggleQuality({enableColor:false,enablePack:true});
			exportOptions.format=SaveDocumentType.JPEG;
            exportOptions.quality=win.saveAsOptions.Quality.e.text;
			saveFileSubFix='jpg';
		break;
		case 'GIF':
		    toggleQuality({enableColor:true,enablePack:false});
			exportOptions.format=SaveDocumentType.COMPUSERVEGIF;
            exportOptions.colors=256;
            exportOptions.transparency=win.saveAsOptions.Quality.opacity.value;
			saveFileSubFix='gif';
		break;
		case 'PNG-8':
		    toggleQuality({enableColor:true,enablePack:false});
			exportOptions.format=SaveDocumentType.PNG;
            exportOptions.colors=256;
			exportOptions.transparency=win.saveAsOptions.Quality.opacity.value;
            exportOptions.PNG8=true;
			saveFileSubFix='png';
		break;
		case 'PNG-24':
		    toggleQuality({enableColor:false,enablePack:false});
			exportOptions.format=SaveDocumentType.PNG;
			exportOptions.transparency=win.saveAsOptions.Quality.opacity.value;
            exportOptions.PNG8=false;
			saveFileSubFix='png';
		break;
	}
}
//绑定文件类型选择
saveFileTypeList["jpeg"].onClick=function(){selectFileType(this);}
saveFileTypeList["gif"].onClick=function(){selectFileType(this);}
saveFileTypeList["png8"].onClick=function(){selectFileType(this);}
saveFileTypeList["png24"].onClick=function(){selectFileType(this);}

//生成裁剪的文件
function createCutCopy(h,w,width,height,fileName){
    //添加一个选区
    app.activeDocument.selection.select([[w*width,h*height],[(w+1)*width,h*height],[(w+1)*width,(h+1)*height],[w*width,(h+1)*height],[w*width,h*height]]);
	//剪切选区
    app.activeDocument.selection.cut();
	//创建一个新文档
    var newDoc=app.documents.add(width,height,72,fileName,NewDocumentMode.RGB,DocumentFill.TRANSPARENT);
	//粘帖当前粘帖板内容
    app.activeDocument.paste();
	//导出web所用格式
    newDoc.exportDocument(File(win.saveAsOptions.saveAsFolder.inputText.text+'/'+filePrefix+fileName+fileSubfix+'.'+saveFileSubFix),ExportType.SAVEFORWEB,exportOptions);
	//关闭文件,不保存
	newDoc.close(SaveOptions.DONOTSAVECHANGES);
}

//处理裁剪
function cutProcess(){
    //判断当前是否有文件已经打开
    if(app.documents.length>1){
	    alert("请先关闭不需要裁剪的文件!");
		return false;
	}
    //打开要裁剪的文件
    var fileResource=File(win.group.fileResource.inputText.text);
	app.open(fileResource);
	//合并所有图层
	app.activeDocument.flatten();
	//获得文档的宽和高
	var resourceWidth=app.activeDocument.width;
	var resourceHeight=app.activeDocument.height;
	//获得裁剪的尺寸
    var cutWidth=parseInt(win.group.corrdination.x.e.text,10);
    var cutHeight=parseInt(win.group.corrdination.y.e.text,10);
	//获得可裁剪成的文件数
	var cutXNumber=Math.ceil(resourceWidth/cutWidth);
	var cutYNumber=Math.ceil(resourceHeight/cutHeight);
	var cutNumber=cutXNumber*cutYNumber;
	if(cutNumber>10){
	    var confirmCutNumber=confirm("要终止程序执行吗?\r\n生成文件比较多,\r\n可能需要很长时间处理。",undefined,"停止程序执行?");
	}
	if(confirmCutNumber){return false;}
	//循环处理裁剪
	var sum=0;
	var isSingle=win.saveAsOptions.fileNameType.typeList.single.value;
	var startTime=new Date().getTime(),totalTime='';
	for(var y=0;y<cutYNumber;y++){
	    for(var x=0;x<cutXNumber;x++){
		    //显示处理进度
			sum=y*cutXNumber+x+1;
			//进度条
			win.group.timeline.value=Math.round(sum/cutNumber*100);
			//进度文字状态
	        win.group.process.text='处理进度'+Math.round(sum/cutNumber*100)+'%,';
			win.group.process.text+='['+sum+'/'+cutNumber+'] ';
			if(isSingle){
			    win.group.process.text+='文件:'+filePrefix+sum+fileSubfix+'.'+saveFileSubFix;
			    createCutCopy(y,x,cutWidth,cutHeight,sum);
			}else{
			    win.group.process.text+='文件:'+filePrefix+'x'+(x+1)+'y'+(y+1)+fileSubfix+'.'+saveFileSubFix;
			    createCutCopy(y,x,cutWidth,cutHeight,'x'+(x+1)+'y'+(y+1));
			}
			if(sum>=cutNumber){
			    //关闭文件
				if(win.saveAsOptions.finishProcess.c.value){
				    app.activeDocument.close(SaveOptions.DONOTSAVECHANGES);
				}
				//显示处理时间
				if(win.saveAsOptions.finishProcess.c2.value){
				    totalTime='用时:'+Math.round((new Date().getTime()-startTime)/1000)+'秒';
				}
			    alert("裁剪完毕!"+totalTime);
				//关闭对话框
				win.close();
			}
		}
	}
}

//判断设定
function checkSetting(){
    if(!win.group.corrdination.x.e.text||win.group.corrdination.x.e.text<1){alert("请设置宽度");return false;}
	if(!win.group.corrdination.y.e.text||win.group.corrdination.y.e.text<1){alert("请设置高度");return false;}

	if(!win.group.fileResource.inputText.text){alert("请选择待裁剪文件");return false;}
	if(!File(win.group.fileResource.inputText.text).exists){alert("文件不存在!");return false;}

	if(!win.saveAsOptions.saveAsFolder.inputText.text){alert("请选择存储目录");return false;}
	if(!Folder(win.saveAsOptions.saveAsFolder.inputText.text).exists){alert("目录不存在!");return false;}

	if(saveFileType=="JPEG"){
	    if(!win.saveAsOptions.Quality.e.text){
		    alert("请设置压缩质量");
			return false;
		}
		if(win.saveAsOptions.Quality.e.text<1||win.saveAsOptions.Quality.e.text>100){
		    alert("压缩质量参数错误!");
			return false;
		}
	}

	//文件名前后缀
	filePrefix=win.saveAsOptions.filePrefix.e.text;
    fileSubfix=win.saveAsOptions.fileSubfix.e.text;
	//alert(win.group.corrdination.x.e.text);
	//alert("checkOk");
	cutProcess();
}

//确定按钮
win.buttons.Btnok.onClick=function(){
	checkSetting();
}
//取消按钮
win.buttons.Btncancel.onClick=function(){
	app.preferences.rulerUnits=startRulerUnits;
	app.preferences.typeUnits=startTypeUnits;
	this.parent.parent.close();
}
//关于
win.buttons.about.onClick=function(){
    alert("自动切图专用工具V1.0\r\n Power By:www.wxwdesign.com \r\n 流水涵清","About");
}

//窗口居中
win.center();
//显示窗口
win.show();


WordPress编辑器贴代码真蛋疼,不太好用,还不如UBB好用,拿到IDE里格式化一下就好了。
分享到:
评论

相关推荐

    批量切图软件

    批量切图软件是专为网店卖家精心设计的一款切图软件,解决了网站卖家切图难、重复性工作量大的问题。它可以一次针对多张照片,根据设定的块数或大小进行一键切图,切好的图自动保存到指定的目录下,简单实用。使用本...

    adobe photoshop自动切图脚本

    使用方法:photoshop顶部菜单栏-&gt;文件-&gt;脚本-&gt;浏览 选择文件根据提示即可以进行自动化切图,支持photoshop cc2017及以上版本 提示:需取消图层锁定,至此多文件批量处理,执行脚本之前最好整理并合并图层以及分组,...

    photoshop切图教程

    Photoshop切图教程主要涉及网页制作中的一个重要环节——将设计稿转化为可网页编辑的元素。切图技术在网页设计中起到关键作用,它允许设计师将复杂的图像分解为多个切片,以便于在不同设备和屏幕尺寸下保持页面的...

    Photoshop切图

    Photoshop切图是网页制作中的关键技术,用于将设计师创作的静态图像转化为适应网页布局的多个独立元素。在Photoshop中,切图涉及到一系列步骤和技巧,以确保最终的网页效果符合设计要求,同时保证文件大小优化,加载...

    photoshop cs6自动切图插件

    photoshop cs6自动切图插件 根据分组切图

    photoshop网站切图高级教程.doc

    photoshop网站切图高级教程

    photoshop的切图手法总结

    切图是Photoshop中的一个重要环节,它涉及到将设计稿中的各个元素按照需求分割成独立的图片,以便于前端开发人员进行网页制作。以下是对Photoshop切图手法的详细总结: 首先,切图时应根据实际需要选择合适的保存...

    photoshop div+css切图教程

    本教程主要聚焦于如何在Photoshop中进行"div+css切图",这是一种将设计稿转化为前端代码的重要步骤。 首先,我们需要理解什么是“切图”。切图,即网页设计完成后,设计师在Photoshop中按照网页布局的需求,将设计...

    photoshop网页切图教程.pdf

    本教程旨在教授如何使用Adobe Photoshop进行网页设计的切图,并将其转换成网页代码。在开始之前,需要对网页设计的基本概念有所了解,包括HTML、CSS以及Photoshop的基本操作。 首先,熟悉HTML(HyperText Markup ...

    PxCook_(ps切图插件).exe

    PxCook(像素大厨):可以对设计图进行标注。...使用photoshop打开你的psd图,通过编辑-&gt;增效工具-&gt;开启远程连接的支持。勾选"启用远程连接",输入密码,点击确定。(记住这一步的密码,之后要用)

    PSLayersExporter:jsx脚本导出Photoshop图层

    `PSLayersExporter`是一个基于JavaScript(jsx)的Photoshop脚本,专门用于帮助用户高效地导出Photoshop中的各个图层,极大地提高了工作效率。 `PSLayersExporter`脚本的核心功能是自动化图层导出过程。通常,手动...

    影象切图脚本生成工具

    对于开发者来说,源代码可能提供了一个学习图像处理算法和批处理脚本编写的好机会。 总的来说,"影象切图脚本生成工具"是一个强大的图像处理工具,通过设置坐标范围和步长,可以快速批量生成影像切片,适用于各种...

    前端切图-photoshop界面设置.pdf

    Photoshop 是一款强大的图像处理和设计软件,广泛应用于前端开发中的切图工作。切图是将设计稿转化为可编程的网页元素的过程,对于前端开发者来说至关重要。以下将详细讲解Photoshop界面设置及其在切图过程中的应用...

    deepzoom_tile.zip_deepzoom_tile_deep切图_切图脚本

    《深入理解DeepZoomTile技术与切图脚本的运用》 在数字图像处理领域,DeepZoomTile技术是一种常用于创建高分辨率图像查看器的技术,它允许用户以无缝、平滑的方式浏览超大图像,尤其在网页和应用程序中广泛应用。...

    Photoshop把PSD网站模板切图为XHTML.doc

    Photoshop把PSD网站模板切图为XHTML

    Cutterman 3.5.1.zip

    Cutterman是一款专门为Adobe Photoshop设计的强大切图工具,它的出现极大地提升了设计师的工作效率。Cutterman 3.5.1是该软件的一个免费版本,它提供了丰富的切图功能,适用于网页设计、移动应用界面设计等领域。 ...

    ps批量切图.rar

    如果是脚本或插件,它可能需要在Photoshop中安装并配置,然后通过菜单、快捷键或者自定义工作流来触发一键切图的功能。这类工具通常会根据用户的需求,如不同的设备屏幕尺寸,自动调整切图尺寸,同时保持元素的清晰...

    Photoshop(PS)切图教程 DIV CSS开发之PS软件教程 DIVCSS5.docx

    本文将深入讲解Photoshop在切图、抠图、Logo制作以及水印制作等方面的应用,并提供相关教程资源。 1. **PS切图基础** 切图是指将设计稿中的各个元素按照需求切割成独立的图片,以便于在网页中进行精确布局。在PS中...

    卡特曼-切图工具

    "卡特曼-切图工具"是一款专为Photoshop用户设计的强大切图工具,它极大地提高了设计师在工作流程中的效率。这款工具以其易用性和高效性而受到广泛好评,是许多专业设计师进行网页和移动应用界面设计时不可或缺的辅助...

Global site tag (gtag.js) - Google Analytics