New UI Widgets

Hi @ilih,

Reason im not able to get the ionic like effect is because if there are 4 items, those 4 items use their own flare in their own "space". However in ionic it seems like its only 1 flare which goes over all the item at once
So to get a similar look Flare shader should use a shared space with single source where each item only renders where it is in that space. I can create an image if my explanation is not clear.

 

Yes, the image would be helpful.

 

If you look at ionic, here 4 items share the global space so its like same flare going animating.

 

I'll think about how it can be done.

 

Hi @ilih,
I'm using CustomTileView to setup a paged scrollable like the one above. The items will be positioned from top to bottom and from left to right.
I would like to ask if there is a setup so that the item will be positioned from left to right and from top to bottom top PER PAGE.
Thank you.

 

Please check Examples / TileView / TileViewReorder.cs.
This is an example of a script to reorder items in the described way.

• create a copy of the script
• replace TileView and item types with your types
• replace null with EmptyItem in ReorderItems method
• remove OriginalItems initialization from the Start method (OriginalItems = Utilities.CreateList(...)

Then you should use TileViewReorder.OriginalItems instead of TileView.DataSource to set items, add and remove items.

 

Please do, thanks

I have no knowldge of shaders, but i sort of know this should be achievable with wordspace etc as i saw some similar stuff with shadergraph's nodes
https://www.google.com/search?q=Shadergraph+shader+wordspace

 

An issue I have found is when you disable a header I expect when I re-enable, it will also enable the rows again. I think the below change is needed to allow this.

TableHeader.cs

 

Thank you, I'll add this fix in the next update.

 

I got the idea. With some further refinement I have been able to implement it in my project. Thank you. Do you consider natively supporting it in the future? In many situations it would be the better and more natural representation layout.

 

Probably yes, I am thinking about how better to do it.

 

I haven't been able to reproduce this for a bit, but I changed the margins to (0,0).
ListViewCustom<> is the base class
no warnings
Hopefully, the margin change and update combo fixes it, thanks

 

I found and fixed a bug in ListView with size calculation related to margin, it should work fine in 1.12.5b2

Added FlareGlobal shader at 1.12.5b2.

• you need to enable animated materials at the scene view in Unity 2020.x
• since shader works in global space (camera space), it can be displayed differently at the scene view and game view because of the different cameras

 

Thanks Ilih,
What if im using Screen Overlay and not Camera?

 

It will work.

 

Awesome

 

Hi @ilih,

Can you please provide a ripple effect shader (so it performs fast)

I currently emulated it with a image scaling, but thats not optimized and more button i have more those ripples take memory.

Thanks

 

I'll think about it.

 

I apologize for being a recurring pain in the ass.

A few months back you helped me get the onDoubleClick event working.
Recently, I have been seeing some strange behavior in our ListViews.that need double click.
Often some of the elements would let you double click them.

Given a Widget created ListView; I populate and ObservableCollection and assign it to the DataSource.
After this is complete I use listView.ForEachComponent to enumerate the ListViewItems and register the onDoubleClick event.

In almost all cases this works perfectly.
However, recently we have seen that in some cases the passed ListVIewItems do not seem to be constructed completely and often it does not pass all the elements in the DataSource.
For the example, today I would add 5 elements but ForEachComponent would only pass through 3 and one of them would have a null Item property.

After thinking about it a bit, I put the ForEachComponent call inside a StartCoroutine that calls yield WaitForSeconds(2) before calling ForEachComponent. This fixed things but I worry that it will not be reliable as the list grows or we compile to other platforms. It seems something on the ListView needs to finish initializing before I call ForEachComponent.

Is there another event I can hook for this or any way to synchronize with ForEachComponent being ready?
Possibly my assumptions are completely wrong about initialization.

Any help would be appreciated.

 

ForEachComponent is the wrong function to do this because of the virtualization, new instances can be created after ForEachComponent call, and they will not have registered events.

You need to override AddCallback and RemoveCallback methods to register events.

Code (CSharp):

1.         void ProcessDoubleClick(int index)
2.         {
3.             Debug.Log("double click: " + index);
4.         }
5.  
6.         protected override void AddCallback(ListViewItem item)
7.         {
8.             base.AddCallback(item);
9.             item.onDoubleClick.AddListener(ProcessDoubleClick);
10.         }
11.  
12.         protected overridevoid RemoveCallback(ListViewItem item)
13.         {
14.             if (item == null)
15.             {
16.                 return;
17.             }
18.             base.RemoveCallback(item);
19.             item.onDoubleClick.RemoveListener(ProcessDoubleClick);
20.         }

 

Thank you very.. very.. much.
I have a certain resistance to changing the generated widgets.
At some point some poor developer will regen the widgets... ouch.

However, this does work really well and using an event like this makes it look more like the OnSelect event.
Any chance we could get this added in the future to ListView?

Code (CSharp):

1.      
2.      
3.         public UnityEngine.Events.UnityEvent<int> onDoubleClick = new UnityEngine.Events.UnityEvent<int>();    
4.         protected virtual void OnDoubleClick(int index)
5.         {
6.             this.onDoubleClick.Invoke( index );          
7.         }
8.         protected override void AddCallback(UIWidgets.ListViewItem item)
9.         {
10.             base.AddCallback( item );
11.             item.onDoubleClick.AddListener( OnDoubleClick );
12.         }
13.         protected override void RemoveCallback(UIWidgets.ListViewItem item)
14.         {
15.             if (item == null)
16.             {
17.                 return;
18.             }
19.             base.RemoveCallback( item );
20.             item.onDoubleClick.RemoveListener( OnDoubleClick );
21.         }      
22.  

 

OK, I'll try to make those events available at ListView class, not only ListViewItem.

 

Any update?

 

Unfortunately not, I did not have free time to work on this in the last weeks.

 

@ilih, no issue take your time.


I have a question regarding CustomDialogs<> . When i show a dialog , i want to get list of all the buttons drawn on the alert.

How do i get that?

Thanks

 

You need to make a few changes at DialogCustom.cs:

• replace

  protected class ButtonInstance

  with

  public class ButtonInstance

• add to DialogCustom class
  
  Code (CSharp):

  1.         public ReadOnlyCollection<ButtonInstance> CurrentButtons
  2.         {
  3.             get
  4.             {
  5.                 return ButtonsActive.AsReadOnly();
  6.             }
  7.         }

Then you can use

CurrentButtons

to get a list of drawn buttons.

 

Anothyer question,
How do i get all the cached instances/templates of the alert?

 

If you ask about buttons then you can use ButtonsCached in the same way as ButtonsActive.

If you need dialog instances then you need to add the following code to Scripts/Templates.cs:

Code (CSharp):

1.         public List<T> CachedInstances(string name)
2.         {
3.             var result = new List<T>();
4.             Stack<T> cached;
5.             if (cache.TryGetValue(name, out cached))
6.             {
7.                 result.AddRange(cached);
8.             }
9.  
10.             return result;
11.         }

and get instances with:

var cache = DialogClassName.Templates.CachedInstances(DialogTemplate.TemplateName);

 

Thanks, appreciate that

 

Hi @ilih

Current behavour of Dialog is that when u "show" it , it creates a new template. So in memory there are 2 dialogs now, one original as template source, and a new template which appear.

So in cases where you are sure that only 1 alert will b visible, then performance wise its better if we can "reuse" the same template source as new template itself.

Thanks

 

Few points against it:

• In such cases, you can use a single gameobject with

  setActive(true/false)

  , Dialog is not needed
• Dialog template can be prefab, not just gameobject at the scene, so instantiation will be necessary anyway
• Problems with restoring the title, message, and icon to default values if they are overridden by Show() call.

 

Getting Cached Instances is throwing error, please advise that key is not found
please advise

Code (CSharp):

1.     public class ANUWDialog : DialogCustom<ANUWDialog>
2.     {
3.  
4.  
5.         public List<ANUWDialog> CachedInstances => Templates.CachedInstances(TemplateName);
6.        
7. }

 

This happens if Dialog.Clone() was not called earlier.
It can be fixed with

Templates.FindTemplates()

call before

CachedInstances()

.
Fix:

Code (CSharp):

1.         public List<ANUWDialog> CachedInstances
2.         {
3.             if (TemplateName == null)
4.             {
5.                 Templates.FindTemplates();
6.             }
7.             return Templates.CachedInstances(TemplateName);
8.         }

 

Hi Ilih,
Any update on making toast extend from dialog so we can have buttons in notifications.

 

Not finished yet.

 

Hi there,
I need an analogue of Unity Editor Tree view to use at runtime.
I need to create a custom tree view, where some nodes used as folders and others just items.
It should have the following features:
Drag'n'drop with support of multiple selection. (In example I can select many, but drag only a single item)
A click and double click on items processing.
Context menu with possibility to rename items and folders, create and delete folders and items
Autosave view on tree changes.
The data I'm using is not based on unity gameobjects and provides only it's name, path and type (folder or item).
So, what components of the asset should I use or look into to achieve all that things? Is there any things that will work out of the box?

 

Not available by default, but you can use generic Drag and Drop classes to add drag&drop for the custom types like List<Node<...>>.

Those events are available.

Not available.

It is possible to get events on changes if data type implements

INotifyPropertyChanged

, so you can subscribe to events to save data.

• I suppose this is a list, so you will need to write code to convert the list to a tree.
• Widget generation can create TreeView with custom data types
• Small changes will be needed for the created TreeViewComponent to display differently folder and item

 

My product management team wanted me to ask if there is any chance we could get support for Grouping in the ListViews. Windows Forms has this and it basically changes the sorting and puts line separators between the groups.
If this isn't possible could we get a line separator for the ListView? This would be a thin skinny line item that is not selectable. We have a selection panel with settings for many different things and they feel having separators in the ListView would really help.

Again, thank you for all the support.
.

 

Please check Examples / ListView / GroupedListView folder.

• ListView uses interface as data type and different classes for the group and item but it can be replaced with a single class with a flag property or similar thing
  
• ListView has

  GroupedData

  field of

  GroupedList<TItem>

  type to use instead of

  DataSource

• DefaultItem component is just a proxy to select different templates depending on the actual data type (one template for the item and another for the group, here you can add a line separator)

• ListView.CanSelect

  used to disable selection of the group

 

Thank you!!!

 

Hi @ilih,
In dialogs, i have rare case where i dont want to show any button (like "please restart app").
so i passed null for buttons, but it throws error.
Can you please add support if there are no buttons and so no result handler.

 

Cannot reproduce it.
Please show code to show dialog and error with a stack trace.

 

Added buttons support to notify in v1.12.5b4

Code (CSharp):

1.             var instance = NotificationTemplate.Clone();
2.             instance.Show("Notification with buttons. Hide after 3 seconds.", customHideDelay: 5f);
3.             instance.SetButtons(actions);
4.  

The Example at the "Examples / Notify" folder.

Added RippleEffect script. The current limit is 10 ripples per graphic component.
The example at the "Examples / Effect" folder.

Should work with the latest beta version.

 

I'm interested in using this for a TreeView, but I'm a non-coder currently. Is it easy to trigger an event, such as opening a UI window or panel, when the user selects a node on the list? Thanks.

 

The code is straightforward, but I do not know how it is easy for non-coder.
Here is an example:

Code (CSharp):

1. namespace UIWidgets.Examples
2. {
3.     using UnityEngine;
4.     using UIWidgets;
5.  
6.     [RequireComponent(typeof(TreeView))]
7.     public class TreeViewSelect : MonoBehaviour
8.     {
9.         TreeView TreeView;
10.  
11.         void Start()
12.         {
13.             TreeView = GetComponent<TreeView>();
14.             TreeView.NodeSelected.AddListener(ProcessSelect);
15.             TreeView.NodeDeselected.AddListener(ProcessDeselect);
16.         }
17.  
18.         void ProcessSelect(TreeNode<TreeViewItem> node)
19.         {
20.             Debug.Log("select: " + node.Item.Name);
21.  
22.             // here code to open window or panel
23.         }
24.  
25.         void ProcessDeselect(TreeNode<TreeViewItem> node)
26.         {
27.             Debug.Log("deselect: " + node.Item.Name);
28.  
29.             // here code to close window or panel if required
30.         }
31.  
32.         void OnDestroy()
33.         {
34.             if (TreeView != null)
35.             {
36.                 TreeView.NodeSelected.RemoveListener(ProcessSelect);
37.                 TreeView.NodeDeselected.RemoveListener(ProcessDeselect);
38.             }
39.         }
40.     }
41. }

 

Thank you, ilih. Eventually, I plan to put something together so that I can use New UI Widgets to fire a Playmaker FSM. But I want to understand the code better as well, so this will be a big help in my learning process. Appreciated!

 

Thank you very much for another great release

 

Hi @ilih,
Indeterminate Progressbar doesnt start smooth, its jumps
Can you please look into that

This is noticeable if you start stop, start stop

 

Can you please add from alpha and to alpha as well?
So it starts from 0.5 alpha and end at 0 alpha

 

Fixed in v1.12.5b6

Added EndColor instead of the alpha (you can copy original color and change alpha), and Color renamed to the StartColor.