Moving in a menu from the left and fading in a greyed out area on the right of it

Hello everyone,

I am facing a little trouble while optimizing my UI and maybe you could help me out. On my screen, I have a menu button in the upper left corner (like in most smartphone apps today, three horizontal bars). Right now, when I press that button, a menu window is attached to the currently open window. I did an override for the drawing function of the menu window, so that a grey, gauss-blurred line ro the right of the just opened menu is displayed and then only the child widgets of the menu (so that the rest window is transparent and doesnt block the view of the window behind it. Please see attached image for a better overview (Shown is the menu window, where only the child widgets are drawn in the window_menu_draw handler)

My goal would be, however, that the menu is moved in from the left and the more it moves, the more the underlying window should be greyed out (increasing the alpha of a sprite/pixelmap which fills the screen "under" the menu). I have tried a few approaches including just altering the GX_RECTANGLE of the menu window, but that didnt work (e.g. just the window was moved, the child elements not), using gx_canvas_block_move and others.

I also tried an approach similar to the solution here:

But the problem here is that the whole framebuffer is replaced and what I would need is a blending of the current framebuffer (showing the window from which I opened the menu) and the framebuffer containing the menu (which is just 250px wide.

Does anybody have an idea how I could achieve the effect i desire?

Kind regards,