diff --git a/src/Add-on/MoveToWCS0.ts b/src/Add-on/MoveToWCS0.ts index 826c33e6e..56be6539a 100644 --- a/src/Add-on/MoveToWCS0.ts +++ b/src/Add-on/MoveToWCS0.ts @@ -97,7 +97,7 @@ export class Command_PackageMove implements Command let b = g.box; mmtz.setPosition(b.min.clone().negate().add(movex)); - movex.setComponent(i1, movex.getComponent(i1) + b.getSize(size).getComponent(i1) + Number(userConfig.cabinetSpacing)); + movex.setComponent(i1, movex.getComponent(i1) + b.getSize(size).getComponent(i1) + userConfig.cabinetSpacing); for (let e of g.ens) e.ApplyMatrix(mmtz); diff --git a/src/ApplicationServices/HostApplicationServices.ts b/src/ApplicationServices/HostApplicationServices.ts index edfa7c80e..f559a59fa 100644 --- a/src/ApplicationServices/HostApplicationServices.ts +++ b/src/ApplicationServices/HostApplicationServices.ts @@ -10,8 +10,8 @@ export class IHostApplicationServices @ProxyValue isShowLightShadow: boolean = true;//灯光阴影 (除太阳光外) ShowHistoryLog: boolean = true; - Physical2EdgeColor = 7;//真实视图带线框的线框颜色 默认白色 - ConceptualEdgeColor = 7;//概念线框的颜色 + @ProxyValue Physical2EdgeColor = 7;//真实视图带线框的线框颜色 默认白色 + @ProxyValue ConceptualEdgeColor = 7;//概念线框的颜色 DrawWallBottomFace = false;//绘制底面 diff --git a/src/Common/ColorPalette.ts b/src/Common/ColorPalette.ts index 0535017ab..8333bc020 100644 --- a/src/Common/ColorPalette.ts +++ b/src/Common/ColorPalette.ts @@ -1,5 +1,6 @@ import { Color, DoubleSide, FrontSide, LineBasicMaterial, LineDashedMaterial, MeshBasicMaterial, ShaderMaterial, Side, Vector2, Vector3 } from 'three'; import { LineMaterial } from 'three/examples/jsm/lines/LineMaterial'; +import { HostApplicationServices } from '../ApplicationServices/HostApplicationServices'; import { GetGoodShaderSimple } from '../GLSL/GoochShader'; const ColorPalette = [ @@ -399,6 +400,33 @@ export class ColorMaterial return new Color(); } + private static _ConceptualEdgeMaterial: LineBasicMaterial; + static GetConceptualEdgeMaterial() + { + if (!this._ConceptualEdgeMaterial) + this._ConceptualEdgeMaterial = new LineBasicMaterial({ color: this.GetColor(HostApplicationServices.ConceptualEdgeColor).clone(), side: DoubleSide }); + + return this._ConceptualEdgeMaterial; + } + static UpdateConceptualEdgeMaterial() + { + if (this._ConceptualEdgeMaterial) + this._ConceptualEdgeMaterial.color.copy(this.GetColor(HostApplicationServices.ConceptualEdgeColor)); + } + private static _Physical2EdgeMaterial: LineBasicMaterial; + static GetPhysical2EdgeMaterial() + { + if (!this._Physical2EdgeMaterial) + this._Physical2EdgeMaterial = new LineBasicMaterial({ color: this.GetColor(HostApplicationServices.Physical2EdgeColor).clone(), side: DoubleSide }); + + return this._Physical2EdgeMaterial; + } + static UpdatePhysical2EdgeMaterial() + { + if (this._Physical2EdgeMaterial) + this._Physical2EdgeMaterial.color.copy(this.GetColor(HostApplicationServices.Physical2EdgeColor)); + } + //橡皮筋材质: 黄色 点划线 static RubberBandMaterial = new LineDashedMaterial({ color: 0xF0B41E, diff --git a/src/DatabaseServices/3DSolid/SweepSolid.ts b/src/DatabaseServices/3DSolid/SweepSolid.ts index dc4e176f0..292ae1a55 100644 --- a/src/DatabaseServices/3DSolid/SweepSolid.ts +++ b/src/DatabaseServices/3DSolid/SweepSolid.ts @@ -188,7 +188,7 @@ export class SweepSolid extends Entity { return new Object3D().add( new Mesh(this.MeshGeometry, ColorMaterial.GetConceptualMaterial(this.ColorIndex)), - new LineSegments(this.EdgeGeometry, ColorMaterial.GetLineMaterial(7)) + new LineSegments(this.EdgeGeometry, ColorMaterial.GetConceptualEdgeMaterial()) ); } else if (renderType === RenderType.Physical) @@ -209,7 +209,7 @@ export class SweepSolid extends Entity { return new Object3D().add( new Mesh(this.MeshGeometry, this.MeshMaterial), - new LineSegments(this.EdgeGeometry, ColorMaterial.GetLineMaterial(7)) + new LineSegments(this.EdgeGeometry, ColorMaterial.GetPhysical2EdgeMaterial()) ); } } @@ -234,7 +234,7 @@ export class SweepSolid extends Entity Object3DRemoveAll(obj); return obj.add( new Mesh(this.MeshGeometry, ColorMaterial.GetConceptualMaterial(this.ColorIndex)), - new LineSegments(this.EdgeGeometry, ColorMaterial.GetLineMaterial(7)) + new LineSegments(this.EdgeGeometry, ColorMaterial.GetConceptualEdgeMaterial()) ); } else if (renderType === RenderType.Physical) @@ -253,7 +253,7 @@ export class SweepSolid extends Entity Object3DRemoveAll(obj); return obj.add( new Mesh(this.MeshGeometry, this.MeshMaterial), - new LineSegments(this.EdgeGeometry, ColorMaterial.GetLineMaterial(7)) + new LineSegments(this.EdgeGeometry, ColorMaterial.GetPhysical2EdgeMaterial()) ); } } diff --git a/src/DatabaseServices/Entity/Extrude.ts b/src/DatabaseServices/Entity/Extrude.ts index 122b0f60a..395ddcc7c 100644 --- a/src/DatabaseServices/Entity/Extrude.ts +++ b/src/DatabaseServices/Entity/Extrude.ts @@ -3,7 +3,6 @@ import Flatbush from 'flatbush'; import { Box3, BoxGeometry, BufferGeometry, ExtrudeGeometry, ExtrudeGeometryOptions, Float32BufferAttribute, Geometry, InstancedInterleavedBuffer, InterleavedBufferAttribute, Line as TLine, LineSegments, Matrix3, Matrix4, Mesh, Object3D, UVGenerator, Vector3 } from "three"; import { Line2 } from "three/examples/jsm/lines/Line2"; import { LineGeometry } from "three/examples/jsm/lines/LineGeometry"; -import { HostApplicationServices } from '../../ApplicationServices/HostApplicationServices'; import { arrayClone, arrayLast, arrayPushArray, arrayRemoveIf, arrayRemoveOnce, arraySortByNumber, arraySum } from "../../Common/ArrayExt"; import { ColorMaterial } from "../../Common/ColorPalette"; import { CSGIntersect } from '../../Common/CSGIntersect'; @@ -1621,7 +1620,7 @@ export class ExtrudeSolid extends Entity { return new Object3D().add( new Mesh(this.MeshGeometry, ColorMaterial.GetConceptualMaterial(this.ColorIndex)), - new LineSegments(this.EdgeGeometry, ColorMaterial.GetLineMaterial(HostApplicationServices.ConceptualEdgeColor)) + new LineSegments(this.EdgeGeometry, ColorMaterial.GetConceptualEdgeMaterial()) ); } else if (renderType === RenderType.Physical) @@ -1658,7 +1657,7 @@ export class ExtrudeSolid extends Entity return new Object3D().add( mesh, - new LineSegments(this.EdgeGeometry, ColorMaterial.GetLineMaterial(HostApplicationServices.Physical2EdgeColor)) + new LineSegments(this.EdgeGeometry, ColorMaterial.GetPhysical2EdgeMaterial()) ); } } @@ -2012,7 +2011,7 @@ export class ExtrudeSolid extends Entity { return obj.add( new Mesh(this.MeshGeometry, ColorMaterial.GetConceptualMaterial(this.ColorIndex)), - new LineSegments(this.EdgeGeometry, ColorMaterial.GetLineMaterial(HostApplicationServices.ConceptualEdgeColor)) + new LineSegments(this.EdgeGeometry, ColorMaterial.GetConceptualEdgeMaterial()) ); } else if (renderType === RenderType.Physical) @@ -2044,7 +2043,7 @@ export class ExtrudeSolid extends Entity return obj.add( mesh, - new LineSegments(this.EdgeGeometry, ColorMaterial.GetLineMaterial(HostApplicationServices.Physical2EdgeColor)) + new LineSegments(this.EdgeGeometry, ColorMaterial.GetPhysical2EdgeMaterial()) ); } } diff --git a/src/Editor/UserConfig.ts b/src/Editor/UserConfig.ts index c37369d3d..9d8d640db 100644 --- a/src/Editor/UserConfig.ts +++ b/src/Editor/UserConfig.ts @@ -36,7 +36,7 @@ export interface IUCSGridConfig extends IBaseOption export class UserConfig implements IConfigStore { - private readonly _version = 28; //🌟🌟每次更新必须向上添加一次版本号🌟🌟 + private readonly _version = 29; //🌟🌟每次更新必须向上添加一次版本号🌟🌟 _renderType: RenderType = RenderType.Wireframe; @observable maxSize: IMaxSizeProps = { isShow: false, @@ -83,6 +83,8 @@ export class UserConfig implements IConfigStore @observable isModifyMaterial: boolean = true;//右侧工具栏应用时覆盖新的材质 @observable isHighlightMaterial: boolean = true;//亮显材质球 @observable cabinetSpacing: number = 1000; //柜子移动到0点配置 柜子间距 + @observable ConceptualEdgeColor = 7;//概念线框的颜色 + @observable Physical2EdgeColor = 7;//真实视图带线框的线框颜色 默认白色 @observable autoSaveConfig = { enable: true, time: 1, @@ -213,6 +215,8 @@ export class UserConfig implements IConfigStore this.isModifyMaterial = false; this.isHighlightMaterial = true; this.cabinetSpacing = 1000; + this.ConceptualEdgeColor = 7; + this.Physical2EdgeColor = 7; this.isShowSkyBox = false; Object.assign(this.UCSGridConfig, { isShowUCSGrid: true, @@ -262,6 +266,8 @@ export class UserConfig implements IConfigStore isModifyMaterial: this.isModifyMaterial, isHighlightMaterial: this.isHighlightMaterial, cabinetSpacing: this.cabinetSpacing, + ConceptualEdgeColor: this.ConceptualEdgeColor, + Physical2EdgeColor: this.Physical2EdgeColor, isShowSkyBox: this.isShowSkyBox, openLightConfig: this.openLightConfig, UCSGridConfig: toJS(this.UCSGridConfig), @@ -395,6 +401,11 @@ export class UserConfig implements IConfigStore { this.cabinetSpacing = config.option.cabinetSpacing; } + if (config.option.version > 28) + { + this.ConceptualEdgeColor = config.option.ConceptualEdgeColor; + this.Physical2EdgeColor = config.option.Physical2EdgeColor; + } } } diff --git a/src/UI/Components/Modal/OptionModal/ConfigColorList.tsx b/src/UI/Components/Modal/OptionModal/ConfigColorList.tsx new file mode 100644 index 000000000..5a892ad3c --- /dev/null +++ b/src/UI/Components/Modal/OptionModal/ConfigColorList.tsx @@ -0,0 +1,130 @@ + +import { Classes, Icon, Label } from '@blueprintjs/core'; +import { observable } from 'mobx'; +import { observer } from 'mobx-react'; +import * as React from 'react'; +import { ColorMaterial } from '../../../../Common/ColorPalette'; +import { userConfig } from '../../../../Editor/UserConfig'; +import { ColorList } from './DisplayConfigPanel'; + +interface IColorList +{ + text: string; + type: "ConceptualEdgeColor" | "Physical2EdgeColor"; + handleClick: (e: React.MouseEvent, type: string) => void; +} + +@observer +export class ConfigColorList extends React.Component +{ + @observable isShow = false; + liEl = React.createRef(); + divEl = React.createRef(); + constructor(props) + { + super(props); + this.registerEvent(); + } + private registerEvent() + { + document.body.addEventListener('mousedown', this.CloseColorList); + document.body.addEventListener('wheel', this.CloseColorList); + } + private CloseColorList = (e: MouseEvent) => + { + //在任何地方点到鼠标,都将取消下拉菜单 + let el = e.target as HTMLElement; + for (let i = 0; i < 4; i++) + { + if (el?.className === this.liEl.current.className) + return; + else + el = el.parentElement; + if (el === null) + break; + } + + if (this.isShow) + { + this.isShow = false; + e.stopPropagation(); + } + }; + + componentWillUnmount() + { + document.body.removeEventListener('mousedown', this.CloseColorList); + document.body.removeEventListener('wheel', this.CloseColorList); + } + + getCalcStyles = () => + { + let el = this.divEl.current as HTMLElement; + if (!el) return; + let scrolltop: number = 0; + while (true) + { + if (el.className.includes("bp3-card")) + { + scrolltop = el.scrollTop; + break; + } + else + el = el.parentElement; + if (el === null) + break; + } + + this.divEl.current.style.cssText = ` + position: absolute; + top: ${this.divEl.current.parentElement.offsetTop - scrolltop}px; + `; + }; + render() + { + let type = this.props.type; + return ( + + ); + } +} diff --git a/src/UI/Components/Modal/OptionModal/ConfigDialog.tsx b/src/UI/Components/Modal/OptionModal/ConfigDialog.tsx index b1b0e1e9f..63337c1c5 100644 --- a/src/UI/Components/Modal/OptionModal/ConfigDialog.tsx +++ b/src/UI/Components/Modal/OptionModal/ConfigDialog.tsx @@ -41,6 +41,8 @@ export class ConfigStore extends Singleton { oldBgcolor: string; oldLyBg: string; + oldConceptualEdgeColor: number = userConfig.ConceptualEdgeColor; + oldPhysical2EdgeColor: number = userConfig.Physical2EdgeColor; oldViewSize = { minViewHeight: userConfig.viewSize.minViewHeight, maxViewHeight: userConfig.viewSize.maxViewHeight, @@ -62,6 +64,9 @@ export class ConfigStore extends Singleton userConfig.SystemConfig.background = this.oldBgcolor; } + userConfig.ConceptualEdgeColor = this.oldConceptualEdgeColor; + userConfig.Physical2EdgeColor = this.oldPhysical2EdgeColor; + //视图范围和缩放速度恢复上一次保存 userConfig.viewSize.minViewHeight = this.oldViewSize.minViewHeight; userConfig.viewSize.maxViewHeight = this.oldViewSize.maxViewHeight; @@ -88,6 +93,12 @@ export class ConfigStore extends Singleton else this.oldBgcolor = userConfig.SystemConfig.background; + //更新线框颜色 + this.oldConceptualEdgeColor = userConfig.ConceptualEdgeColor; + this.oldPhysical2EdgeColor = userConfig.Physical2EdgeColor; + ColorMaterial.UpdateConceptualEdgeMaterial(); + ColorMaterial.UpdatePhysical2EdgeMaterial(); + //更新视图范围和缩放是速度 this.oldViewSize.minViewHeight = userConfig.viewSize.minViewHeight; this.oldViewSize.maxViewHeight = userConfig.viewSize.maxViewHeight; diff --git a/src/UI/Components/Modal/OptionModal/DisplayConfigPanel.tsx b/src/UI/Components/Modal/OptionModal/DisplayConfigPanel.tsx index d53db1040..21c25d491 100644 --- a/src/UI/Components/Modal/OptionModal/DisplayConfigPanel.tsx +++ b/src/UI/Components/Modal/OptionModal/DisplayConfigPanel.tsx @@ -10,6 +10,7 @@ import { KeyBoard } from "../../../../Common/KeyEnum"; import { AAType, ViewDirType } from "../../../../Common/SystemEnum"; import { FixedNotZero } from "../../../../Common/Utils"; import { userConfig } from "../../../../Editor/UserConfig"; +import { ConfigColorList } from "./ConfigColorList"; import { ConfigStore } from "./ConfigDialog"; import './ConfigPanelStyle.less'; @@ -34,6 +35,13 @@ const Padding: React.CSSProperties = { margin: 0 }; +export const ColorList: [string, number][] = [ + ["黑色", 0], ["红色", 1], + ["黄色", 2], ["绿色", 3], + ["青色", 4], ["蓝色", 5], + ["洋红色", 6], ["白色", 7], +]; + @observer export class DisplayConfigPanel extends React.Component<{ store: ConfigStore; }> { @@ -42,6 +50,7 @@ export class DisplayConfigPanel extends React.Component<{ store: ConfigStore; }> @observable _ZoomSpeed: number = userConfig.viewSize.zoomSpeed; @observable private errorMsg: boolean[] = [false, false, false]; @observable private errorStr = ""; + @observable isShow = false; _inputEl1 = React.createRef(); _inputEl2 = React.createRef(); _SpeedInputEl = React.createRef(); @@ -60,6 +69,13 @@ export class DisplayConfigPanel extends React.Component<{ store: ConfigStore; }> app.Viewer.Renderer.setClearColor(new Color(color.hex), 1); app.Editor.UpdateScreen(); }; + + handleChangeEdgeColor = (e: React.MouseEvent, type: string) => + { + let el = e.target as HTMLLIElement; + if (el.value !== undefined) + userConfig[type] = el.value; + }; render() { let isLayout = app.Viewer.isLayout; @@ -68,7 +84,7 @@ export class DisplayConfigPanel extends React.Component<{ store: ConfigStore; }>
背景色: -
+
onChange={e => userConfig.viewDirType = parseFloat(e.target.value)} /> + +
缩放速度系数： -
+
{ type={CheckObjectType.OnlyNumber} option={userConfig} optKey={"cabinetSpacing"} + onChange={(e) => { userConfig.cabinetSpacing = Number(e.target.value); }} onBlur={(e, hasErr) => { if (hasErr) diff --git a/src/UI/Css/style.less b/src/UI/Css/style.less index c0368af8e..6f9c13f59 100644 --- a/src/UI/Css/style.less +++ b/src/UI/Css/style.less @@ -1191,3 +1191,38 @@ img { background-color: white; } } + +#color-list { + .borderstyle { + border: 1px solid #aaa; + border-radius: 4px; + } + + width: 120px; + + &>:nth-child(1){ + .borderstyle(); + cursor: pointer; + display: flex; + justify-content: space-between + } + + &>:nth-child(2){ + // position: relative; + &>div{ + &>ul { + .borderstyle(); + width: 120px; + height: auto; + background-color: white; + border-top: none; + z-index: 20; + position: absolute; + } + } + } + + li:hover{ + background-color: #ccc; + } +}