[Question] Aspect_ratio in a Container

[ingdesarr1]

Question

Good afternoon:

In the moment, I try to do a responsive screen, put some images and see if the images change the size in relation to changing the size of the window. if I put the images in any site, the image change the size, using the aspect ratio, but, if I put a specific site to the image, using top, bottom, etc, the image disapear and don't show nothing. I want to know if it's a problem of code, or it's a conflict between aspect_ratio and the other command. Let the code below.

Code sample

ft.Container(
        ft.Stack(
            controls=[
                ft.Container(
                    content=ft.Image(
                           ft.Image(
                           src="/images/industrial/silo.png", 
                           fit=ft.ImageFit.CONTAIN,
                           width=90,
                           height=194,),
                    bgcolor=ft.colors.BLACK,
                    top=100,
                    # expand=True,
                    # aspect_ratio=1/1
                ),
                ft.Container(
                    content=ft.Image(
                           ft.Image(
                           src="/images/industrial/silo.png", 
                           fit=ft.ImageFit.CONTAIN,
                           width=90,
                           height=194,),
                    # left=500,
                    # expand=True,
                    aspect_ratio=1/5
                ),
                ft.Container(ft.ElevatedButton(text="texto", on_click=hola),right=50,bottom=0),
                

            ],
            # expand=True,
            # width=float("inf"),
            # height=float("inf"),
            # aspect_ratio=2/1
        ),
        bgcolor=ft.colors.BLUE,
        # expand=True,
        width=float("inf"),
        height=float("inf"),
        # aspect_ratio=2/1
    )

Error message

No response

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

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

[ndonkoHenri]

Can you please paste some runnable code with the issue?

[ncumaco]

Sorry for the preview code. In this new code show better the problem. If you see, I have a Stack, and inside, I have two Containers. The images can be anything. In the first container, the image use the parameter "aspect_ratio" to change its size as the window size change. In the second, I use the same parameter, but if I use in conjuntion with parameters like "top", "bottom", or else, the container disapears. How can I use both, or how can I change the size of the element in relation of the window size?

*** Code *****

import flet as ft

import flet.canvas as cv

def main(page: ft.Page):
page.add(
ft.Container(
content=ft.Stack(
controls=[
ft.Container(
content=ft.Image(
src="/images/industrial/silo.png",
fit=ft.ImageFit.CONTAIN,
width=90,
height=194,),
bgcolor=ft.colors.BLACK,
# top=100,
# expand=True,
aspect_ratio=1/5
),
ft.Container(
content=ft.Image(
src="/images/industrial/silo.png",
fit=ft.ImageFit.CONTAIN,
width=90,
height=194,),
# bgcolor=ft.colors.BLUE,
left=500,
# expand=True,
aspect_ratio=1/5
),
# ft.Container(ft.ElevatedButton(text="texto", on_click=hola),right=50,bottom=0),

        ],
        # expand=True,
        # width=float("inf"),
        # height=float("inf"),
        # aspect_ratio=2/1
         ),
        bgcolor=ft.colors.BLUE,
        expand=True,
        width=float("inf"),
        height=float("inf"),
        # aspect_ratio=2/1
    )
)

ft.app(main)