Skip to content

Commit

Permalink
feat: 添加品牌机型显示和参数显示选项，修改图片占比
Browse files Browse the repository at this point in the history
  • Loading branch information
云中君 committed Oct 28, 2023
1 parent 2ede647 commit a274a58
Show file tree
Hide file tree
Showing 5 changed files with 106 additions and 40 deletions.
6 changes: 3 additions & 3 deletions electron/main/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,11 +20,11 @@ let win: BrowserWindow | null = null;
async function createDefWin() {
win = await createWindow('main', {
minWidth: 550,
minHeight: 250,
minHeight: 300,
maxWidth: 550,
maxHeight: 250,
maxHeight: 300,
width: 550,
height: 250,
height: 300,
title: '壹印',
frame: false,
});
Expand Down
30 changes: 27 additions & 3 deletions electron/src/modules/tools/blur.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,26 @@ import fluentFfmpeg from 'fluent-ffmpeg';
import fs from 'fs';
import sharp from 'sharp';

interface Option {
export interface Option {
/**
* 是否横屏显示
*/
landscape: boolean

/**
* 是否显示参数
*/
ext_show: boolean

/**
* 是否显示机型
*/
model_show: boolean

/**
* 是否显示品牌
*/
brand_show: boolean
}

export async function createBlurImg(filePath: string, toFilePath: string, option?: Option) {
Expand Down Expand Up @@ -62,8 +77,17 @@ export async function createScaleImg(filePath: string, toFilePath: string, optio
const originWidth = rotateFileInfo.info.width;
const originHeight = rotateFileInfo.info.height;

let heightRate = 0.83;
if (!option.ext_show) {
heightRate += 0.05;
}

if (!option.brand_show) {
heightRate += 0.05;
}

const blurImgHeight = option.landscape && originWidth < originHeight ? originWidth : originHeight;
const contentHeight = Math.round(blurImgHeight * 0.8);
const contentHeight = Math.round(blurImgHeight * heightRate);
const resize = { width: 0, height: 0 };

resize.width = Math.round((originWidth / originHeight) * contentHeight);
Expand Down Expand Up @@ -112,7 +136,7 @@ export async function sharpComposite(bgPath: string | Buffer, mainPath: string,

const rem = originHeight / 3712;
const contentOffsetX = Math.round((originWidth - mainImgInfo.width) / 2);
const contentOffsetY = Math.round((originHeight - mainImgInfo.height) / 3);
const contentOffsetY = Math.round((originHeight - mainImgInfo.height) / (!textInfo.title?.data && !textInfo.info?.data ? 2 : 3));

return new Promise((resolve, reject) => {
const composite: any[] = [
Expand Down
4 changes: 3 additions & 1 deletion electron/src/router/query.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import path from 'node:path';
import { createWindow } from '../../main/create-window';
import routerConfig from '../../router-config';
import { Router } from '../modules/router';
import { createBlurImg, createScaleImg, getExifInfo, sharpComposite } from '../modules/tools/blur';
import { createBlurImg, createScaleImg, getExifInfo, sharpComposite, Option } from '../modules/tools/blur';
import md5 from '../utils/md5';

const r = new Router();
Expand Down Expand Up @@ -79,6 +79,7 @@ r.listen<any, boolean>(routerConfig.startTask, async (data) => {
exifInfo,
blur: blurInfo,
scale: scaleInfo,
option: data.option,
});
}

Expand All @@ -102,6 +103,7 @@ r.listen<any, any>(routerConfig.composite, async (data) => {
}

await sharpComposite(buffer, scalePath, path.resolve(config.output, data.name), data.text);
// fs.writeFileSync(path.resolve(cacheDir, `${data.md5}_mask.jpg`), buffer)
fs.rmSync(scalePath);
fs.rmSync(blurPath);
} catch (e) {
Expand Down
24 changes: 24 additions & 0 deletions web/main/app.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,9 @@
let outputDirName = '';
const option = {
landscape: false,
ext_show: true,
model_show: true,
brand_show: true,
};
const output = {
path: '',
Expand Down Expand Up @@ -112,6 +115,27 @@
<Switch bind:value={option.landscape} size="mini" />
</span>
</p>

<p>
<span class="config-title">参数显示:</span>
<span class="config-value">
<Switch bind:value={option.ext_show} size="mini" />
</span>
</p>

<p>
<span class="config-title">机型显示:</span>
<span class="config-value">
<Switch bind:value={option.brand_show} size="mini" />
</span>
</p>

<p>
<span class="config-title">显示机型加型号:</span>
<span class="config-value">
<Switch bind:value={option.model_show} size="mini" />
</span>
</p>
</div>
</div>

Expand Down
82 changes: 49 additions & 33 deletions web/mask/app.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@
try {
const blurImg = await loadImage(task.blur);
const scaleImg = await loadImage(task.scale);
const textImgInfo = createExifImg(task.exifInfo, task.blur.height);
const textImgInfo = createExifImg(task.exifInfo, task.blur.height, task.option);
const maskUrl = await createBoxShadowMark(canvas, {
img: blurImg,
Expand All @@ -33,13 +33,15 @@
blur: Math.min(375 * (task.blur.width / ORIGIN_W), 250),
radius: Math.min(250 * ((task.blur.width / task.blur.height) / ORIGIN_RATIO), 100),
},
option: task.option,
});
await window.api.composite({
name: task.name,
md5: task.md5,
mask: maskUrl,
text: textImgInfo,
option: task.option,
});
} catch (e) {
console.log(e);
Expand Down Expand Up @@ -74,8 +76,13 @@
ctx.fillRect(0, 0, _canvas.width, _canvas.height);
ctx.fillStyle = 'black';
let heightPosition = 3;
if (!option.option.ext_show && !option.option.brand_show) {
heightPosition = 2;
}
const contentOffsetX = Math.round((_canvas.width - option.contentImg.width) / 2);
const contentOffsetY = Math.round((_canvas.height - option.contentImg.height) / 3);
const contentOffsetY = Math.round((_canvas.height - option.contentImg.height) / heightPosition);
ctx.shadowOffsetX = option.shadow.offsetX; // 阴影水平偏移
ctx.shadowOffsetY = option.shadow.offsetY; // 阴影垂直偏移
Expand Down Expand Up @@ -144,51 +151,60 @@
};
}
function createExifImg(exifInfo, maxHeight) {
function createExifImg(exifInfo, maxHeight, option) {
const exif = {
title: null,
info: null,
};
if (exifInfo.Model) {
exifInfo.Model = exifInfo.Model.replace('Z', 'ℤ');
if (option.brand_show && exifInfo.Model) {
if (!option.model_show) {
const i = exifInfo.Model.indexOf(' ');
exifInfo.Model = exifInfo.Model.substring(0, i === -1 ? exifInfo.Model.length : i);
}
else {
exifInfo.Model = exifInfo.Model.replace('Z', 'ℤ');
}
const titleText = exifInfo.Model && charToNumberChar(exifInfo.Model[0]) + charToNumberChar(exifInfo.Model.slice(1).toLowerCase());
exif.title = createTextImg({
text: titleText,
color: '#ffffff',
fontSize: 100 * (maxHeight / ORIGIN_H),
fontSize: (option.ext_show ? 100 : 120) * (maxHeight / ORIGIN_H),
});
}
const infoTextArr = [];
if (exifInfo.FocalLength) {
infoTextArr.push(`${exifInfo.FocalLength}mm`);
}
if (exifInfo.FNumber) {
infoTextArr.push(`f/${exifInfo.FNumber}`);
}
if (exifInfo.ExposureTime) {
if (exifInfo.ExposureTime < 1) {
infoTextArr.push(`1/${1 / exifInfo.ExposureTime}s`);
} else {
infoTextArr.push(`${exifInfo.ExposureTime}s`);
if (option.ext_show) {
const infoTextArr = [];
if (exifInfo.FocalLength) {
infoTextArr.push(`${exifInfo.FocalLength}mm`);
}
if (exifInfo.FNumber) {
infoTextArr.push(`f/${exifInfo.FNumber}`);
}
if (exifInfo.ExposureTime) {
if (exifInfo.ExposureTime < 1) {
infoTextArr.push(`1/${1 / exifInfo.ExposureTime}s`);
} else {
infoTextArr.push(`${exifInfo.ExposureTime}s`);
}
}
if (exifInfo.ISO) {
infoTextArr.push(`ISO${exifInfo.ISO}`);
}
if (infoTextArr.length) {
exif.info = createTextImg({
text: infoTextArr.join(' '),
color: '#ffffff',
fontSize: 80 * (maxHeight / ORIGIN_H),
});
}
}
if (exifInfo.ISO) {
infoTextArr.push(`ISO${exifInfo.ISO}`);
}
if (infoTextArr.length) {
exif.info = createTextImg({
text: infoTextArr.join(' '),
color: '#ffffff',
fontSize: 80 * (maxHeight / ORIGIN_H),
});
}
return exif;
Expand Down

0 comments on commit a274a58

Please sign in to comment.