mirror of
https://git.rwth-aachen.de/acs/public/villas/web/
synced 2025-03-09 00:00:01 +01:00
Label Widget: maxWidth now changes dynamically with text and textSize #12
This commit is contained in:
parent
6acaf007e0
commit
ae830bb6d7
2 changed files with 16 additions and 4 deletions
|
@ -65,12 +65,24 @@ class EditWidgetDialog extends React.Component {
|
|||
return changeObject;
|
||||
}
|
||||
|
||||
getTextWidth(text, fontSize) {
|
||||
let font = fontSize + "px ariel";
|
||||
let canvas = this.getTextWidth.canvas || (this.getTextWidth.canvas = document.createElement("canvas"));
|
||||
let context = canvas.getContext("2d");
|
||||
context.font = font;
|
||||
let metrics = context.measureText(text);
|
||||
return metrics.width;
|
||||
}
|
||||
|
||||
setMaxWidth(changeObject){
|
||||
if(changeObject.type === 'Label'){
|
||||
changeObject.customProperties.maxWidth = (changeObject.customProperties.textSize* 0.34) * changeObject.name.length;
|
||||
changeObject.customProperties.maxWidth = Math.ceil(this.getTextWidth(changeObject.name, changeObject.customProperties.textSize));
|
||||
}
|
||||
else if (changeObject.type === 'Value'){
|
||||
// changeObject.customProperties.maxWidth = (changeObject.customProperties.textSize* 0.5) * (changeObject.name.length+13);
|
||||
/*else if (changeObject.type === 'Value'){
|
||||
changeObject.customProperties.maxWidth = Math.ceil(this.getTextWidth(changeObject.name, changeObject.customProperties.textSize));
|
||||
}*/
|
||||
if(this.state.temporal.width > changeObject.customProperties.maxWidth){
|
||||
changeObject.width = changeObject.customProperties.maxWidth;
|
||||
}
|
||||
return changeObject;
|
||||
}
|
||||
|
|
|
@ -70,7 +70,7 @@ class WidgetFactory {
|
|||
case 'Value':
|
||||
widget.minWidth = 70;
|
||||
widget.minHeight = 20;
|
||||
widget.width = 150;
|
||||
widget.width = 110;
|
||||
widget.height = 30;
|
||||
widget.customProperties.textSize = 16;
|
||||
widget.name = 'Value';
|
||||
|
|
Loading…
Add table
Reference in a new issue