New UI Widgets

hi!

Scroll start and Scroll end Events are in "TileView" and "ListView"
but it should also in "ListViewItem"

 

You can use ListView.ForEachComponent and TileView.ForEachComponent to do something with items on scroll start and scroll end events.
Here is sample how it can be done:

Code (CSharp):

1. using UnityEngine;
2. using UIWidgets;
3.  
4. public class ListViewIconsScrollHelper : MonoBehaviour {
5.     [SerializeField]
6.     public ListViewIcons listView;
7.  
8.     void Start()
9.     {
10.         if (listView!=null)
11.         {
12.             listView.OnStartScrolling.AddListener(OnStartScrolling);
13.             listView.OnEndScrolling.AddListener(OnEndScrolling);
14.         }
15.     }
16.  
17.     void OnStartScrolling()
18.     {
19.         listView.ForEachComponent(ComponentStartScrolling);
20.     }
21.  
22.     void OnEndScrolling()
23.     {
24.         listView.ForEachComponent(ComponentEndScrolling);
25.     }
26.  
27.     void ComponentStartScrolling(ListViewItem item)
28.     {
29.         if (item.gameObject.activeSelf)
30.         {
31.             (item as ListViewIconsItemComponent).DoSomethingOnStartScrolling();
32.         }
33.     }
34.  
35.     void ComponentEndScrolling(ListViewItem item)
36.     {
37.         if (item.gameObject.activeSelf)
38.         {
39.             (item as ListViewIconsItemComponent).DoSomethingOnEndScrolling();
40.         }
41.     }
42.  
43.     void OnDestroy()
44.     {
45.         if (listView!=null)
46.         {
47.             listView.OnStartScrolling.RemoveListener(OnStartScrolling);
48.             listView.OnEndScrolling.RemoveListener(OnEndScrolling);
49.         }
50.     }
51. }
52.  

 

Great looking project. Do you know how well this works on mobile?
Cheers

 

Here is demo UIWidgets-1.6.1.apk for Android 4.4 or later. "Development Build" enabled, so you can use profiler to check performance.

 

I'm on IOS, would it be possible to get a demo package for IOS?

 

Also, is drag and drop from one component to another supported. For example, dragging an item from a tree to a scrollist?

 

I don't have any Mac and iOS devices, I can provide only Xcode project to build.

No. For now drag and drop not supported at all.

 

Version 1.6.0 released.

Changelog:

• ColorPicker
• For ListView, ListViewIcons, ListViewCustom, ListViewCustomHeight, TileView added support for ObservableList
  Items property marked obsolete, but can be used.
• Added optional sequence parametres for Notify - notifications can be showed one by one, not only all at once like now.
• For ListViewIcons items and TreeView nodes added field LocalizedName, so now can be easily added localization support.
• EasyLayout - Control Width, Max Width, Control Height, Max Height replaced with "Children Width" and "Children Height" with options:
  Do Nothing
  Set Preferred - Set width/height to preferred, like Control Width/Height
  Set Max from Preferred - Set width/height to maximum preferred width/height of items, like Max Width/Height
  Fit Container - similar to "Child Force Expand" from Horizontal/Vertical Layout Group
• ListViewCustomHeight - implimentation of IListViewItemHeight for components now optional, but you still can implement it for optimization purpose.

 

Hello Ilih

nice update, especially new example for list view possibilties are very impressive !!

I have small issues with Combobox :
- When you call Combobox.Clear() with an element selected it crashed ?!
- There is no Input Cursor any more ??

I have small issues with SpinnerFloat :
- There is no Input Cursor any more ??
- Entering negative vales is very difficult (also in old versions...)

Thanks and have a nice Weekend

Christoph

 

Fix:
Replace lines 562-564 in ListView/ListViewBase.cs:
Old lines:

Code (CSharp):

1.             DeselectItem(index);
2.            
3.             OnDeselect.Invoke(index, GetItem(index));

New lines:

Code (CSharp):

1.             if (IsValid(index))
2.             {
3.                 DeselectItem(index);
4.  
5.                 OnDeselect.Invoke(index, GetItem(index));
6.             }

It is about Mouse Cursor or Input Caret?
Combobox and Spinner use standart Unity InputField.
Probably you meet this bug, found in 5.2.0f3 and was fixed in 5.2.1.

I'll think about solution, possibly will be added option to move validation from key press event to end input event.

 

Again me,
above Reply is difficult to read...

Combobox is working, bug is found after update, waiting for negative values

Thanks

 

I understand that Drag and Drop is not yet supported at this time since there are so many cool things already in the package. Can I make a request to have this feature added to the a future version. Having Drag and Drop will make this asset that much more powerful and awesome.

Cheers.

 

I have plans to add Drag and Drop support.

 

Hi @ilih,
Awesome controls you've made! Exactly what we have been looking for.

