Miko/PyUIBuilder
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: grid view count

Browse Source
This commit is contained in:
paul
2025-03-22 11:11:19 +05:30
parent 22718369e1
commit c2b0532e96
26 changed files with 122 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/frameworks/tkinter/widgets/base.js
View File

@@ -61,8 +61,24 @@ export class TkinterBase extends Widget {
}else if (parentLayout === Layouts.FLEX){
const config = {
side: direction === "row" ? "tk.LEFT" : "tk.TOP",
const packSide = this.getAttrValue("flexManager.side")
const config = {}
if (packSide === "" || packSide === "top"){
config['side'] = `tk.TOP`
}else if (packSide === "left"){
config['side'] = `tk.LEFT`
}else if (packSide === "right"){
config['side'] = `tk.RIGHT`
}else{
config['side'] = `tk.BOTTOM`
}
if (gap > 0){
@@ -126,19 +142,11 @@ export class TkinterBase extends Widget {
if (!layout){
return {}
}
super.setParentLayout(layout)
let updates = super.setParentLayout(layout)
const {layout: parentLayout, direction, gap} = layout
// show attributes related to the layout manager
let updates = {
parentLayout: layout,
}
// this.removeAttr("gridManager")
// this.removeAttr("flexManager")
// this.removeAttr("positioning")
// remove gridManager, flexManager positioning
const {gridManager, flexManager, positioning, ...restAttrs} = this.state.attrs
@@ -284,7 +292,6 @@ export class TkinterBase extends Widget {
onChange: (value) => {
const previousRow = this.getWidgetOuterStyle("gridRow") || "1/1"
let [_row=1, rowSpan=1] = previousRow.replace(/\s+/g, '').split("/").map(Number)
if (value > rowSpan){
@@ -292,7 +299,6 @@ export class TkinterBase extends Widget {
rowSpan = value
this.setAttrValue("gridManager.rowSpan", rowSpan)
}
this.setAttrValue("gridManager.row", value)
this.setWidgetOuterStyle("gridRow", `${value+' / '+rowSpan}`)
}
@@ -565,8 +571,6 @@ export class TkinterBase extends Widget {
gridTemplateColumns: "repeat(auto-fill, minmax(100px, 1fr))",
gridTemplateRows: "repeat(auto-fill, minmax(100px, 1fr))",
// gridTemplateColumns: layout === Layouts.FLEX ? "minmax(auto, 1fr) 1fr minmax(auto, 1fr)" : "repeat(auto-fill, minmax(100px, 1fr))",
// gridTemplateRows: layout === Layouts.FLEX ? "minmax(auto, 1fr) 1fr minmax(auto, 1fr)" : "repeat(auto-fill, minmax(100px, 1fr))",
// gridAutoRows: 'minmax(100px, auto)', // Rows with minimum height of 100px, and grow to fit content
// gridAutoCols: 'minmax(100px, auto)', // Cols with minimum height of 100px, and grow to fit content
}
@@ -648,7 +652,10 @@ export class TkinterBase extends Widget {
data = {...data} // create a shallow copy
const {attrs={}, selected, pos={x: 0, y: 0}, parentLayout=null, ...restData} = data
const {attrs={}, selected, pos={x: 0, y: 0}, ...restData} = data
const parentLayout = this.props.parentWidgetRef?.current?.getLayout()
let layoutUpdates = {
parentLayout: parentLayout

1
src/frameworks/tkinter/widgets/button.js
View File

@@ -69,6 +69,7 @@ class Button extends TkinterWidgetBase{
<div className="tw-w-flex tw-flex-col tw-w-full tw-h-full tw-rounded-md
tw-border tw-border-solid tw-border-gray-400 tw-overflow-hidden">
<div className="tw-p-2 tw-w-full tw-flex tw-place-content-center tw-place-items-center tw-h-full tw-text-center"
ref={this.styleAreaRef}
style={this.getInnerRenderStyling()}>
{/* {this.props.children} */}
<div className="tw-text-sm" style={{color: this.getAttrValue("styling.foregroundColor")}}>

1
src/frameworks/tkinter/widgets/checkButton.js
View File

@@ -98,6 +98,7 @@ export class CheckBox extends TkinterWidgetBase{
return (
<div className="tw-flex tw-p-1 tw-w-full tw-h-full tw-rounded-md tw-overflow-hidden"
style={this.getInnerRenderStyling()}
ref={this.styleAreaRef}
>
<div className="tw-flex tw-gap-2 tw-w-full tw-h-full tw-place-items-center tw-place-content-center">

4
src/frameworks/tkinter/widgets/frame.js
View File

@@ -46,7 +46,9 @@ class Frame extends TkinterBase{
// console.log("widget styling: ", this.state.widgetInnerStyling)
return (
<div className="tw-w-flex tw-flex-col tw-w-full tw-h-full tw-relative tw-rounded-md tw-overflow-hidden">
<div className="tw-p-2 tw-w-full tw-h-full tw-content-start" style={this.getInnerRenderStyling()}>
<div className="tw-p-2 tw-w-full tw-h-full tw-content-start"
ref={this.styleAreaRef}
style={this.getInnerRenderStyling()}>
{this.props.children}
</div>
</div>

2
src/frameworks/tkinter/widgets/input.js
View File

@@ -66,6 +66,7 @@ export class Input extends TkinterWidgetBase{
return (
<div className="tw-w-flex tw-flex-col tw-w-full tw-h-full tw-rounded-md tw-overflow-hidden">
<div className="tw-p-2 tw-w-full tw-h-full tw-flex tw-place-items-center"
ref={this.styleAreaRef}
style={this.getInnerRenderStyling()}>
<div className="tw-text-sm tw-text-gray-300">
{this.getAttrValue("placeHolder")}
@@ -139,6 +140,7 @@ export class Text extends TkinterWidgetBase{
return (
<div className="tw-w-flex tw-flex-col tw-w-full tw-h-full tw-rounded-md tw-overflow-hidden">
<div className="tw-p-2 tw-w-full tw-h-full tw-content-start "
ref={this.styleAreaRef}
style={this.getInnerRenderStyling()}>
<div className="tw-text-sm tw-text-gray-300">
{this.getAttrValue("placeHolder")}

1
src/frameworks/tkinter/widgets/label.js
View File

@@ -122,6 +122,7 @@ class Label extends TkinterWidgetBase{
}}
>
<div className="tw-p-2 tw-w-full tw-h-full tw-flex tw-place-content-center tw-place-items-center "
ref={this.styleAreaRef}
style={this.getInnerRenderStyling()}>
{/* {this.props.children} */}
{

1
src/frameworks/tkinter/widgets/mainWindow.js
View File

@@ -97,6 +97,7 @@ class MainWindow extends TkinterBase{
</div>
</div>
<div className="tw-p-2 tw-w-full tw-relative tw-h-full tw-overflow-hidden tw-content-start"
ref={this.styleAreaRef}
style={{...this.getInnerRenderStyling(), width: "100%", height: "calc(100% - 25px)"}}>
{/* {this.props.children} */}
{this.renderTkinterLayout()} {/* This is required for pack layouts, so if your widget accepts child widgets, ensure to add this */}

1
src/frameworks/tkinter/widgets/optionMenu.js
View File

@@ -101,6 +101,7 @@ class OptionMenu extends TkinterWidgetBase{
return (
<div className="tw-flex tw-p-1 tw-w-full tw-h-full tw-rounded-md tw-overflow-hidden"
style={this.getInnerRenderStyling()}
ref={this.styleAreaRef}
onClick={this.toggleDropDownOpen}
>
<div className="tw-flex tw-justify-between tw-gap-1">

4
src/frameworks/tkinter/widgets/slider.js
View File

@@ -138,7 +138,9 @@ class Slider extends TkinterWidgetBase{
return (
<div className="tw-w-flex tw-flex-col tw-w-full tw-h-full tw-rounded-md tw-overflow-hidden">
<div className="flex flex-col items-center justify-center h-screen
bg-gray-100" style={this.getInnerRenderStyling()}>
bg-gray-100"
ref={this.styleAreaRef}
style={this.getInnerRenderStyling()}>
<div className="w-full max-w-md">
<input
type="range"

1
src/frameworks/tkinter/widgets/spinBox.js
View File

@@ -110,6 +110,7 @@ class SpinBox extends TkinterWidgetBase{
return (
<div className="tw-w-flex tw-flex-col tw-w-full tw-h-full tw-rounded-md tw-overflow-hidden">
<div className="tw-p-2 tw-w-full tw-h-full tw-flex tw-place-items-center tw-justify-between"
ref={this.styleAreaRef}
style={this.getInnerRenderStyling()}>
<div className="tw-text-sm ">
{this.getAttrValue("spinProps.default")}

4
src/frameworks/tkinter/widgets/toplevel.js
View File

@@ -78,7 +78,9 @@ class TopLevel extends Widget{
</div>
</div>
</div>
<div className="tw-p-2 tw-w-full tw-h-full tw-content-start" style={this.state.widgetInnerStyling}>
<div className="tw-p-2 tw-w-full tw-h-full tw-content-start"
ref={this.styleAreaRef}
style={this.state.widgetInnerStyling}>
{this.props.children}
</div>
</div>