Flutter: code analysis and layout explorer in code at build time

618 views Asked by At

I'm new to flutter, so I hope my question will not be too much out of scope:

I would like to extract meta informations about the app at build time. The idea is to have JSON tree of the app widgets and send it to an external database via API call for further statistics

Here is a simplified example of my app structure

Scaffold
├─ Page1: homePage
│ ├── BtnWidget: btn1
│ └── RandomWidget
└─ Page2: profilePage
  └── BtnWidget: btn2

And ideally I would like to be able to retrieve something like:

{
  "homePage": { // identifier is used when found to uniquely describe a widget
    "type": "screen",
    "children": ["btn1"], // hierarchical information
    "parent": null,
  },
  ...
}

Is it possible to access the widget list and their properties in code at build time ? Or anytime ?


My researchs:

I have looked this package: build that seems a good lead but I didn't fully understood how it worked for my purpose I have also searched on google or stack overflow but couldn't find nothing relevant


The goal:

When I build a new application, the widget tree and some meta data (version, new features...) is send to a database where data are crossed with user app interaction data (click, swipe...) to track UX statistics along with app versions.

1

There are 1 answers

3
jjanvier On

It seems what you are looking for is close to debugDumpApp() or debugDumpRenderTree(). Check out this doc https://docs.flutter.dev/testing/code-debugging#render-tree, I guess it's a good starting point.