feat: 大屏3dpanel优化样式2

This commit is contained in:
caoqianming 2024-06-18 16:25:33 +08:00
parent b6c8cd2259
commit 487ad11b07
1 changed files with 12 additions and 62 deletions

View File

@ -1527,10 +1527,17 @@ export default {
// data_view.height = "140px";
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");
header.width = "200px";
header.height = "30px";
header.background = "rgba(0, 34, 51, 0.7)";
// header.background = "rgba(0, 34, 51, 0.6)";
header.isVertical = false;
const mgroupName = new BABYLON_GUI.TextBlock(info.name + "_label");
@ -1548,23 +1555,17 @@ export default {
);
mgroup_close.width = "25px";
mgroup_close.height = "25px";
mgroup_close.color = "orange";
mgroup_close.color = "rgb(255,165,0,0.7)";
mgroup_close.cornerRadius = 16;
mgroup_close.fontSize = "12px";
mgroup_close.background = "white";
mgroup_close.thickness = 0;
// mgroup_close.background = "white";
mgroup_close.onPointerClickObservable.add(() => {
data_view.isVisible = false;
});
header.addControl(mgroup_close);
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)=>{
const row = new BABYLON_GUI.StackPanel(info.name + `_${item.field}` + "_row");
row.width = "200px";
@ -1574,7 +1575,7 @@ export default {
const field = new BABYLON_GUI.TextBlock(info.name + `_${item.field}` + "_label");
field.width = "120px";
field.height = "30px";
field.color = "white";
field.color = "rgba(255,255,255, 0.7)";
field.fontSize = 14;
field.text = item.label;
field.textHorizontalAlignment = 0;
@ -1593,57 +1594,6 @@ export default {
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);
// StackPanelGUI
that.myui.addControl(data_view);
data_view.linkWithMesh(mesh);