spyoungtech / spyoungtech/FreeSimpleGUI
[Bug] Column -> Row -> Column breakes expand_x=True
Nobody has claimed this yet.
- Dominant language
- Python
- Stars
- 867
- Forks
- 106
- Avg merge
- 1m
- Merged PRs (30d)
- 2
Description
Writing a layout that contains a Column(expand_x=True) which contains a row with another Column(expand_x=True) brakes the space calculations of the inner column. I noticed this since I wanted to make a first column making it work as a container element, and then putting inside a row whith an Image and another Column to put other elements beside the image and make them occupy all the space available but they simply don't.
This is the code I was tampering with.
import FreeSimpleGUI as sg
sg.theme("Reddit")
searchFilterValues = ["Titolo", "Artista", "Album"]
bottomBarBgColor = sg.theme_input_background_color()
# Define the window's contents
layout1 = [
[sg.Input(expand_x=True), sg.Combo(values=searchFilterValues, default_value=searchFilterValues[0], readonly=True), sg.Button(button_text="Cerca", size=(5,1))],
[sg.Table(
expand_x=True,
expand_y=True,
row_height=18,
auto_size_columns=False,
col_widths=[20, 20, 10, 3],
cols_justification=["l", "l", "l", "r"],
alternating_row_color=bottomBarBgColor,
headings=["Titolo", "Album", "Artista", "Durata"],
values=[
["Applause", "Pop", "Lady Gaga", "3:20"],
["Fine Line", "Fine Line", "Harry Styles", "2:54"]
]
)]
]
layout2 = [
[sg.Input(expand_x=True)],
[sg.Text(text="Tab 2")]
]
layout3 = [
[sg.Input(expand_x=True)],
[sg.Text(text="Tab 3")]
]
layoutMusicReproducer = [
[sg.Image(size=(90,90), source="./Images/default_resized.png"), sg.Column(layout= [
[sg.Text("Riproduci qualcosa", background_color=bottomBarBgColor, expand_x=True), sg.Button("Play"), sg.Button("Next")],
[sg.Text("Album - Artista", background_color=bottomBarBgColor, auto_size_text=False)],
[sg.Slider(range=(0,100), expand_x=True, disable_number_display=True, orientation="h")]
], background_color=bottomBarBgColor)]
]
tabLayout = [
[sg.Tab(layout=layout1, title="Cerca"), sg.Tab(layout=layout2, title="Album"), sg.Tab(layout=layout3, title="Playlist")],
]
layout = [
[sg.TabGroup(tabLayout, expand_x=True, expand_y=True)],
[sg.Column(layout=layoutMusicReproducer, size=(200, 100), expand_x=True, background_color=bottomBarBgColor)]
]
# Create the window
window = sg.Window('MyMusic Local 0.1', layout, resizable=True, size=(800, 500))
# Display and interact with the Window using an Event Loop
while True:
event, values = window.read()
# See if user wants to quit or window was closed
if event == sg.WINDOW_CLOSED or event == 'Quit':
break
# Finish up by removing from the screen
window.close()
And this is the result:
Notice that removing the inner column makes expand_x works again as intednded. Here is what i mean:
layoutMusicReproducer = [
[sg.Text("Riproduci qualcosa", background_color=bottomBarBgColor), sg.Push(), sg.Button("Play"), sg.Button("Next")],
[sg.Text("Album - Artista", background_color=bottomBarBgColor)],
[sg.Slider(range=(0,100), expand_x=True, disable_number_display=True, orientation="h")]
]
tabLayout = [
[sg.Tab(layout=layout1, title="Cerca"), sg.Tab(layout=layout2, title="Album"), sg.Tab(layout=layout3, title="Playlist")],
]
layout = [
[sg.TabGroup(tabLayout, expand_x=True, expand_y=True)],
[sg.Column(layout=[[sg.Image(source="./Images/default_resized.png", size=(90, 90))]], background_color=bottomBarBgColor), sg.Column(layout=layoutMusicReproducer, expand_x=True)]
]
I work as a software developer myself and I think that usign expand_x and expand_y to make a sort of responsive layout in FreeSimpleGui adds a great value to the library, enabling developers to build really complex layouts.
I also noticed that on the old PySimpleGui repository theres a similar issue solved (as a workaround) by using the repack function:
Here is the link: https://github.com/PySimpleGUI/PySimpleGUI/issues/6132
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by running the supplied FreeSimpleGUI example and compare the nested Column(expand_x=True) layout with the flattened workaround. Trace the space calculation for the inner Column and verify that it expands beside the Image while retaining the expected behavior of the surrounding layout.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- python
- Domain
- desktop
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 50/100