I did some tests with the TreeView control, and it seems to have some odd scrolling bug, if you scroll up/down fast using the mouse scroll.
I recorded a short video to demonstrate. Any ideas how to fix this?
https://bodekaer.tinytake.com/sf/MzY2MDAzXzIwODYxNzk

 

I can btw. replicate the same bug when scrolling up/down fast in the demo example included in the asset bundle.

 

For some reason optimization don't work as I expect, so here is original code without optimization.
Replaced to correctly optimized version.

Replace lines 1009-1019 in ListView/ListViewCustom.cs:
Old lines:

Code (CSharp):

1.                 var indicies = Enumerable.Range(topHiddenItems, visibleItems).ToArray();
2.                 components.ForEach((x, i) => {
3.                     if (indicies.Contains(x.Index))
4.                     {
5.                         return ;
6.                     }
7.                     x.Index = indicies[i];
8.                     SetData(x, DataSource[indicies[i]]);
9.                     Coloring(x as ListViewItem);
10.                 });
11.                 components.OrderBy(x => x.Index).ForEach(x => x.transform.SetAsLastSibling());

New lines:

Code (CSharp):

1.                 var old_indicies = Enumerable.Range(oldTopHiddenItems, visibleItems).ToArray();
2.                 var new_indicies = Enumerable.Range(topHiddenItems, visibleItems).ToArray();
3.  
4.                 var update_indicies = new_indicies.Except(old_indicies).ToArray();
5.                 var remove_indicies = old_indicies.Except(new_indicies).ToArray();
6.  
7.                 components.Where(x => remove_indicies.Contains(x.Index)).ForEach((x, i) => {
8.                     x.Index = update_indicies[i];
9.                     SetData(x, DataSource[update_indicies[i]]);
10.                     Coloring(x as ListViewItem);
11.                 });
12.  
13.                 components = components.OrderBy(x => x.Index).ToList();
14.                 components.ForEach(x => x.transform.SetAsLastSibling());

 

@ilih
I have a request. Could you please include the asset's version number in the README?

This would be handy because I use you assets in several projects. As you update your asset I don't know what version each project has. I want to be able to check and see if I need to update your asset in any particular project.

Thanks

P.S. I also have submitted some feedback on this issue. Users, please upvote if you agree.

 

Yes. I will include version number with changelog in README in future updates.
For now you can get version number from "UIWidgets SampleScene" in top right corner.

 

In 1.6.0 you have a folder StandartAssets. Is that a typo? Should it be StandardAssets?

 

Typo.

 

@ilih,
Any plans for optimising List Performance?
I'm working on a social app more like whats app with variable size items and images in it, however not happy with performance, Can you please make your next update (1.7) a peformance only update on List for mobile devices?
Thanks

 

From my tests problem with performance not related with ListView.
Following things will increase performance:

• Disable Canvas.PixelPerfect - it can increase performance in few times.
• Instead Mask gameobject with ScrollRect and Mask components (like in old versions) into two separate gameobjects - ScrollView and Viewport. Viewport should use RectMask2D instead Mask.
  
  
  
• Disable ScrollRect.Inertia

 

Is there a demo that demonstrates resizing of the the components?

 

No.

 

I'm just going to repeat myself: This is amazing @ilih

