These views flicker unexpectedly.

[BruceLvSwag]

Hi,

I’m running into a frustrating issue with the medical visualization framework built using Trame and VTK. I’ve noticed some strange behaviors when I perform certain operations on the images. For example, after running the program, when I first scroll through the images, the view in the visualization framework flashes for a moment. This happens not just with scrolling but also with the reset image operation and the 2D/3D correspondence functions.

I’ve debugged the program multiple times and checked the window size, and I found that before the visual flash, the window size changes from (934, 542) to (40, 40). What’s odd is that this flashing effect doesn’t occur for every function; it only shows up on the first operation after running the program. After that, I’ve had a hard time finding any similarities among the functions that do cause this issue, making it tough to pinpoint where the problem is.

Thanks a ton for your help!

Normal display screenshot:

Screenshot of the view flashing moment:

Console debugging screenshot:

The following is the main code of trame framework:

with SinglePageWithDrawerLayout(server) as layout:

    layout.title.set_text("")
    with layout.title:
        # iamge
        vuetify.VImg(
            src="img/logo.png",
            height="69",
            width="155",
            aspect_ratio=1,
            classes="",
        )

    with layout.toolbar as tb:
        tb.dense = True
        tb.height = 70
        create_toolbar()
        vuetify.VDivider(
            vertical=True,
            classes="mx-2",
            style="max-width: 10px;display: none",
        )
        with vuetify.VBtn(
            icon=True,
            click=update_reset_resolution,
            style="max-width: 10px;display: none",
        ):
            vuetify.VIcon(
                "mdi-undo-variant",
                style="max-width: 10px;display: none",
            )

    with layout.content:
        with vuetify.VContainer(fluid=True, classes="pa-0 ma-0 fill-height", style={"background-color": "#F0F0F0"}): 
            with vuetify.VCol(
                dense=True,
                style={"flex-grow": 0, "width": "80px",
                       "align-self": "flex-start"}
            ):
                create_drawer()
            with vuetify.VCol(
                dense=True,
                style=("{ widght: '50%', height: '100%'}",),
                v_show="viewLayout !== 'singleView'",
            ):
                with vuetify.VRow(
                        id="view2",
                    classes="pa-0",
                        v_show="viewLayout !== 'singleView'",
                style=("{ widght: '50%', height: viewLayout === 'multiView'?'50%':'100%'}",), 
                        ):
                    view = vtk_widgets.VtkRemoteLocalView(
                        imageViewer2.GetRenderWindow(),
                        **VTK_VIEW2D_SETTINGS,
                        interactor_settings=(
                            "interactorSettings", VIEW_SELECT),
                    )
                    CTRL.view_update2 = view.update
                    # CTRL.view_reset_camera = view.reset_camera
                    # CTRL.view_update2()
                
                with vuetify.VRow(
                        id="view3",
                        classes="pa-0",
                        v_show="viewLayout === 'multiView'",
                        style=("{height:'50%'}", )
                ) as col:
                    view = vtk_widgets.VtkRemoteLocalView(
                        imageViewer3.GetRenderWindow(),
                        **VTK_VIEW2D_SETTINGS,
                        interactor_settings=(
                            "interactorSettings", VIEW_SELECT),
                    )
                    CTRL.view_update3 = view.update
                    # CTRL.view_reset_camera = view.reset_camera
                    # CTRL.view_update3()

                 

            with vuetify.VCol(
                dense=True,
                style=(
                    "{ widght: viewLayout !=='singleView' ? '50%' : '100%', height: '100%' }",
                ),
            ):
                with vuetify.VRow(
                        id="view1",
                        classes="pa-0",
                        style=("{ height: '50%' }",),
                        v_show="viewLayout === 'multiView'"):
                    view = vtk_widgets.VtkRemoteLocalView(
                        imageViewer1.GetRenderWindow(),
                        **VTK_VIEW2D_SETTINGS,
                        interactor_settings=(
                            "interactorSettings", VIEW_SELECT),
                    )
                    CTRL.view_update1 = view.update
                    # CTRL.view_reset_camera = view.reset_camera
                    # CTRL.view_update1()

                with vuetify.VRow(
                    id="view4",
                        style=("{ widght: viewLayout !== 'singleView'?'50%':'100%', height: viewLayout === 'multiView'?'50%':'100%',}",), 
                        classes="pa-0 3d-view"): 
                    view = vtk_widgets.VtkRemoteLocalView(
                        renderWindow3d,
                        **VTK_VIEW3D_SETTINGS
                    )
                    CTRL.view_update4 = view.update
                    # CTRL.view_reset_camera = view.reset_camera
                    # CTRL.view_update4()

    # CTRL.flush_content = layout.flush_content

    with vuetify.VNavigationDrawer(
        v_model=False, 
        app=True,
        right=True, 
        style="width: 380px !important",
        classes="right-nav",
    ) as right_drawer:
        right_drawer.children = [create_right_drawer()]

[jourdain]

The flash is because you use VtkRemoteLocalView. If you want to stay with it, you could set disable_auto_switch=True.
For the render size, that is harder to say and it would require actual investigation. If you need help, don't hesitate to reach out for professional support.

[BruceLvSwag]

I'm really sorry, but I'm not very familiar with the trame framework yet. Could you tell me where I should set 'disable_auto_switch=True'?

[jourdain]

Anywhere you have a VtkRemoteLocalView widget.
But that also beg the question why you are using VtkRemoteLocalView instead of VtkRemoteView if you don't want the flicker.

vtk_widgets.VtkRemoteLocalView(
   imageViewer3.GetRenderWindow(),
   **VTK_VIEW2D_SETTINGS,
   interactor_settings=("interactorSettings", VIEW_SELECT),),
   disable_auto_switch=True, # <================================ add a keyword arg
)