本帖最后由 qiqiminmin 于 2015-12-31 22:09 编辑

我这里并不是说如果制作Logo图标，反正您根据您的喜好生成就行了。因为我只是一个工程师。不会去设计多么复杂的图标。大体就是一个标准:对称。但问题来了。
想发布windows 10的软件，Logo图标各式各样，有 71x71,310x310,150x150的，还有各种scale， 看的眼睛就花，怎么办呢。?

(￣▽￣)"，答案也许很简单，自己做工具吧。我刚工作时，有幸在一些台湾工程师和新加坡工程师下工作。他们接受的教育方式似乎都一样（和我们还是有很大的不同），一个项目下来，他们第一件事就是用vc++生成各式各样的工具，什么生成字库的啊，自己的类生成器，需求文档生成脚本。总之，其实vs studio，是您手里最强大的工具，不多说了。希望爱好编程的人，每个人都尽量用C#,javascript来编一些方便自己的工具。我现在介绍个生成各种分辨率的小工具吧。

早在wp7开始，我就已经使用SVG来转自己的Logo图标。优点就是，各个分辨率，非常清楚，但是每次都是自己用其他软件转大小，很烦。直到windows 8时代，当winjs推出，(￣▽￣)", 那不是可以用winjs很方便的生成各个分辨率吧。因为winjs可以非常好的生成矢量图片。

思路
【1】打开文件 => 【2】用image打开图像 【3】在canvas里缩放 【4】将canvas转成 base64 【5】将base64保存成 png

[1] 把svg文件通过image,canvas转成 base64.. 如果还在单机时代，可以忽略什么是base64，但是一旦进入网络时代，一定要熟练 json, base64. 微软那个测年龄的网站就是利用base64的图像。
[mw_shl_code=csharp,true]

var tmpImg = new Image();
tmpImg.onload = function (img){
var width = ***;
var canvas = document.createElement('canvas');
canvas.width = width;
canvas.height = width;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, width, width);

var dataURL = canvas.toDataURL("image/png");

var byteCharacters = dataURL.replace("data:image/png;base64,", "");};
tmpImg.src = "*.svg";[/mw_shl_code]




[2] base64 转成 blob
[mw_shl_code=csharp,true]function b64toBlob(b64Data, c, s) {
var contentType = c || '';
var sliceSize = s || 512;

var byteCharacters = atob(b64Data);
var byteArrays = [];

for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
var slice = byteCharacters.slice(offset, offset + sliceSize);

var byteNumbers = new Array(slice.length);
for (var i = 0; i < slice.length; i++) {
byteNumbers = slice.charCodeAt(i);
}

var byteArray = new Uint8Array(byteNumbers);

byteArrays.push(byteArray);
}

var blob = new Blob(byteArrays, { type: contentType });
return blob;
}
[/mw_shl_code]


[3] Blob保存成文件
[mw_shl_code=csharp,true]function writeBlobToFile(blob,folder, filename) {
var deferred = $q.defer();


function Error(e) {
deferred.reject("");
}
// Open the picker to create a file to save the blob
folder.createFileAsync(filename, Windows.Storage.CreationCollisionOption.generateUniqueName).then(function (file) {
// Open the returned file in order to copy the data
file.openAsync(Windows.Storage.FileAccessMode.readWrite).then(function (output) {

// Get the IInputStream stream from the blob object
var input = blob.msDetachStream();

// Copy the stream from the blob to the File stream
Windows.Storage.Streams.RandomAccessStream.copyAsync(input, output).then(function () {
output.flushAsync().done(function () {
input.close();
output.close();
WinJS.log && WinJS.log("File '" + file.name + "' saved successfully to the Pictures Library!", "sample", "status");


deferred.resolve("ok");
}, Error);
}, Error);
}, Error);
}, Error);

return deferred.promise;
}[/mw_shl_code]

定义一个imgs: [284, 142, 72, 107, 89,600, 300, 150, 225, 188,1240, 620, 310, 465, 388,176, 88, 44, 66, 55,256, 48, 24, 16,200, 100, 75, 63, 50]
全部过一遍。

***附件停止解析***

***附件停止解析***

结果,，(￣▽￣)"，一次生成这么多，真舒服。是windows 10的，有兴趣的人多的话，我可以做成一个应用。。。。 jpg, png, bmp,svg都支持。
而且各种命名全部由 诸如 square71 square 150 , squre310, budge..等等，所有的都有。
***附件停止解析***


***附件停止解析***