diff --git a/src/canvas/widgets/base.js b/src/canvas/widgets/base.js index ffe9088..5f46b80 100644 --- a/src/canvas/widgets/base.js +++ b/src/canvas/widgets/base.js @@ -214,13 +214,14 @@ class Widget extends React.Component { this.stateUpdateCallback = null // allowing other components such as toolbar to subscribe to changes in this widget this.resizeObserver = null + + this.setLayout({layout: Layouts.PLACE, gap: 10}) } componentDidMount() { - this.setLayout({layout: Layouts.PLACE, gap: 10}) // if (this.state.attrs.layout){ // this.setLayout(this.state.attrs.layout.value) @@ -704,8 +705,7 @@ class Widget extends React.Component { } getLayout(){ - - return this.getAttrValue("layout") || Layouts.PLACE + return this.getAttrValue("layout") || {layout: Layouts.PLACE} } setLayout(value) { diff --git a/src/frameworks/customtk/widgets/base.js b/src/frameworks/customtk/widgets/base.js index 4d7d117..d942fe2 100644 --- a/src/frameworks/customtk/widgets/base.js +++ b/src/frameworks/customtk/widgets/base.js @@ -811,8 +811,6 @@ export class CustomTkBase extends Widget { }else if (layout === Layouts.FLEX){ const {gridConfig, gridWeights, ...restAttrs} = this.state.attrs - console.log("Flex: ", restAttrs) - this.updateState((prevState) => ({attrs: {...restAttrs}})) } @@ -938,6 +936,7 @@ export class CustomTkBase extends Widget { pos } + const {layout} = attrs this.setState(newData, () => { let layoutAttrs = this.setParentLayout(parentLayout).attrs || {} @@ -973,6 +972,10 @@ export class CustomTkBase extends Widget { if (selected){ this.select() } + + if (layout){ + this.setLayout(layout) + } }) diff --git a/src/frameworks/tkinter/widgets/base.js b/src/frameworks/tkinter/widgets/base.js index 437ea9c..633d945 100644 --- a/src/frameworks/tkinter/widgets/base.js +++ b/src/frameworks/tkinter/widgets/base.js @@ -812,8 +812,6 @@ export class TkinterBase extends Widget { }else if (layout === Layouts.FLEX){ const {gridConfig, gridWeights, ...restAttrs} = this.state.attrs - console.log("Flex: ", restAttrs) - this.updateState((prevState) => ({attrs: {...restAttrs}})) } @@ -938,6 +936,8 @@ export class TkinterBase extends Widget { ...layoutUpdates, pos } + + const {layout} = attrs this.setState(newData, () => { @@ -965,7 +965,7 @@ export class TkinterBase extends Widget { if (newAttrs?.styling?.backgroundColor){ - // TODO: find a better way to apply innerStyles + // TODO: find a better way to apply innerStyles (we may not need this anymore) this.setWidgetInnerStyle("backgroundColor", newAttrs.styling.backgroundColor.value) } this.updateState({ attrs: newAttrs }, callback) @@ -974,6 +974,10 @@ export class TkinterBase extends Widget { if (selected){ this.select() } + + if (layout){ + this.setLayout(layout) + } })