New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
inspector add screenshot #4274
inspector add screenshot #4274
Conversation
return SynchronousFuture<EasyImageProvider>(this); | ||
} | ||
|
||
@override |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit: why are we overriding == and hashcode?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks. The implementation of this component is in another function big picture detection, and may refer to the implementation of other providers. Here is directly reused. It may not be needed here. i will delete it.
if (useDaemonApi) { | ||
return invokeServiceMethodDaemonParams('screenshot', { | ||
'id': selection.id, | ||
'width': 480, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
pass in width and height as named parameters to this method.
I would also recommend using sizes based on the size available in the UI rather than forcing to 480 and 640. Smaller screenshots are significantly faster to send from the device and to encode.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
yes you are right i will revise it.
return Text("no data"); | ||
} | ||
return Container( | ||
width: 480, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
make these const and adjust based on the size of the window. If DevTools is displayed in a small embedded window, you probably want a smaller screenshot.
We've considered this kind of widget screenshot in the HotUI experiment: https://docs.google.com/document/d/1ZaHqKnON8-WEhke3Y6FpHeuB5BNlxDQj1cCYB1SoI_g/edit#heading=h.pub7jnop54q0 About the specific UI, I wonder if we can solve the same problem by hooking up widget selection in the tree view to the on-device widget highlighter. Essentially, when you select a node in the tree, the corresponding widget will get highlighted on the device/simulator automatically, allowing you to identify the widget. @zzm990321 Is this what you use the widget screenshots for? It would be helpful if you can elaborate on your use case a bit more. |
I'd added that API to Flutter for use cases similar to this but never had time to implement in DevTools.
|
Thank you for your reply. I think it's good to display it on the device too, but viewing it on devtools makes it clear that only a widget is viewed,it will not be affected by other displays and this image can be saved. |
Sincerely thank you for your advice.
@InMatrix @jacob314 Thanks for the suggestion. After confirming that the code can be merged, I will fix code problem uniformly |
This sounds reasonable. Could you prototype it and post a video? Also, how performant is taking screenshots for individual widgets? For example, when the user quickly cycle through a bunch of widgets in the tree view, how long does it take for each screenshot to load? |
OK I'll implement a prototype later. In terms of performance, there is no test yet. I think @jacob314 may know more about it, and we can listen to his opinions and I will do some tests later too |
@mengdouer Is this PR still on your radar? |
@mengdouer thanks for your contribution! |
This pr is a screenshot of the current widget that can be displayed on the inspect screen when you double-click its widget. Below is its demo. Inside our company, this feature is very helpful in debugging.
It's still in the draft stage, not sure how you feel about this change, any thoughts on this can be discussed here.
2022-07-21.18.31.11.mov
Pre-launch Checklist
///
).If you need help, consider asking
for advice on the #hackers-new channel on Discord.