feat: 大屏3dpanel优化样式2
This commit is contained in:
parent
b6c8cd2259
commit
487ad11b07
|
@ -1527,10 +1527,17 @@ export default {
|
||||||
// data_view.height = "140px";
|
// data_view.height = "140px";
|
||||||
data_view.background = "rgba(0, 34, 51, 0.6)"; //暗色
|
data_view.background = "rgba(0, 34, 51, 0.6)"; //暗色
|
||||||
|
|
||||||
|
const mgroup_line = new BABYLON_GUI.Rectangle(info.name + "_line");
|
||||||
|
mgroup_line.height = "3px";
|
||||||
|
mgroup_line.width = "200px";
|
||||||
|
mgroup_line.thickness = 0;
|
||||||
|
mgroup_line.background = "rgba(44, 237, 255, 0.8)";
|
||||||
|
data_view.addControl(mgroup_line);
|
||||||
|
|
||||||
const header = new BABYLON_GUI.StackPanel(info.name + "_header");
|
const header = new BABYLON_GUI.StackPanel(info.name + "_header");
|
||||||
header.width = "200px";
|
header.width = "200px";
|
||||||
header.height = "30px";
|
header.height = "30px";
|
||||||
header.background = "rgba(0, 34, 51, 0.7)";
|
// header.background = "rgba(0, 34, 51, 0.6)";
|
||||||
header.isVertical = false;
|
header.isVertical = false;
|
||||||
|
|
||||||
const mgroupName = new BABYLON_GUI.TextBlock(info.name + "_label");
|
const mgroupName = new BABYLON_GUI.TextBlock(info.name + "_label");
|
||||||
|
@ -1548,23 +1555,17 @@ export default {
|
||||||
);
|
);
|
||||||
mgroup_close.width = "25px";
|
mgroup_close.width = "25px";
|
||||||
mgroup_close.height = "25px";
|
mgroup_close.height = "25px";
|
||||||
mgroup_close.color = "orange";
|
mgroup_close.color = "rgb(255,165,0,0.7)";
|
||||||
mgroup_close.cornerRadius = 16;
|
mgroup_close.cornerRadius = 16;
|
||||||
mgroup_close.fontSize = "12px";
|
mgroup_close.fontSize = "12px";
|
||||||
mgroup_close.background = "white";
|
mgroup_close.thickness = 0;
|
||||||
|
// mgroup_close.background = "white";
|
||||||
mgroup_close.onPointerClickObservable.add(() => {
|
mgroup_close.onPointerClickObservable.add(() => {
|
||||||
data_view.isVisible = false;
|
data_view.isVisible = false;
|
||||||
});
|
});
|
||||||
header.addControl(mgroup_close);
|
header.addControl(mgroup_close);
|
||||||
data_view.addControl(header);
|
data_view.addControl(header);
|
||||||
|
|
||||||
const mgroup_line = new BABYLON_GUI.Rectangle(info.name + "_line");
|
|
||||||
mgroup_line.height = "3px";
|
|
||||||
mgroup_line.width = "200px";
|
|
||||||
mgroup_line.thickness = 0;
|
|
||||||
mgroup_line.background = "rgba(44, 237, 255, 0.45)";
|
|
||||||
data_view.addControl(mgroup_line);
|
|
||||||
|
|
||||||
info.rows.forEach((item, index)=>{
|
info.rows.forEach((item, index)=>{
|
||||||
const row = new BABYLON_GUI.StackPanel(info.name + `_${item.field}` + "_row");
|
const row = new BABYLON_GUI.StackPanel(info.name + `_${item.field}` + "_row");
|
||||||
row.width = "200px";
|
row.width = "200px";
|
||||||
|
@ -1574,7 +1575,7 @@ export default {
|
||||||
const field = new BABYLON_GUI.TextBlock(info.name + `_${item.field}` + "_label");
|
const field = new BABYLON_GUI.TextBlock(info.name + `_${item.field}` + "_label");
|
||||||
field.width = "120px";
|
field.width = "120px";
|
||||||
field.height = "30px";
|
field.height = "30px";
|
||||||
field.color = "white";
|
field.color = "rgba(255,255,255, 0.7)";
|
||||||
field.fontSize = 14;
|
field.fontSize = 14;
|
||||||
field.text = item.label;
|
field.text = item.label;
|
||||||
field.textHorizontalAlignment = 0;
|
field.textHorizontalAlignment = 0;
|
||||||
|
@ -1593,57 +1594,6 @@ export default {
|
||||||
data_view.addControl(row);
|
data_view.addControl(row);
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
// var grid = new BABYLON_GUI.Grid("grid");
|
|
||||||
// grid.width = "200px";
|
|
||||||
// grid.height = "70px";
|
|
||||||
// grid.paddingLeft = 1;
|
|
||||||
// var wd = 2;
|
|
||||||
// var hd = 2;
|
|
||||||
// for (let i = 0; i < wd; i++) {
|
|
||||||
// grid.addRowDefinition(1 / wd);
|
|
||||||
// }
|
|
||||||
// for (let j = 0; j < hd; j++) {
|
|
||||||
// grid.addColumnDefinition(1 / hd);
|
|
||||||
// }
|
|
||||||
// for (let i = 0; i < wd; i++) {
|
|
||||||
// for (let j = 0; j < hd; j++) {
|
|
||||||
// var rc = new BABYLON_GUI.TextBlock(
|
|
||||||
// "rc" + i + j
|
|
||||||
// );
|
|
||||||
// rc.width = "100%";
|
|
||||||
// // rc.height = "100%";
|
|
||||||
// rc.thickness = 0;
|
|
||||||
// if (j == 0 && i == 0) {
|
|
||||||
// rc.width = "120px";
|
|
||||||
// rc.text = "产品产量:";
|
|
||||||
// rc.color = "white";
|
|
||||||
// rc.fontSize = "16px";
|
|
||||||
// } else if (j == 0 && i == 1) {
|
|
||||||
// rc.width = "120px";
|
|
||||||
// rc.color = "white";
|
|
||||||
// rc.fontSize = "16px";
|
|
||||||
// rc.text = "单位产品电耗:";
|
|
||||||
// } else if (j == 1 && i == 0) {
|
|
||||||
// // rc.text = that.mgroupValues[value].total;
|
|
||||||
// rc.text =
|
|
||||||
// that.mgroupValues[value].total;
|
|
||||||
// rc.width = "80px";
|
|
||||||
// rc.fontSize = "18px";
|
|
||||||
// rc.color = "rgb(44,237,255)";
|
|
||||||
// } else if (j == 1 && i == 1) {
|
|
||||||
// // rc.text = that.mgroupValues[value].total;
|
|
||||||
// rc.text =
|
|
||||||
// that.mgroupValues[value].elec;
|
|
||||||
// rc.width = "80px";
|
|
||||||
// rc.fontSize = "18px";
|
|
||||||
// rc.color = "rgb(44,237,255)";
|
|
||||||
// }
|
|
||||||
// grid.addControl(rc, i, j);
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// data_view.addControl(grid);
|
|
||||||
|
|
||||||
// 将StackPanel添加到GUI系统中
|
// 将StackPanel添加到GUI系统中
|
||||||
that.myui.addControl(data_view);
|
that.myui.addControl(data_view);
|
||||||
data_view.linkWithMesh(mesh);
|
data_view.linkWithMesh(mesh);
|
||||||
|
|
Loading…
Reference in New Issue