- Improve slider, vector, range widgets.

This commit is contained in:
Tanasart 2024-03-24 12:44:34 +07:00
parent b622e89088
commit 6fe3d23dfe
13 changed files with 190 additions and 105 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 80 KiB

After

Width:  |  Height:  |  Size: 80 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 80 KiB

After

Width:  |  Height:  |  Size: 80 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 58 KiB

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 58 KiB

After

Width:  |  Height:  |  Size: 58 KiB

View file

@ -27,6 +27,8 @@ event_inherited();
sp_content = new scrollPane(dialog_w - ui(padding + padding), dialog_h - ui(title_height + padding), function(_y, _m) {
if(!target) return 0;
if(!struct_has(target, "spr")) return 0;
draw_clear_alpha(COLORS.dialog_array_edit_bg, 0);
var _h = ui(8);

View file

@ -237,29 +237,43 @@ function areaBox(_onModify, _unit = noone) : widget() constructor {
for(var i = 0; i < 4; i++) {
tb[i].setFocusHover(active, hover);
tb[i].align = fa_center;
tb[i].hide = mode == AREA_MODE.area || mode == AREA_MODE.two_point;
}
current_data = _data;
if(mode == AREA_MODE.area) { #region
var tb_x0 = _x + ui(6) - ui(64) - ui(48);
var tb_x1 = _x + ui(6) + ui(64) - ui(48);
var tb_w = ui(96);
var tb_h = TEXTBOX_HEIGHT;
var tb_x0 = _x - tb_w;
var tb_x1 = _x;
var tb_y0 = _y - ui(28);
var tb_y1 = _y + ui(64 + 48 + 8);
draw_set_text(f_p0, fa_right, fa_center, COLORS._main_text_sub);
draw_sprite_stretched_ext(THEME.textbox, 3, tb_x0, tb_y0, tb_w * 2, tb_h, c_white, 1);
draw_sprite_stretched_ext(THEME.textbox, 0, tb_x0, tb_y0, tb_w * 2, tb_h, c_white, 0.5 + 0.5 * interactable);
draw_text(tb_x0 - ui(4), tb_y0 + TEXTBOX_HEIGHT / 2, "x");
draw_text(tb_x1 - ui(4), tb_y0 + TEXTBOX_HEIGHT / 2, "y");
draw_sprite_stretched_ext(THEME.textbox, 3, tb_x0, tb_y1, tb_w * 2, tb_h, c_white, 1);
draw_sprite_stretched_ext(THEME.textbox, 0, tb_x0, tb_y1, tb_w * 2, tb_h, c_white, 0.5 + 0.5 * interactable);
draw_text(tb_x0 - ui(4), tb_y1 + TEXTBOX_HEIGHT / 2, "w");
draw_text(tb_x1 - ui(4), tb_y1 + TEXTBOX_HEIGHT / 2, "h");
tb[0].draw(tb_x0, tb_y0, ui(96), TEXTBOX_HEIGHT, array_safe_get(_data, 0), _m);
tb[1].draw(tb_x1, tb_y0, ui(96), TEXTBOX_HEIGHT, array_safe_get(_data, 1), _m);
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_sub);
draw_set_alpha(0.5);
tb[2].draw(tb_x0, tb_y1, ui(96), TEXTBOX_HEIGHT, array_safe_get(_data, 2), _m);
tb[3].draw(tb_x1, tb_y1, ui(96), TEXTBOX_HEIGHT, array_safe_get(_data, 3), _m);
draw_text(tb_x0 + ui(8), tb_y0 + tb_h / 2, "x");
draw_text(tb_x1 + ui(8), tb_y0 + tb_h / 2, "y");
draw_text(tb_x0 + ui(8), tb_y1 + tb_h / 2, "w");
draw_text(tb_x1 + ui(8), tb_y1 + tb_h / 2, "h");
draw_set_alpha(1);
tb[0].draw(tb_x0, tb_y0, tb_w, tb_h, array_safe_get(_data, 0), _m);
tb[1].draw(tb_x1, tb_y0, tb_w, tb_h, array_safe_get(_data, 1), _m);
tb[2].draw(tb_x0, tb_y1, tb_w, tb_h, array_safe_get(_data, 2), _m);
tb[3].draw(tb_x1, tb_y1, tb_w, tb_h, array_safe_get(_data, 3), _m);
#endregion
} else if(mode == AREA_MODE.padding) { #region
var tb_rx = _x + ui(56);
@ -281,24 +295,37 @@ function areaBox(_onModify, _unit = noone) : widget() constructor {
tb[3].draw(tb_bx, tb_by, ui(96), TEXTBOX_HEIGHT, array_safe_get(_data, 3), _m);
#endregion
} else if(mode == AREA_MODE.two_point) { #region
var tb_x0 = _x + ui(6) - ui(64) - ui(48);
var tb_x1 = _x + ui(6) + ui(64) - ui(48);
var tb_w = ui(96);
var tb_h = TEXTBOX_HEIGHT;
var tb_x0 = _x - tb_w;
var tb_x1 = _x;
var tb_y0 = _y - ui(28);
var tb_y1 = _y + ui(64 + 48 + 8);
draw_set_text(f_p0, fa_right, fa_center, COLORS._main_text_sub);
draw_sprite_stretched_ext(THEME.textbox, 3, tb_x0, tb_y0, tb_w * 2, tb_h, c_white, 1);
draw_sprite_stretched_ext(THEME.textbox, 0, tb_x0, tb_y0, tb_w * 2, tb_h, c_white, 0.5 + 0.5 * interactable);
draw_text(tb_x0 - ui(4), tb_y0 + TEXTBOX_HEIGHT / 2, "x0");
draw_text(tb_x1 - ui(4), tb_y0 + TEXTBOX_HEIGHT / 2, "y0");
draw_sprite_stretched_ext(THEME.textbox, 3, tb_x0, tb_y1, tb_w * 2, tb_h, c_white, 1);
draw_sprite_stretched_ext(THEME.textbox, 0, tb_x0, tb_y1, tb_w * 2, tb_h, c_white, 0.5 + 0.5 * interactable);
draw_text(tb_x0 - ui(4), tb_y1 + TEXTBOX_HEIGHT / 2, "x1");
draw_text(tb_x1 - ui(4), tb_y1 + TEXTBOX_HEIGHT / 2, "y1");
tb[0].draw(tb_x0, tb_y0, ui(96), TEXTBOX_HEIGHT, array_safe_get(_data, 0), _m);
tb[1].draw(tb_x1, tb_y0, ui(96), TEXTBOX_HEIGHT, array_safe_get(_data, 1), _m);
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_sub);
draw_set_alpha(0.5);
tb[2].draw(tb_x0, tb_y1, ui(96), TEXTBOX_HEIGHT, array_safe_get(_data, 2), _m);
tb[3].draw(tb_x1, tb_y1, ui(96), TEXTBOX_HEIGHT, array_safe_get(_data, 3), _m);
draw_text(tb_x0 + ui(8), tb_y0 + tb_h / 2, "x0");
draw_text(tb_x1 + ui(8), tb_y0 + tb_h / 2, "y0");
draw_text(tb_x0 + ui(8), tb_y1 + tb_h / 2, "x1");
draw_text(tb_x1 + ui(8), tb_y1 + tb_h / 2, "y1");
draw_set_alpha(1);
tb[0].draw(tb_x0, tb_y0, tb_w, tb_h, array_safe_get(_data, 0), _m);
tb[1].draw(tb_x1, tb_y0, tb_w, tb_h, array_safe_get(_data, 1), _m);
tb[2].draw(tb_x0, tb_y1, tb_w, tb_h, array_safe_get(_data, 2), _m);
tb[3].draw(tb_x1, tb_y1, tb_w, tb_h, array_safe_get(_data, 3), _m);
#endregion
}

View file

@ -85,7 +85,7 @@ function matrixGrid(_type, _size, _onModify, _unit = noone) : widget() construct
y = _y;
w = _w;
var hh = TEXTBOX_HEIGHT + ui(8);
var hh = TEXTBOX_HEIGHT;
h = hh * size - ui(8);
if(extras && instanceof(extras) == "buttonClass") {
@ -110,24 +110,28 @@ function matrixGrid(_type, _size, _onModify, _unit = noone) : widget() construct
var th = hh * size - ui(8);
var bx = _x;
var by = _y + th / 2 - ui(32 / 2);
b_link.draw(bx + ui(4), by + ui(4), ui(24), ui(24), _m, THEME.button_hide);
var by = _y + th / 2 - ui(24 / 2);
b_link.draw(bx, by, ui(24), ui(24), _m, THEME.button_hide);
_x += ui(28);
_w -= ui(28);
var ww = _w / size;
draw_sprite_stretched_ext(THEME.textbox, 3, _x, _y, ww * size, hh * size, c_white, 1);
draw_sprite_stretched_ext(THEME.textbox, 0, _x, _y, ww * size, hh * size, c_white, 0.5 + 0.5 * interactable);
for(var i = 0; i < size; i++)
for(var j = 0; j < size; j++) {
var ind = i * size + j;
tb[ind].setFocusHover(active, hover);
tb[ind].hide = true;
var bx = _x + ww * j;
var by = _y + hh * i;
var _dat = array_safe_get(_data, ind);
tb[ind].draw(bx + ui(8), by, ww - ui(8), TEXTBOX_HEIGHT, _dat, _m);
tb[ind].draw(bx, by, ww, hh, _dat, _m);
}
resetFocus();

View file

@ -32,6 +32,7 @@ function drawWidget(xx, yy, ww, _m, jun, global_var = true, _hover = false, _foc
case "areaBox" :
case "controlPointBox" :
case "cornerBox" :
case "rotator" :
case "rotatorRandom" :
case "rotatorRange" :
breakLine = true;
@ -315,9 +316,7 @@ function drawWidget(xx, yy, ww, _m, jun, global_var = true, _hover = false, _foc
case VALUE_DISPLAY.padding : param.h = ui(192); break;
case VALUE_DISPLAY.corner : param.h = ui(192); break;
case VALUE_DISPLAY.area : param.h = ui(204); break;
case VALUE_DISPLAY.rotation :
param.halign = breakLine? fa_center : fa_left;
break;
case VALUE_DISPLAY.rotation : param.halign = fa_center; break;
}
break;

View file

@ -84,15 +84,21 @@ function quarternionBox(_onModify) : widget() constructor {
var _dispDat = _data;
draw_sprite_stretched_ext(THEME.textbox, 3, _x, _y, _w, _h, c_white, 1);
draw_sprite_stretched_ext(THEME.textbox, 0, _x, _y, _w, _h, c_white, 0.5 + 0.5 * interactable);
for(var i = 0; i < size; i++) {
var _a = _dispDat[i];
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_sub);
draw_set_alpha(0.5);
draw_text(bx + ui(8), _y + _h / 2, axis[i]);
draw_set_alpha(1);
tb[i].hide = true;
tb[i].setFocusHover(clickable && active, hover);
tb[i].draw(bx + ui(24), _y, disp_w - ui(24), _h, _a, _m);
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_inner);
draw_text(bx + ui(8), _y + _h / 2, axis[i]);
bx += disp_w;
}

View file

@ -63,8 +63,8 @@ function rangeBox(_type, _onModify) : widget() constructor {
var _icon_blend = linked? COLORS._main_accent : COLORS._main_icon;
var bx = _x;
var by = _y + _h / 2 - ui(32 / 2);
if(buttonInstant(THEME.button_hide, bx + ui(4), by + ui(4), ui(24), ui(24), _m, active, hover, tooltip, THEME.value_link, linked, _icon_blend) == 2) {
var by = _y + _h / 2 - ui(24 / 2);
if(buttonInstant(THEME.button_hide, bx, by, ui(24), ui(24), _m, active, hover, tooltip, THEME.value_link, linked, _icon_blend) == 2) {
linked = !linked;
_display_data.linked = linked;
@ -77,21 +77,23 @@ function rangeBox(_type, _onModify) : widget() constructor {
_x += ui(28);
_w -= ui(28);
tb[0].hide = !linked;
tb[1].hide = !linked;
if(linked) {
tb[0].setFocusHover(active, hover);
tb[0].draw(_x + ui(8), _y, _w - ui(8), _h, _data[0], _m);
} else {
if(is_array(_data) && array_length(_data) >= 2) {
} else if(is_array(_data) && array_length(_data) >= 2) {
draw_sprite_stretched_ext(THEME.textbox, 3, _x, _y, _w, _h, c_white, 1);
draw_sprite_stretched_ext(THEME.textbox, 0, _x, _y, _w, _h, c_white, 0.5 + 0.5 * interactable);
var ww = _w / 2;
for(var i = 0; i < 2; i++) {
tb[i].setFocusHover(active, hover);
var bx = _x + ww * i;
tb[i].draw(bx + ui(44), _y, ww - ui(44), _h, _data[i], _m);
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_sub);
draw_text(bx + ui(8), _y + _h / 2, label[i]);
}
tb[i].draw(bx, _y, ww, _h, _data[i], _m);
}
}

View file

@ -53,36 +53,55 @@ function transformBox(_onModify) : widget() constructor {
if(is_array(_data[0])) return 0;
rot.setFocusHover(active, hover);
for(var i = 0; i < array_length(_data); i++)
for(var i = 0; i < array_length(_data); i++) {
tb[i].setFocusHover(active, hover);
tb[i].hide = true;
}
var tbh = TEXTBOX_HEIGHT;
var lbw = ui(80);
var tbw = (_w - lbw) / 2;
var tbh = TEXTBOX_HEIGHT;
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_inner);
draw_text_add(_x, _y + tbh / 2, __txt("Position"));
var tbw = (_w - lbw) / 2 - ui(4);
draw_sprite_stretched_ext(THEME.textbox, 3, _x + lbw, _y, _w - lbw, tbh, c_white, 1);
draw_sprite_stretched_ext(THEME.textbox, 0, _x + lbw, _y, _w - lbw, tbh, c_white, 0.5 + 0.5 * interactable);
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_sub);
draw_set_alpha(0.5);
draw_text_add(_x + lbw + ui(8), _y + tbh / 2, "x");
draw_text_add(_x + lbw + tbw + ui(8), _y + tbh / 2, "y");
draw_set_alpha(1);
tb[TRANSFORM.pos_x].draw(_x + lbw, _y, tbw, tbh, _data[TRANSFORM.pos_x], _m);
tb[TRANSFORM.pos_y].draw(_x + lbw + ui(8) + tbw, _y, tbw, tbh, _data[TRANSFORM.pos_y], _m);
tb[TRANSFORM.pos_y].draw(_x + lbw + tbw, _y, tbw, tbh, _data[TRANSFORM.pos_y], _m);
_y += ui(40);
rot.draw(_x, _y, _w, _data[TRANSFORM.rot], _m);
//draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_inner);
//draw_text_add(_x + ui(8), _y + tbh / 2, "Rotation");
_y += ui(72);
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_inner);
draw_text_add(_x, _y + tbh / 2, __txt("Scale"));
var tbw = array_length(_data) > 4? (_w - lbw) / 2 - ui(4) : _w - lbw;
draw_sprite_stretched_ext(THEME.textbox, 3, _x + lbw, _y, _w - lbw, tbh, c_white, 1);
draw_sprite_stretched_ext(THEME.textbox, 0, _x + lbw, _y, _w - lbw, tbh, c_white, 0.5 + 0.5 * interactable);
tbw = array_length(_data) > 4? (_w - lbw) / 2 : _w - lbw;
if(array_length(_data) > 4) {
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_sub);
draw_set_alpha(0.5);
draw_text_add(_x + lbw + ui(8), _y + tbh / 2, "x");
draw_text_add(_x + lbw + tbw + ui(8), _y + tbh / 2, "y");
draw_set_alpha(1);
}
tb[TRANSFORM.sca_x].draw(_x + lbw, _y, tbw, tbh, _data[TRANSFORM.sca_x], _m);
if(array_length(_data) > 4)
tb[TRANSFORM.sca_y].draw(_x + lbw + ui(8) + tbw, _y, tbw, tbh, _data[TRANSFORM.sca_y], _m);
tb[TRANSFORM.sca_y].draw(_x + lbw + tbw, _y, tbw, tbh, _data[TRANSFORM.sca_y], _m);
resetFocus();

View file

@ -126,8 +126,9 @@ function vectorBox(_size, _onModify, _unit = noone) : widget() constructor {
if(linkable) {
var _icon_blend = linked? COLORS._main_accent : (link_inactive_color == noone? COLORS._main_icon : link_inactive_color);
var bx = _x;
var by = _y + _h / 2 - ui(32 / 2);
if(buttonInstant(THEME.button_hide, bx + ui(4), by + ui(4), ui(24), ui(24), _m, active, hover, tooltip, THEME.value_link, linked, _icon_blend) == 2) {
var by = _y + _h / 2 - ui(24 / 2);
if(buttonInstant(THEME.button_hide, bx, by, ui(24), ui(24), _m, active, hover, tooltip, THEME.value_link, linked, _icon_blend) == 2) {
linked = !linked;
_display_data.linked = linked;
@ -144,20 +145,23 @@ function vectorBox(_size, _onModify, _unit = noone) : widget() constructor {
var sz = min(size, array_length(_data));
var ww = per_line? _w : _w / sz;
draw_sprite_stretched_ext(THEME.textbox, 3, _x, _y, _w, _h, c_white, 1);
draw_sprite_stretched_ext(THEME.textbox, 0, _x, _y, _w, _h, c_white, 0.5 + 0.5 * interactable);
for(var i = 0; i < sz; i++) {
draw_set_font(f_p0);
var lw = sz > 1? max(ui(24), string_width(axis[i]) + ui(16)) : 0;
var bx = per_line? _x : _x + ww * i;
var by = per_line? _y + (_h + ui(8)) * i : _y;
tb[i].setFocusHover(active, hover);
tb[i].draw(bx + lw, by, ww - lw, _h, _data[i], _m);
if(sz > 1) {
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_inner);
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_sub);
draw_set_alpha(0.5);
draw_text_add(bx + ui(8), by + _h / 2, axis[i]);
}
draw_set_alpha(1);
tb[i].setFocusHover(active, hover);
tb[i].hide = true;
tb[i].draw(bx, by, ww, _h, _data[i], _m);
}
resetFocus();

View file

@ -28,35 +28,36 @@ function vectorRangeBox(_size, _type, _onModify, _unit = noone) : widget() const
extras = -1;
for(var i = 0; i < size; i++) {
for(var i = 0; i < size; i++) { #region
tb[i] = new textBox(_type, onModifySingle[i]);
tb[i].slidable = true;
}
tb[i].hide = true;
} #endregion
static setSlideSpeed = function(speed) {
static setSlideSpeed = function(speed) { #region
for(var i = 0; i < size; i++)
tb[i].setSlidable(speed);
}
} #endregion
static setInteract = function(interactable = noone) {
static setInteract = function(interactable = noone) { #region
self.interactable = interactable;
var _step = linked? 2 : 1;
for( var i = 0; i < size; i += _step )
tb[i].interactable = interactable;
}
} #endregion
static register = function(parent = noone) {
static register = function(parent = noone) { #region
var _step = linked? 2 : 1;
for( var i = 0; i < size; i += _step )
tb[i].register(parent);
}
} #endregion
static drawParam = function(params) {
static drawParam = function(params) { #region
return draw(params.x, params.y, params.w, params.h, params.data, params.display_data, params.m);
}
} #endregion
static draw = function(_x, _y, _w, _h, _data, _display_data, _m) {
static draw = function(_x, _y, _w, _h, _data, _display_data, _m) { #region
x = _x;
y = _y;
w = _w;
@ -68,8 +69,8 @@ function vectorRangeBox(_size, _type, _onModify, _unit = noone) : widget() const
var _icon_blend = linked? COLORS._main_accent : COLORS._main_icon;
var bx = _x;
var by = _y + _h / 2 - ui(32 / 2);
if(buttonInstant(THEME.button_hide, bx + ui(4), by + ui(4), ui(24), ui(24), _m, active, hover, tooltip, THEME.value_link, linked, _icon_blend) == 2) {
var by = _y + _h / 2 - ui(24 / 2);
if(buttonInstant(THEME.button_hide, bx, by, ui(24), ui(24), _m, active, hover, tooltip, THEME.value_link, linked, _icon_blend) == 2) {
linked = !linked;
_display_data.linked = linked;
@ -84,26 +85,47 @@ function vectorRangeBox(_size, _type, _onModify, _unit = noone) : widget() const
_x += ui(28);
_w -= ui(28);
var _step = linked? 2 : 1;
var ww = _w / size * 2;
var ww = _w / 2;
for(var i = 0; i < size; i += _step) {
tb[i].setFocusHover(active, hover);
if(linked) {
draw_sprite_stretched_ext(THEME.textbox, 3, _x, _y, _w, _h, c_white, 1);
draw_sprite_stretched_ext(THEME.textbox, 0, _x, _y, _w, _h, c_white, 0.5 + 0.5 * interactable);
var bx = _x + ww * floor(i / 2);
var by = _y + i % 2 * (_h + ui(4));
var _ww = ui(32 + 32 * !linked);
tb[i].draw(bx + _ww, by, ww - _ww, _h, _data[i], _m);
for( var i = 0; i < 2; i++ ) {
var bx = _x + ww * i;
var by = _y;
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_inner);
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_sub);
draw_set_alpha(0.5);
draw_text_add(bx + ui(8), by + _h / 2, axis[i]);
draw_set_alpha(1);
var _label = linked? axis[floor(i / 2)]
: (i % 2? __txt("Max") : __txt("Min")) + " " + axis[floor(i / 2)];
draw_text(bx + ui(8), by + _h / 2, _label);
tb[i * 2].setFocusHover(active, hover);
tb[i * 2].draw(bx, by, ww, _h, _data[i * 2], _m);
}
} else {
for( var j = 0; j < 2; j++ ) {
var by = _y + (_h + ui(4)) * j;
draw_sprite_stretched_ext(THEME.textbox, 3, _x, by, _w, _h, c_white, 1);
draw_sprite_stretched_ext(THEME.textbox, 0, _x, by, _w, _h, c_white, 0.5 + 0.5 * interactable);
draw_set_text(f_p0, fa_left, fa_center, COLORS._main_text_sub);
draw_set_alpha(0.5);
draw_text_add(_x + ui(8), by + _h / 2, axis[j]);
draw_set_alpha(1);
for( var i = 0; i < 2; i++ ) {
var bx = _x + ww * i;
tb[j * 2 + i].setFocusHover(active, hover);
tb[j * 2 + i].draw(bx, by, ww, _h, _data[j * 2 + i], _m);
}
}
}
resetFocus();
return h;
}
} #endregion
}