I have a small feature wish: An EasyLayout Grid Splitter, allowing the user to resize the panels by clicking and dragging the Grid Splitter. (like this: http://www.wpf-tutorial.com/panels/gridsplitter/)

 

Maybe will be added in next version.

 

@ilih
I made above changes and list got huge performance, thanks for the valuable tips.
Is there any possibility we can get the same performance without disabling inertia?

For next update, please provide a Side Menu/Drawer Component that slides in/overlay etc
Thanks

 

@ilih is there any specific reason for using a custom IObservable, and not the INotifyPropertyChanged?
We use the INotifyPropertyChanged in all our controllers, so it would make a lot simpler if UIWidgets also used that default interface:
https://msdn.microsoft.com/en-us/library/system.componentmodel.inotifypropertychanged(v=vs.110).aspx

 

ListView's should work fine with Inertia enabled.
Inertia cause problem only with TileView, that will fixed in next release.

 

No specific reason, I did not know about default interface for this.
I send you link in PM to updated ObservableList with INotifyPropertyChanged support, it will be included in next version.
INotifyPropertyChanged support for TreeNode and TreeViewItem will be added in next version.

 

hi!
i like this new feature of EasyLayout (set Maxfrom preferred)
but how it work ..?

is there any way to tell every child of easylayout that
it is your max height..?

 

Get preferred heights of each child, find maximum height from it, and apply RectTransform.SetSizeWithCurrentAnchors(Axis.Vertical, max_height) for each child.

 

is it possible to have more then one Default item in list view and tile view...?
later we will chose desired Default item depends upon data..

 

It cannot be done directly, but it is possible with one of following ways.

• Defaultltem contains inactive items for each data type. On SetData call it deactivate all items and make one of items active depends of data.
  It is simple way, but not very optimized.
  Pseudocode:
  
  Code (CSharp):

  1. public void SetData(DataType data)
  2.         {
  3.             var required_type = DetectType(data);
  4.             if (current_type!=required_type)
  5.             {
  6.                 if (current_item!=null)
  7.                 {
  8.                     current_item.gameObject.SetActive(false);
  9.                 }
  10.                 current_item = Items[required_type];
  11.                 current_item.gameObject.SetActive(true);
  12.             }
  13.             current_item.SetData(data);
  14.         }
• Defaultltem contains links to prefabs for each data type.
  On SetData detect which prefab should be used, instantiate it or take from cache or used current item and move previously used item to cache if needed.
  Not so simple, but optimized.
  Pseudocode:
  
  Code (CSharp):

  1.         public void SetData(DataType data)
  2.         {
  3.             var required_type = DetectType(data);
  4.             if (current_type==required_type)
  5.             {
  6.                 current_item.SetData(data);
  7.             }
  8.             else
  9.             {
  10.                 MoveToCache(current_type, current_item);
  11.                 current_item = GetFromCache(required_type);
  12.                 if (current_item==null)
  13.                 {
  14.                     current_item = Instantiate(prefabs[required_type]);
  15.                     current_item.transform.SetParent(this);
  16.                 }
  17.                 current_item.gameObject.SetActive(true);
  18.                 current_item.SetData(data);
  19.             }
  20.         }

 

0k thanx

 

@ilih wouldn't it be better to have a check for property changes in e.g. the Spinner.Value setter?
I'd like the spinner to only raise the "Changed" event, if the value actually changed.
E.g. I would propose this:

Code (CSharp):

1. set {
2.   if (_value != value)
3.   {
4.       _value = InBounds(value);
5.       text = _value.ToString();
6.       onValueChangeInt.Invoke(Value);
7.   }
8. }
9.  

 

Good, will be added in next update.

 

Hi,
Your asset rocks !!
But I have some problems with TileView.
I'm using your TileViewSample class and I get an error when I use clear, only when the tileview is filled with enough
items and scrollbar are required.
I get the following error :
ArgumentOutOfRangeException: Argument is out of range.
Parameter name: index
And it's pointing the ScrollRect Object.

If I do the following : it works but if I scroll down item, same bug
tileViewSample.ScrollRect.enabled = false;
tileViewSample.Clear ();
tileViewSample.ScrollRect.enabled = true;

I find one solution :

1. public void TestClear()
2. {
3. tileViewSample.ScrollRect.verticalNormalizedPosition = 1;
4. tileViewSample.ScrollRect.enabled = false;
5. tileViewSample.Clear ();
6. }
7. 
   
8. public void LoadNewData()
9. {
10. // Add items
11. ....... tileViewSample.Add(newItem);
12. // Then
13. tileViewTexture.ScrollRect.enabled = true;
14. }

So, it seams the problem comes from ScrollRect,

 

Fix:
Replace lines 96-99 in TileView.cs

Code (CSharp):

1.             if (topHiddenItems > (DataSource.Count - 1))
2.             {
3.                 topHiddenItems = Mathf.Max(0, DataSource.Count - 2);
4.             }
5.             if (DataSource.Count==0)
6.             {
7.                 SetScrollValue(0f);
8.             }

 

Ok it works, the only problem is : if we load a lot a items, then scroll down and then Clear and had fews item, the scroll stay down.
It would be better if the scroller go to Top after a clear.
Calling tileViewSample.ScrollRect.verticalNormalizedPosition = 1; before the clear do the job
But all other component automatically do it after a clear

 

Replace Clear() method in ListViewCustom.cs

Code (CSharp):

1.         public override void Clear()
2.         {
3.             DataSource.Clear();
4.             SetScrollValue(0f);
5.         }

 

Thanks, it works great !

 

Hi there,
Can you please provide Pull Down To Refresh
http://taishimizu.com/pictures/fitt...terstorm-cropping/tweetie-pull-to-refresh.png

and Pull Up to Load More
http://www.codeproject.com/KB/windows-phone-7/445361/pullToRefresh.jpg

In next List/TileList update?
Thanks

 

I'll try add events for this.

 

Thanks, appreciate a lot
UIWidgets is becoming great day by day, keep up the great work

 

@ilih
Is it now possible to get this layout where 2 items are fixed while one item take all the reamining width?
http://forum.unity3d.com/threads/new-ui-widgets.297353/page-5#post-2348431

If so, can you please describe how?

 

EasyLayout.Children Width = Fit Containter
Add LayoutElement component to all items.
For two items with fixed width specify Layout Element.Min Width
For item (which take all remaning width) specify Layout Element.Flexible Width = 9999 (or any other big number)

 

Thanks Once Again

 

Hi, I find another problem with Tileview :

I have the the problem a similar problem to the first I had with the Clear Function.
If I fill the tileview with enough items, then scroll down the scrollbar and then call myTileView.Remove(item.Index);
I get the following error :
ArgumentOutOfRangeException: Argument is out of range.
Parameter name: index

Thanks