How to expand Container/child control vertically in a row?

[nizarbathery]

Question

Hi,
I have multiple containers in a row with different heights, I need to set the background color filled vertically and horizontally to the other items in a row. height of each control is dynamic.

any suggestions?

Code sample

I have tried below code to test.

import flet as ft

def main(page: ft.Page):

    cols = ft.Column(
            [
                ft.Container(
                    content=ft.Row(
                        [
                             ft.Container(
                                content=ft.Text(value='Column 1'),
                                alignment=ft.alignment.center,
                                bgcolor=ft.colors.AMBER_500,
                                expand=True
                            ),
                            ft.Container(
                                content=ft.Text(value='Column 2'),
                                alignment=ft.alignment.center,
                                height=150,
                                bgcolor=ft.colors.AMBER_500,
                            )
                        ]
                    ),
                    bgcolor=ft.colors.AMBER_100
                ),
            ])
    

    page.add(cols)

ft.app(target=main)

Error message

No response

------------------------------------------------------

• I have searched for answers to my question both in the issues and in previous discussions.

[ndonkoHenri]

I need to set the background color filled vertically and horizontally to the other items in a row.

I don't get you.
Please can you better explain what you mean?

[nizarbathery]

Hi @ndonkoHenri ,
Thanks for looking into this, I am trying to make gridview/table user control which can have rows and columns, when we feed the data into this user control I manage to create rows with multiple containers (cells) that hold text. The issue is, I need to filling a background color vertically to each container(table cell) is not working, so if the text is less or more in the container, the background color doesn't fill up the empty space (vertically).

The left side (column1) background is not filled in the above code and the screenshot. The idea is each column (container) in the row should be the same height of the highest container in the row.

[ndonkoHenri]

• 
• 

?