Recently, I have had time to study the underlying rendering logic of Flutter for Windows. Google’s Engine on IOS and Android handles the external Texture code and comments more concrete. comments on Windows are either not yet supported, will be supported soon, or may change in the future, so you’ll need to customize the Engine.

This requires a lot of engineering knowledge, such as the use of GN and Cmake, I do not know so much as a reader, but referring to the external texture of other platforms, summed up the general process.

Antecedents feed

In the last article, we combed throughFlutterWindowsEngineThe creation process that found it created oneAngleSurfaceManager“, opens the file and discovers that this is a heavyweight.

src\flutter\shell\platform\windowsSource directory

AngleSurfaceManager

ANGLEWhat is?

Flutter official explanation:

I can see that GL goes to DX11 or DX12, so let’s look at the declaration file

angle_surface_manager.h

You can see that ANGLE uses EGL for graphical manipulation here.

These are private methods that are not exposed to the outside world. To share textures, you need to take the context, and the shared textures are used inside the Flutter itself, egl_resource_context_ and egl_context_, one for uploading textures asynchronously and one for rendering.

angle_surface_manager.cc

So let’s look at the contents of the initial GLcontext of this thing

The Initialize function

This function is too much, so we truncate it and share the Context inside the Flutter via the third parameter of eglCreateContext.

The texture registration process in Flutter Win

Everything comes from this issue

Issue #78648 · flutter/flutter (github.com)

In the demo flutter_windows_texture_bug of the author of the issue, there is a content about how to register and upload textures under Windows. The specific process in gldraw_plugin. CPP GLDrawPlugin: : HandleMethodCall inside. He used the official current implementation PixelBufferTexture and TextureVariant, complete CPU – > GPU texture upload method, triggered by MarkTextureFrameAvailable callback function update texture, for RGBA8 pixel format. This works if your flow is only used inside the Flutter.

The process can be summarized as follows

It’s no different from any other platform

Take it a step further

Remember the flutter_windows.cc I talked about in previous articles?

Start the Flutter Engine on Windows

No matter you are above PixelBufferTexture or something, he is a interface, the final data or through layer upon layer processing, will be stored in FlutterDesktopTextureInfo.

SRC \ flutter, shell, platform, common \ public \ flutter_texture_registrar h contains FlutterDesktopTextureInfo definition, made the data reference and the type definition

Seeing the essence, let’s go through the registration process and see what’s going on inside

1. FlutterWindowsTextureRegistrar

Win the Registrar is FlutterWindowsTextureRegistrar platform, Implemented as SRC \ flutter \ shell \ platform \ Windows \ flutter_windows_texture_registrar cc

Let’s have a look at his RegisterTexture function:

Line 31 appears! Flutter: : ExternalTextureGL, this is for internal use external texture object, the constructor parameters including our initial setting for the use of MarkTextureFrameAvailable function.

2. ExternalTextureGL

Implementation file SRC/flutter/shell/platform/Windows/external_texture_gl. Cc, an open, kind and lovely.

ExternalTextureGLState stores GLuint, the second texture identifier parameter, using glGenTextures.

PopulateTexture calls CopyPixelBuffer to determine if the GLunit of ExternalTextureGLState is 0. If it is 0, initialize and generate a texture. If it is not 0, glBindTexture will be created.

See texture_callback on line 103, where the function we wrote at the top is called, generating and passing the data.

So who callsPopulateTexture?

Hey, hey, Registrar! It stores every texture registered with it, pulls the required texture from its textures_ library, and calls it.

Here a question: had some connection with maybe MarkTextureFrameAvailable, curious to check engine how to call this function.

whimsical

Prerequisites: You have obtained the egl_context in Angle_Surface_Manager and used it to create your own egl_context.

  1. I wonder if we could register the texture Registrar and change his ExternalTextureGLState to be the GLuint generated by the textures in other eGL_context and modify the Populate and Copy functions. To prevent unnecessary GL operations, or custom glTexSub, etc., then MarkAvaible……

  2. You already have the egl_context of flutter and you want to put it into another graphics rendering engine, you can take it away…..

END

This may be the penultimate article in this column, but for all the research engine has done, it’s not as enjoyable as writing dart directly. So stop learning engine next, I hope this article is useful to you!!

Error, leave a message, click like!

Start engine with Cmake and Vs2019.

Cmake and Vs2019 start the Flutter Engine