custom widget custom size support

This commit is contained in:
altarfinch
2020-05-07 19:45:36 +02:00
parent 9fcc6c4975
commit 7ba41d1d75
4 changed files with 28534 additions and 3217 deletions

File diff suppressed because it is too large Load Diff

10338
build/litegraph.min.js vendored

File diff suppressed because it is too large Load Diff

4
src/litegraph.d.ts vendored
View File

@@ -62,7 +62,7 @@ export interface IWidget<TValue = any, TOptions = any> {
width: number,
posY: number,
height: number
): void;
): number | undefined;
/**
* Called by `LGraphCanvas.processNodeWidgets`
* https://github.com/jagenjo/litegraph.js/issues/76
@@ -73,6 +73,8 @@ export interface IWidget<TValue = any, TOptions = any> {
pos: Vector2,
node: LGraphNode
): void;
/** Called by `LGraphNode.computeSize` */
computeSize?(width: number): [number, number];
}
export interface IButtonWidget extends IWidget<null, {}> {
type: "button";

View File

@@ -3173,20 +3173,6 @@
var size = out || new Float32Array([0, 0]);
rows = Math.max(rows, 1);
var font_size = LiteGraph.NODE_TEXT_SIZE; //although it should be graphcanvas.inner_text_font size
size[1] = (this.constructor.slot_start_y || 0) + rows * LiteGraph.NODE_SLOT_HEIGHT;
var widgets_height = 0;
if (this.widgets && this.widgets.length) {
widgets_height = this.widgets.length * (LiteGraph.NODE_WIDGET_HEIGHT + 4) + 8;
}
//compute height using widgets height
if( this.widgets_up )
size[1] = Math.max( size[1], widgets_height );
else if( this.widgets_start_y != null )
size[1] = Math.max( size[1], widgets_height + this.widgets_start_y );
else
size[1] += widgets_height;
var font_size = font_size;
var title_width = compute_text_size(this.title);
@@ -3221,6 +3207,27 @@
size[0] = Math.max(size[0], LiteGraph.NODE_WIDTH * 1.5);
}
size[1] = (this.constructor.slot_start_y || 0) + rows * LiteGraph.NODE_SLOT_HEIGHT;
var widgets_height = 0;
if (this.widgets && this.widgets.length) {
for (var i = 0, l = this.widgets.length; i < l; ++i) {
if (this.widgets[i].computeSize)
widgets_height += this.widgets[i].computeSize(size[0])[1] + 4;
else
widgets_height += LiteGraph.NODE_WIDGET_HEIGHT + 4;
}
widgets_height += 8;
}
//compute height using widgets height
if( this.widgets_up )
size[1] = Math.max( size[1], widgets_height );
else if( this.widgets_start_y != null )
size[1] = Math.max( size[1], widgets_height + this.widgets_start_y );
else
size[1] += widgets_height;
if (this.onResize) {
this.onResize(size);
}
@@ -5566,19 +5573,27 @@ LGraphNode.prototype.executeAction = function(action)
this.resizing_node.inputs ? this.resizing_node.inputs.length : 0,
this.resizing_node.outputs ? this.resizing_node.outputs.length : 0
);
var min_height =
max_slots * LiteGraph.NODE_SLOT_HEIGHT +
(this.resizing_node.widgets ? this.resizing_node.widgets.length : 0) * (LiteGraph.NODE_WIDGET_HEIGHT + 4) + 4;
if (this.resizing_node.size[1] < min_height) {
this.resizing_node.size[1] = min_height;
}
if (this.resizing_node.size[0] < LiteGraph.NODE_MIN_WIDTH) {
this.resizing_node.size[0] = LiteGraph.NODE_MIN_WIDTH;
}
if (this.resizing_node.onResize) {
this.resizing_node.onResize(this.resizing_node.size);
}
var widgets = this.resizing_node.widgets;
var widgets_height = 0;
if (widgets && widgets.length) {
for (var i = 0, l = widgets.length; i < l; ++i) {
if (widgets[i].computeSize)
widgets_height += widgets[i].computeSize(this.resizing_node.size[0])[1] + 4;
else
}
widgets_height += LiteGraph.NODE_WIDGET_HEIGHT + 4;
widgets_height += 8;
}
if (this.resizing_node.size[1] < min_height) {
var min_height = max_slots * LiteGraph.NODE_SLOT_HEIGHT + widgets_height;
this.resizing_node.size[1] = min_height;
}
this.canvas.style.cursor = "se-resize";
this.dirty_canvas = true;
@@ -8242,6 +8257,7 @@ LGraphNode.prototype.executeAction = function(action)
var margin = 15;
for (var i = 0; i < widgets.length; ++i) {
var h = H;
var w = widgets[i];
var y = posY;
if (w.y) {
@@ -8412,11 +8428,11 @@ LGraphNode.prototype.executeAction = function(action)
break;
default:
if (w.draw) {
w.draw(ctx, node, w, y, H);
h = w.draw(ctx, node, width, y, H) || H;
}
break;
}
posY += H + 4;
posY += h + 4;
ctx.globalAlpha = this.editor_alpha;
}