Clone a panel of widgets - gwt

is it possible in GWT to clone a panel? If so, are all the handler settings copied as well?
Basically I have a Panel full of controls, all laid out, I want to copy it and pop it up in a PopupPanel without having to go through the code that created the controls in the first place.
I got as far as DOM.clone(), and this message post. But there is no wrap() in Widget, UIObject etc. setElement() is protected.

Quick way to build a Widget from a DOM element:
Widget widget = new Widget () {{
setElement(myElement);
}};
But no, AFAIK DOM.clone() isn't going to copy attached handlers as well. I suspect this won't work as well as you're hoping.

Have you considered creating a new GWT widget, consisting of all of those controls? That way you can host the widget panel in both places without resorting to cloning it. (And possibly saving you subtle bugs in the process.)

Create a new class with all the controls and other features that you have in your panel and treat this as a new widget... Now you don't have to worry about cloning them, you can use this as a regular widget in your program (you can initialize it the same way you do rest of the widgets)... This is how i started off for one of my projects, where i was trying to clone a panel...

Related

Flutter: Using expansion panel with navigator animate the AppBar when expansion panel is open

In one section of a client's app an expansion panel / accordion is used to open some content. At the same time the AppBar is supposed to animated as is a new route has been pushed but the new route's content should display in the body of the expansion panel.
I have been able to implement this by creating an entirely independent Widget and using a state management library but it is not a tidy solution.
I wondered if it is possible to use the App's main Navigator but not remove the current route's body. This cannot be done with a nested navigator either as the AppBar uses Hero tags that are not reflected between Navigator's.
Is there a simple way to achieve this without using entirely customised state management.
Flutter's in built Navigator, even Navigator 2.0, is well known to not be a particularly friendly interface to use, so I'd recommend the use of a community library that makes things easier.
Auto Route is a popular solution that I use personally and can attest to its quality. For your particular problem it offers navigation observers which you can register. You could use this to trigger the animation of your app bar when the new route is pushed.
It will be a little bit of effort to replace your current navigation with a new library but I'd imagine you'll end up with a cleaner solution at the end instead of customized state management.

What is the best practice to improve performance?

I'm newly learning and creating simple app using flutter.
I created drawer inside Scaffold for some pages and I got confused if when I click the ListTiles, should it be routing the pages or just switch the body widget using setState().
I guess setState() must perform better but I'm not sure if this is a good practice for pages. If it does not have a big difference in performance, I would like to use routing the pages since it will be uniformed.
Personal opinion:
Avoid separating widgets into functions, use StatelessWidget instead. Cause every render function will rebuild whatever parameter changes.
Avoid using setState as much as possible, especially for large Widgets, instead use provider, get or simply use ValueNotifier if you dont want library. Cause setState will mark all things to be rerender include widgets that not need to be rerender.
Do not render too many things at once, if possible only render the views that are / are about to be displayed. Example using ListView.builder instead of ListView, ... etc
With image, please resize to suit your needs, a 2000x2000 image loaded as a 24x24 icon is clearly not a good idea.
using const.
I'd suggest to redirect user to the next page as it won't require a StatefulWidget (you can use navigator to navigate user to another activity) which will be lighter to run, as if you use IndexedStack or dynamically assign the widget it'll require the StatefulWidget..

How to prevent Stateful Widget stored in List to be disposed?

Let me start by explaining the problem. I have several buttons which are created based on data I'm getting from a server. On each button click I need to create and display a widget which will present me some data (this widget is also built dynamically). The state of this widget has to be preserved during the lifetime of the app. (for example if I click another button and show a different widget, I need to be able to click on the first button and show the first widget in its preserved state). Number of buttons can also be changed during the app lifetime.
I tried using IndexedStack to achieve this, but when the number of buttons is changed I need to add "pages" to IndexedStack, therefore I need to recreate a new IndexedStack which will have some of my old widgets, so I pull widgets from a List or create new ones if needed. This works great, except Flutter calls dispose() method on my widgets which are stored in the list. I tried using the AutomaticKeepAliveClientMixIn but it didn't help.
I'm guessing this has something to do that the widgets get detached from the parent, but when I reattach them to new parent (new Indexed stack) Flutter doesn't figure out this properly.
Any ideas?
Try to store data to local storage or sqlite for persistence data.

TabLayoutPanel finish loading event

I use a GWT TabLayoutPanel which contains several Google Charts Widgets.
I want to know if there's a handler/method that can be called once all the widgets in the tab have finished loading.(after I click the tab)
I need this because I refresh/reload the Charts once I click the tab, but the charts MUST be loaded first or the height/width won't apply on the charts.
Any help?
You can get UI widgets by Iterating or something like widget.getElementBytagName(). You should try gwt.Document.DOMHandler. widget.addDomHandler can get to iterate its sub widget or everythings under this widget. Really you don't need to invoke handlers to each widget. Try with DOMHandler. This can be OK. I don't know clearly what you really want to do. Please describe with your codes as you can.

Is it possible to add/inject an instance of a Widget into many panels?

I've tried doing this but only one panel gets the Widget shown. What is the approach to add an instance of a Widget into many panels? Or is it even possible?
If by inject, you mean use some DI tool (like Guice), then yes, you can inject the instance into many other instances as a singleton (just like any other singleton).
However, a given Widget can only be rendered in one place at a time. Elements can be cloned, but there is no general method of copying a widget to draw it in more than one place, mostly due to all of the event handlers that have to be added again.
How would then this method work?
Widget getParent()
Gets this widget's parent panel.
So you have to create multiple instances. Btw what's your use case?