添加宽度对齐以最小值对齐,调整宽度时值保留整数位,以5的倍数四舍五入

This commit is contained in:
Tenney
2025-05-09 12:27:42 +08:00
parent 337c7382a9
commit ffac0814ce
+23 -5
View File
@@ -7,7 +7,9 @@ const alignTopSvg = `<svg t="1725534367556" class="icon" viewBox="0 0 1170 1024"
const horizontalDistributionSvg = `<svg t="1725534354023" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1515" width="100%"><path d="M96 0a32 32 0 0 1 32 32v960a32 32 0 0 1-64 0V32A32 32 0 0 1 96 0z m832 0a32 32 0 0 1 32 32v960a32 32 0 0 1-64 0V32a32 32 0 0 1 32-32zM384 800v-576a32 32 0 0 1 32-32h192a32 32 0 0 1 32 32v576a32 32 0 0 1-32 32h-192a32 32 0 0 1-32-32z" fill="#666666" p-id="1516"></path></svg>`;
const verticalDistributionSvg = `<svg t="1725534350231" class="icon" viewBox="0 0 1170 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1368" width="100%"><path d="M1170.285714 36.571429a36.571429 36.571429 0 0 1-36.571428 36.571428H36.571429a36.571429 36.571429 0 0 1 0-73.142857h1097.142857a36.571429 36.571429 0 0 1 36.571428 36.571429z m0 950.857142a36.571429 36.571429 0 0 1-36.571428 36.571429H36.571429a36.571429 36.571429 0 0 1 0-73.142857h1097.142857a36.571429 36.571429 0 0 1 36.571428 36.571428zM256 365.714286h658.285714a36.571429 36.571429 0 0 1 36.571429 36.571428v219.428572a36.571429 36.571429 0 0 1-36.571429 36.571428h-658.285714a36.571429 36.571429 0 0 1-36.571429-36.571428v-219.428572a36.571429 36.571429 0 0 1 36.571429-36.571428z" fill="#666666" p-id="1369"></path></svg>`;
const equalWidthSvg = `<svg t="1725606034670" class="icon" viewBox="0 0 1088 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7213" width="100%"><path d="M978.24 480a42.688 42.688 0 0 1-42.688 42.688H172.928a42.688 42.688 0 0 1-42.688-42.688V213.312c0-23.552 19.072-42.624 42.688-42.624h762.624c23.552 0 42.688 19.072 42.688 42.624V480z" fill="#666666" p-id="7214"></path><path d="M256.96 734.144c0-14.08 11.456-25.6 25.6-25.6h543.36a25.6 25.6 0 0 1 0 51.2h-543.36a25.6 25.6 0 0 1-25.6-25.6z" fill="#666666" p-id="7215"></path><path d="M136.64 745.216a12.8 12.8 0 0 1 0-22.144l184.192-106.368a12.8 12.8 0 0 1 19.2 11.072v212.736a12.8 12.8 0 0 1-19.2 11.072l-184.192-106.368zM971.84 745.216a12.8 12.8 0 0 0 0-22.144l-184.256-106.368a12.8 12.8 0 0 0-19.2 11.072v212.736a12.8 12.8 0 0 0 19.2 11.072l184.256-106.368z" fill="#666666" p-id="7216"></path></svg>`
const equalWidth2Svg = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="280" height="264" viewBox="0 0 280 264"><defs><clipPath id="master_svg0_395_0211"><rect x="0" y="0" width="280" height="264" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_395_0211)"><g><path d="M251.7527001953125,123.7499931640625C251.7527001953125,129.8281931640625,246.8347001953125,134.7554931640625,240.7667001953125,134.7554931640625L44.5036001953125,134.7554931640625C38.436250195312496,134.7554931640625,33.5177001953125,129.8281931640625,33.5177001953125,123.7499931640625L33.5177001953125,54.994493164062504C33.5177001953125,48.9224931640625,38.4259401953125,44.0054931640625,44.5036001953125,44.0054931640625L240.7667001953125,44.0054931640625C246.8287001953125,44.0054931640625,251.7527001953125,48.9224931640625,251.7527001953125,54.994493164062504L251.7527001953125,123.7499931640625Z" fill="#666666" fill-opacity="1" style="mix-blend-mode:passthrough"/></g><g><path d="M66,188.59999C66,184.96999,68.94823,182,72.58824,182L212.424,182C216.062,181.9999842644,219.012,184.95491,219.012,188.59999C219.012,192.2451,216.062,195.2,212.424,195.2L72.58824,195.2C68.94966,195.2,66.00000785379,192.2451,66,188.59999Z" fill="#666666" fill-opacity="1" style="mix-blend-mode:passthrough"/></g><g><path d="M33.67635708496094,219.00163010253905C32.344027084960935,219.76823010253906,30.681137084960938,218.80783010253907,30.681137084960938,217.27173010253907L30.681137084960938,159.53892010253907C30.681137084960938,158.00075510253907,32.34226708496094,157.03627810253906,33.67635708496094,157.79985010253907L83.97753708496094,186.58973010253905C85.31673708496093,187.35623010253906,85.31673708496093,189.28813010253907,83.97753708496094,190.05873010253907L33.67635708496094,219.00163010253905ZM246.32413708496094,157.99836010253907C247.65613708496093,157.23174310253907,249.31913708496094,158.19217710253906,249.31913708496094,159.72832010253907L249.31913708496094,217.46113010253907C249.31913708496094,218.99923010253906,247.65813708496094,219.96373010253905,246.32413708496094,219.20013010253905L196.02213708496095,190.41023010253906C194.68313708496095,189.64373010253905,194.68313708496095,187.71183010253907,196.02213708496095,186.94123010253907L246.32413708496094,157.99836010253907Z" fill="#666666" fill-opacity="1"/></g></g></svg>`
const equalHeightSvg = `<svg t="1725606224564" class="icon" viewBox="0 0 1088 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7790" width="100%"><path d="M572.16 936a42.688 42.688 0 0 1-42.688-42.688V130.688c0-23.616 19.136-42.688 42.688-42.688h266.688c23.552 0 42.624 19.072 42.624 42.688v762.624a42.688 42.688 0 0 1-42.624 42.688H572.16z" fill="#666666" p-id="7791"></path><path d="M318.016 214.72c14.08 0 25.6 11.456 25.6 25.6v543.36a25.6 25.6 0 1 1-51.2 0v-543.36c0-14.144 11.456-25.6 25.6-25.6z" fill="#666666" p-id="7792"></path><path d="M306.944 94.4a12.8 12.8 0 0 1 22.144 0l106.368 184.192a12.8 12.8 0 0 1-11.072 19.2H211.648a12.8 12.8 0 0 1-11.072-19.2l106.368-184.192zM306.944 929.6a12.8 12.8 0 0 0 22.144 0l106.368-184.192a12.8 12.8 0 0 0-11.072-19.2H211.648a12.8 12.8 0 0 0-11.072 19.2l106.368 184.192z" fill="#666666" p-id="7793"></path></svg>`
const equalHeight2Svg = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="1088" height="1024" viewBox="0 0 1088 1024"><defs><clipPath id="master_svg0_395_0217"><rect x="0" y="0" width="1088" height="1024" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_395_0217)"><g><path d="M572.1599848632812,936C548.5840848632813,936,529.4719848632812,916.888,529.4719848632812,893.312L529.4719848632812,130.688C529.4719848632812,107.072,548.6079848632812,88,572.1599848632812,88L838.8479848632812,88C862.3999848632812,88,881.4719848632812,107.072,881.4719848632812,130.688L881.4719848632812,893.312C881.4719848632812,916.863,862.3989848632813,935.965,838.8479848632812,936L572.1599848632812,936Z" fill="#666666" fill-opacity="1" style="mix-blend-mode:passthrough"/></g><g><path d="M318.0159851074219,214.72000122070312C332.0959851074219,214.72000122070312,343.61598510742186,226.1760012207031,343.61598510742186,240.32000122070312L343.61598510742186,783.6800012207032C343.61598510742186,797.8190012207032,332.15448510742186,809.2800012207031,318.0159851074219,809.2800012207031C303.8774851074219,809.2800012207031,292.41595458982187,797.8190012207032,292.4159851074219,783.6800012207032L292.4159851074219,240.32000122070312C292.4159851074219,226.1760012207031,303.8719851074219,214.72000122070312,318.0159851074219,214.72000122070312Z" fill="#666666" fill-opacity="1" style="mix-blend-mode:passthrough"/></g><g transform="matrix(0,0.999941349029541,-0.999941349029541,0,526.9946627616882,-344.9744281768799)"><path d="M447.5076,327.211C442.38877,330.15700000000004,436,326.466,436,320.563L436,98.70931C436,92.79851,442.38203,89.09225,447.5076,92.02648L640.763,202.659C645.909,205.60500000000002,645.909,213.029,640.763,215.99L447.5076,327.211ZM1264.492,92.78931C1269.6109999999999,89.84338,1276,93.5341,1276,99.43713L1276,321.291C1276,327.201,1269.618,330.908,1264.492,327.974L1071.237,217.341C1066.091,214.39499999999998,1066.091,206.971,1071.237,204.01L1264.492,92.78931Z" fill="#666666" fill-opacity="1"/></g></g></svg>`
const ButtonManager = {
isInitialized: false, // 检查是否已经初始化
@@ -257,8 +259,10 @@ const ButtonManager = {
{ type: 'divider' },
/* 等宽 */
{ id: 'equalWidth', svg: equalWidthSvg, action: this.equalWidth.bind(this) },
{ id: 'equalMinWidth', svg: equalWidth2Svg, action: this.equalMinWidth.bind(this) },
/* 等高 */
{ id: 'equalHeight', svg: equalHeightSvg, action: this.equalHeight.bind(this) },
{ id: 'equalMinHeight', svg: equalHeight2Svg, action: this.equalMinHeight.bind(this) },
];
},
// 显示右键菜单
@@ -737,25 +741,39 @@ const ButtonManager = {
LGraphCanvas.active_canvas.setDirty(true, true);
}
},
// 等宽
// 等宽 对齐最大值
equalWidth() {
this.equalSize(0);
},
// 等宽 对齐最小值
equalMinWidth() {
this.equalSize(0, Math.min);
},
// 等高
equalHeight() {
this.equalSize(1);
},// 等高 对齐最小值
equalMinHeight() {
this.equalSize(1, Math.min);
},
// 通用的节点尺寸调整
equalSize(axis) {
equalSize(axis, comparator = Math.max) {
const nodes = this.getSelectedNodes();
if (nodes.length > 0) {
// 找到节点中最大的尺寸
const maxSize = Math.max(...nodes.map(node => node.size[axis]));
// 使用传入的比较函数(默认为 Math.max)
const sizeValues = nodes.map(node => node.size[axis]);
const targetSize = comparator(...sizeValues);
// 将尺寸调整为最近的5的倍数
const roundedTargetSize = Math.round(targetSize / 5) * 5;
nodes.forEach(node => {
node.size[axis] = maxSize; // 设置所有节点的大小为最大值
node.size[axis] = roundedTargetSize; // 设置所有节点的大小为目标值(5的倍数)
});
LGraphCanvas.active_canvas.setDirty(true, true);
}
}