PS指令碼篇--2.圖片尺寸重設，你瞭解多少？
摘要：
activeDocument物件在全域性物件app中，但可以直接使用,就像瀏覽器中document之於window
複製程式碼
一、批量圖片尺寸重設
這篇要解決一個問題:重新取樣 的各個配置,有什麼不同如何?
1.重新設定圖片尺寸： resizeImage
...
activeDocument物件在全域性物件app中，但可以直接使用,就像瀏覽器中document之於window 複製程式碼
一、批量圖片尺寸重設
這篇要解決一個問題:重新取樣 的各個配置,有什麼不同如何?
1.重新設定圖片尺寸： resizeImage
/**
* 重新設定圖片大小
* @param width 寬度 number
* @param height 高度 number
* @param resolution 解析度 number
* @param resampleMethod 重新取樣模式 {@link ResampleMethod}
* @param amount 減少雜色 number0 - 100
*/
resizeImage: function (width, height, resolution, resampleMethod, amount) {
},
ResampleMethod = { //重新取樣模式
AUTOMATIC: "自動",
BICUBIC: "兩次立方",
BICUBICAUTOMATIC: "兩次立方自動",
BICUBICSHARPER: "兩次立方（較銳利）（縮減）",
BICUBICSMOOTHER: "兩次立方（較平滑）（擴大）",
BILINEAR: "兩次線性",
NEARESTNEIGHBOR: "鄰近（硬邊緣）",
PRESERVEDETAILS: "保留細節（擴大）",
NONE: "無"
};
複製程式碼
2.封裝一個簡單的方法
obj = {
path: "K:\\圖片素材\\head\\",//資料夾
name: "wy.jpg",
config: {
width: 200,
height: 200,
dpi: 72,
ResampleMethod: ResampleMethod.BICUBIC,
}
};
resizeFile(obj,"res-");
/**
* 重新修改一個圖片的尺寸
* @param obj 物件
* @param fix 字首
*/
function resizeFile(obj, fix) {
var img = File(obj.path + obj.name);
var outName = obj.path + fix + obj.name;//輸出名
open(img);
var config = obj.config;
if (config.ResampleMethod === ResampleMethod.NONE) {
activeDocument.resizeImage(config.width, config.height);
} else {
activeDocument.resizeImage(config.width, config.height, config.dpi, config.ResampleMethod);
}
activeDocument.saveAs(File(outName), JPEGSaveOptions, true, Extension.LOWERCASE);
activeDocument.close(SaveOptions.DONOTSAVECHANGES)
}
複製程式碼
3.省力的for迴圈
models = [ResampleMethod.BICUBIC,//重新取樣模式
ResampleMethod.AUTOMATIC,
ResampleMethod.BICUBIC,
ResampleMethod.BICUBICAUTOMATIC,
ResampleMethod.BICUBICSMOOTHER,
ResampleMethod.BICUBICSHARPER,
ResampleMethod.BILINEAR,
ResampleMethod.NEARESTNEIGHBOR,
ResampleMethod.PRESERVEDETAILS,
ResampleMethod.NONE
];
for (var i = 0; i < models.length; i++) {
obj.config.ResampleMethod = models[i];
var fix = obj.config.ResampleMethod.toString().split(".")[1] + "-";
resizeFile(obj, fix);
}
複製程式碼
二、資料分析
想了一下用node還是python呢? 還是python吧，分析起來方便些
1.取樣模式的選擇對輸出大小的影響
為了方便說明，這裡用matplotlib把資料輸出一下
import os
import numpy as np
import matplotlib.pyplot as plt
from matplotlib.font_manager import FontProperties
class Datas:
def __init__(self, names=[], sizes=[], ratio=1.0):
self.names = names
self.sizes = sizes
self.ratio = ratio
def path2name(path):
return os.path.basename(path).split("-")[0]
def get_data(path):
datas = Datas()
paths = scan(path)
datas.names = map(path2name, paths)
datas.ratio = 4 / 9
for path in paths:
size = os.stat(path).st_size
size_kb = size / 1024
datas.sizes.append(size_kb)
return datas
# 獲取資料夾中的檔案
def scan(dir):
res = []
if os.path.exists(dir):
lists = os.listdir(dir)
for i in range(0, len(lists)):
sonPath = os.path.join(dir, lists[i])
res.append(sonPath)
if os.path.isdir(sonPath):
scan(sonPath)
return res
def draw_bar(labels, quants):
font = FontProperties(fname=r"c:\windows\fonts\msyh.ttc", size=14)
width = 0.5
ind = np.linspace(0, 9, 10)# 0.5~9.5 10個樣本
fig = plt.figure(1, figsize=(15, 5))# 編號, 寬和高,解析度, 背景顏色, 邊框顏色, 是否顯示邊框
ax = fig.add_subplot(111)# 一行一列取一塊
ax.bar(ind, quants, width, color='green')
ax.set_xticks(ind)
ax.set_xticklabels(labels, )
ax.set_ylabel('圖片大小/kB', fontproperties=font)# y標籤
ax.set_title('取樣模式', bbox={'facecolor': '0.8', 'pad': 5}, fontproperties=font)# 標題
plt.grid(True)
plt.show()
plt.savefig("bar.jpg")
plt.close()
if __name__ == '__main__':
datas = get_data(r"K:\圖片素材\head")
draw_bar(datas.names, datas.sizes)
複製程式碼
2.結果分析
做了三組資料: NEARESTNEIGHBOR 鄰近（硬邊緣）的尺寸比較大 BICUBICSMOOTHER 兩次立方（較平滑）（擴大）的尺寸比較小 複製程式碼
當然一張圖片的資料並不可靠，下面又做了幾組
總的來看，大小差異也不是很大，NEARESTNEIGHBOR 似乎都是最大的
3.看一下各自的效果
感覺可以寫個拼圖的指令碼，把一個資料夾的圖都拼在一起，將名字寫在下面
作為資料夾預覽圖感覺挺不錯...
三、圖片尺寸重設
也許對設計師而言，改個尺寸就是點兩下的事,就像呼吸一樣簡單自然。 那圖片尺寸重設的根源是什麼?
一張100px*100px的ARGB_8888圖片來說：是由10000個畫素組成的,一個畫素記錄argb四種顏色資訊 所以圖片 = 顏色資訊的排列組合 , 顯示器可以讀取這些資訊，然後呈現在人的面前 圖片尺寸往深了說就是：在削減資訊的同時保持色彩分佈的一致,這聽起來好像很厲害的樣子 人體由很多細胞構成，細胞中記錄著很多資訊,甩掉某些細胞然後變小，還能和原來長得一樣，正常生存 是不是想想就很奇妙。圖片和人類的區別在於，ps裡有一句api... 但圖片尺寸縮小意味著畫素資訊的丟失,無論如何，它已不再是曾經的它 關鍵就在於畫素該怎麼丟,於是幾種模式就應運而生： 複製程式碼
1. NEARESTNEIGHBOR: "鄰近（硬邊緣）"
方式： 將相鄰的畫素複製到新的位置，以改變畫素總值。 優點： 速度快 缺點： 不夠精確，影像邊緣粗糙不平滑，容易出現馬賽克。 適用： 細節較少，處理簡單、純色的影象 複製程式碼
2. BILINEAR: "兩次線性"
方式： 以2x2=4個畫素為基礎進行計算,替代原畫素以改變畫素總值。 優點： 質量要較鄰近法好,計算速度卻接近鄰近法 缺點： 不夠精確 適用： 細節較少，處理簡單、純色的影象 複製程式碼
3. BICUBIC: "兩次立方"
方式： 以4x4個畫素即16個畫素的面積來計算一個新的畫素,替代原畫素以改變畫素總值。 優點： 結果要更為精確，比較自然、平滑 缺點： 計算速度相對較慢 適用： 人物照等 複製程式碼
4. BICUBICSMOOTHER: "兩次立方（較平滑）（擴大）"
方式： 以兩次立方法基礎為基礎，取樣時會更注意影像色彩的漸變部分。 優點： 結果要更為精確，漸變更自然、平滑 缺點： 計算速度相對較慢 適用： 廣告攝影，風景，夕陽等漸變豐富、講究層次的影像中 複製程式碼
5. BICUBICSHARPER: "兩次立方（較銳利）（縮減）"
方式： 以兩次立方法基礎為基礎，取樣時會更注意影像的銳利度。 優點： 結果要更為精確，漸變更自然、平滑 缺點： 計算速度相對較慢 適用： 縮小 複製程式碼
6. PRESERVEDETAILS: "保留細節（擴大）"
方式： 主要是減少圖片的雜色。 優點： 圖片更加細膩 缺點： 計算速度相對較慢 適用： 精細的圖片 複製程式碼
其他幾個自動就不廢話了
四、分別率
1. dip和ppi
記得以前寫過一篇螢幕相關的文章，這裡再說一遍，畢竟還挺重要
ppi(Pixel Per Inch)，即每英寸的畫素。 dpi(Dot Per Inch)，即每英寸的點數。 複製程式碼
每英寸的畫素數能難倒你嗎? OPPO-R15X 的 ppi ： 2577px/6.4in = 402.65625 px/in約402.6ppi OPPO-A77 的 ppi ： 2202px/5.5in = 400.363... px/in約400.4ppi OPPO-R801 的 ppi ： 576px/3.5in = 164.571... px/in約164.6ppi 複製程式碼
ppi形象一點的比喻：
一個一元硬幣直徑約1 in，現在讓一元硬幣(包括背景)等大顯示在三個手機上：
OPPO-R15X需要用：`402*402=161604 個畫素點` OPPO-A77需要用：`400*400=160000 個畫素點` OPPO-R15X需要用：`164*164=26896 個畫素點` 我們知道畫素組成了顯示的圖片，也就是說用161604個點和26896個點組成相同的畫面 那麼26896的那個看起來效果自然要比161604的差很多,161604更加緊密，所以視覺感好 複製程式碼
來分析一下膝上型電腦：
膝上型電腦 的 ppi ： 21567 / 14=111.928.. px/in約112ppi 也就是 1 in 裡有112個畫素點，`1 in = 25.4mm` 人眼可視長度是0.1mm,所以你近些看可以看到顆粒 普通的web圖片只要求72dpi就夠了，因為只是顯示在螢幕上而言 複製程式碼
列印精度: dpi
dpi又是什麼鬼，點數又是什麼鬼?---dpi稱為列印精度 印表機將[彩色液體油墨]經噴嘴變成細小微粒噴到印紙上,一個顆粒代表1點 dpi的意思是每英寸墨滴點數，比如300dpi的意思就是每英寸墨滴的個數為300 300dpi 和 72dpi 的區別: 用300個點表示一個硬幣的視覺資訊，和72個點表示一個硬幣的視覺資訊 可想而知300的更加精細，在紙上至少要300dpi才能滿足視覺要求，所以 大學時做要列印的ps產品效果圖都要把圖片的dpi調到300以上，因為需要列印 複製程式碼
現在應該撥開雲霧見青天了，只在瀏覽器中dpi沒有用，px為王 在列印的時候dpi會發揮作用: 同px的圖片dpi越大，圖片越小!圖片越小!圖片越小!
因為這樣更精細，Over,就這樣。