New UI Widgets

Try to remove the line "UpdateLayout();" at the end of OnInspectorGUI() method in EasyLayoutEditor.cs.

 

That didn't help.

I just tested the simple EasyLayout demo scene you gave (the one with 14 buttons in a panel) - that makes 2.1KB of garbage per frame.

 

Then made a backup and try to update to v1.9.3, this version does not have such problem with garbage produced every frame.
Or you can add a breakpoint at RepositionUIElements() calls and try to find out why it called every frame, maybe one of child gameobject RectTransform values is changed every frame and it causes layout rebuild every frame.

 

yes, that fixed it. Thanks!

 

Again on ListView, I noticed that if I disable the list, via the interactable check on the Selectable script or on a top CanvasGroup, it still allows to change the selection item

 

I'll add the Interactable option for ListView and Canvas Group support in next beta.

 

TreeView not correctly displays the nested elements, with automatic closing of inactive threads of the first stage of disclosure items.

Code (CSharp):

1.  
2. public class SidebarTreeItemNode : TreeNode<SidebarTreeItem>
3. {
4.         internal void Click(bool isSelected)
5.         {
6.                 // Закрыть другие группы меню
7.                
8.                 // .. корневой итем текущего итема
9.                 TreeNode<SidebarTreeItem> thisRoot = this; // != this.RootNode
10.                 while (thisRoot.Parent != null && thisRoot.Parent.Item != null
11.                     )
12.                     thisRoot = thisRoot.Parent;
13.  
14.                 // .. проверка всех раскрытых итемов
15.                 foreach (TreeNode<SidebarTreeItem> item in treeView.Nodes.Where(i => i.IsExpanded))
16.                 {
17.                     if (item == thisRoot)
18.                         continue;
19.  
20.                     item.IsExpanded = false;
21.                 }
22.  
23.                 // Раскрыть пункт с вложенными пунктами
24.                 if (isSelected &&
25.                     Nodes != null && Nodes.Count > 0 &&
26.                     IsExpanded == false
27.                     )
28.                     IsExpanded = true;
29.     }
30. }
31.  
32. public class SidebarTreeView : TreeViewCustom<SidebarTreeItemComponent, SidebarTreeItem>
33. {
34.         private void NodeItemDeselected(TreeNode<SidebarTreeItem> node)
35.         {
36.             ((SidebarTreeItemNode)node).Click(false);
37.         }
38.         private void NodeItemSelected(TreeNode<SidebarTreeItem> node)
39.         {
40.             ((SidebarTreeItemNode)node).Click(true);
41.         }
42. }
43.  

TreeItem with data:
1.0
1.1
1.2
2.0
2.1
2.2
2.3
3.0

On the start looks like
1.0
2.0
3.0

On the first disclosure of 1.0 looks like
1.0
1.1
1.2
2.0
3.0

On the first disclosure of 2.0 looks like
1.0
2.0
2.1
3.0
2.2
2.3

On the next disclosure all ok.

 

Fix:
ListViewCustom.cs, replace code in UpdateView() function:
old code:

Code (CSharp):

1.             components.ForEach((x, i) => {
2.                 x.Index = indices[i];
3.                 SetData(x, DataSource[indices[i]]);
4.                 UpdateComponentLayout(x);
5.                 Coloring(x as ListViewItem);
6.             });

new node:

Code (CSharp):

1.             components.ForEach((x, i) => {
2.                 x.Index = indices[i];
3.                 SetData(x, DataSource[indices[i]]);
4.                 UpdateComponentLayout(x);
5.                 Coloring(x as ListViewItem);
6.                 x.transform.SetAsLastSibling();
7.             });

Also you can add "treeView.Nodes.BeginUpdate();" and "treeView.Nodes.EndUpdate();" to increase performance.

Code (CSharp):

1.   internal void Click(bool isSelected)
2.         {
3.                 treeView.Nodes.BeginUpdate();
4.  
5.                 // Закрыть другие группы меню
6.                 // ...
7.                 // Раскрыть пункт с вложенными пунктами
8.                 // ...
9.  
10.                 treeView.Nodes.EndUpdate();
11.     }

 

Now is ok. Thanks!

 

Looped list support and Interactable option for ListView added in 1.10.0b7

 

Thanx

 

Can drag/drop functionality be adjusted so that you only drag a copy of the selected item but the original stays inside the list? Maybe as a greyed-out placeholder entry until the copy gets dropped back onto the list?

 

You need to disable "Delete After Drop" in Drag Support component (available from version 1.9.2 and later)

 

Nice and easy, I like that. Thanks for your quick reply.

 

Hello !!

Is there any control like Time picker ? if not then it would be great to have control like below

Thanx.

 

I'll try to add it in next beta.

 

I would be great to have min time and max time.

Thanx

 

I can use customcombobox with textmehs pro ?

 

Ok.

Yes, ComboboxCustom does not use any Text components directly, it works with ListView, so your ListView should use TextMesh Pro.

 

Hello !!

What is current in Combobox custom ?
how its used and does its different then list default item.
how its data will be set ?

 

It's used to display selected item.

It uses the same component as ListView.DefaultItem, but "Current" should be different gameobject (you can just duplicate ListView.DefaultItem and change its position in the hierarchy to make it visible).

Data will be set automatically if the component implements IViewData<TItem>; otherwise, you should override SetData() function.

 

Thanx

 

please add support for listView intractability.

If listview is intractable then items should be selectable and vise versa.

Thanx

 

Interactable is already available in 1.10.0.b7
First option:

 

I just purchased this last night and haven't had a chance to really dive into it. But I really love it by the way.
I wasn't sure exactly how to implement sidebar for a search bar to drop down so I used an animation instead. Maybe that's exactly what it is. Anyways, how would I implement a scroll feature on the accordions? Not necessarily a scroll bar, but just the drag it up and down functionality.

Also, do you have plans for a radial slider/progress bar?

 

You should use Scroll View in this case.

• Create Scroll View
• Create Accordion
• Add Content Size Fitter to Scroll View with Vertical Fit = Preferred Size
• Change Accordion RectTransfrom settings: pivot to 0, 1 and anchors to top stretch
• Replace Content with Accordion in the hierarchy and ScrollView.Content option

Not for now.
The radial progress bar can be relatively easy replaced with Image with Image Type = Filled and Fill Method = Radial 360.

 

Thanks for the quick reply. I'll give it a try tonight.

 

Hello!!
I see that you are working on Data binding, its great and I am really excited about it.
please describe how we could use it.

 

It's not separate data binding solution, just package that allows using New UI Widgets with Data Bind for Unity
For own ListView / TileView / TreeView you can add support using "Add Data Bind support" from the context menu.

 

0k Thanx

 

Easy layout is setting preferred width when textmesh pro is set to overflow = truncated or Ellipsis



Text=>

item=>

container =>

 

PreferredWidth option set gameobject width to his LayoutProperties.PreferredWidth, you can see LayoutProperties values on the screenshot at bottom right corner.
For Text components by default LayoutProperties.PreferredWidth is the width required to fit the text in one line.
TextMesh Pro overflow option used in cases when gameobject size not enough to fit the text.

The screenshot shows such situation: panel (yellow) with EasyLayout with the enabled preferred width option so the text has the width more than the panel width and even the screen width. Text himself does not have overflow because his width is equal his PreferredWidth and will be truncated during rendering only because does not fit on the screen.

So you should use "Fit Container" option (Text width will be equal to Item width - layout margin) or "Shrink on Overflow" option (Text width will be minimal between Text.PreferredWidth and Item width - layout margin)

 

Hello!

We can get Date from DatePicker, but what about time? i need an extended DatePicker where i can also get time (as hours, minutes, am/pm)

 

I'll try to add DateTimePicker and Time widgets in next updates.

 

im also looking for same component.

 

I am new to unity. How do I read the value (text) in C# for the text entered by the user of the autocomplete ui element (new ui widgets). I don't see any properties for that!

 

You can get user text using InputField.text or use OnOptionSelected (or OnOptionSelectedItem) event to get selected text, like this:

Code (CSharp):

1.  
2. using UnityEngine;
3. using UnityEngine.UI;
4. using UIWidgets;
5.  
6. namespace UIWidgetsSamples
7. {
8.     public class AutocompleteTest : MonoBehaviour
9.     {
10.         // just get text
11.         [SerializeField]
12.         public InputField AutocompleteInputField;
13.  
14.         public void GetText()
15.         {
16.             var text = AutocompleteInputField.text;
17.             //do something with text
18.         }
19.  
20.         // or get text only after user selected value
21.         [SerializeField]
22.         public Autocomplete Autocomplete;
23.  
24.         void Start()
25.         {
26.             // OptionSelected will be called when user selected value
27.             Autocomplete.OnOptionSelected.AddListener(OptionSelected);
28.         }
29.  
30.         void OptionSelected(string text)
31.         {
32.             //do something with text
33.         }
34.  
35.         void OnDestroy()
36.         {
37.             Autocomplete.OnOptionSelected.RemoveListener(OptionSelected);
38.         }
39.     }
40. }
41.  

 

ilih, thank you for your quick answer, it helped me now it works. I first had AutoComplete as a variable, I see now I have to use just InputField.
I just started with your components. I love the way they appear, thanks and congrats!

 

I am trying to find an example of how to implement and get started with the listview. At least I hope there are some examples to find, can you please point me to it. The documentation I found is about 'creating your own listview', but I don't see any help in that for the moment.

 

If you want to know how to use ListView then you should check this Using ListViewIcons (it's applied to others ListView's with one exception: ListViewIconsItemDescription should be replaced with appropriate class).

If you have more specific questions, please feel free to ask.

 

ilih, You had it already there. I totally missed that one, sorry for that! Have a nice day!

 

Hello!!

On play Tree view is disabling scroll Horizontal direction ?
even it does not enable Horizontal scroll automatically when item is overflowing List.

in edit mode



in playmode


List

 

Fix: add the following function to Standart Assets\TreeView\TreeViewCustom.cs

Code (CSharp):

1.         protected override void SetDirection(ListViewDirection newDirection, bool isInited = true)
2.         {
3.             direction = newDirection;
4.  
5.             (Container as RectTransform).anchoredPosition = Vector2.zero;
6.             if (CanOptimize() && (layout is EasyLayout.EasyLayout))
7.             {
8.                 LayoutBridge.IsHorizontal = IsHorizontal();
9.  
10.                 if (isInited)
11.                 {
12.                     CalculateMaxVisibleItems();
13.                 }
14.             }
15.             if (isInited)
16.             {
17.                 UpdateView();
18.             }
19.         }

 

Hello!!

I m having difficulty while making support for Drag and Drop in tree view.
I did not understand purpose of TListViewComponent.

 

It's used to display draggable item.

TreeViewCustomNodeDragSupport have DragInfo field with type TListViewComponent.
If DragInfo specified it will be used to display draggable item.
It is a semi-transparent block on the screenshot (cursor was not captured)

 

How i can cancel drop grammatically .. ?

 

Not really understand what you need.
If you want to specify when items can be dropped and when not, you can do it with CanReceiveDrop() method in the drop component:

Code (CSharp):

1.         public bool CanReceiveDrop(TreeNode<TreeViewItem> data, PointerEventData eventData)
2.         {
3.             return data.Nodes==null || data.Nodes.Count==0;//can be dropped only node without subnodes
4.             //return data.Item.Name=="can be dropped";//or may be only node with specified name
5.         }

Or if you want to make some items draggable and some not you can override CanDrag in drag component:

Code (CSharp):

1.         public override bool CanDrag(PointerEventData eventData)
2.         {
3.             return Data.Item.Name=="can be dragged";
4.         }

 

How to cancel drag programmatically

means i m dragging an item with mouse , and i recognize that item is wrong ..
normally I press "esc" key form keyboard.
but now over here how I can do it ?

 

You need to make some changes in DragSupport.cs:

• Add ICancelHandler to class definition:
  

  abstract public class DragSupport<T> : BaseDragSupport, IBeginDragHandler, IEndDragHandler, IDragHandler, ICancelHandler

• Add ICancelHandler.OnCancel implementation:
  
  Code (CSharp):

  1.         public void OnCancel(BaseEventData eventData)
  2.         {
  3.             if (!IsDragged)
  4.             {
  5.                 return ;
  6.             }
  7.  
  8.             if (currentTarget!=null)
  9.             {
  10.                 currentTarget.DropCanceled(Data, null);
  11.             }
  12.  
  13.             Dropped(false);
  14.  
  15.             IsDragged = false;
  16.             Cursor.SetCursor(DefaultCursorTexture, DefaultCursorHotSpot, Utilites.GetCursorMode());
  17.         }
• And replace OnBeginDrag:
  
  Code (CSharp):

  1.         public virtual void OnBeginDrag(PointerEventData eventData)
  2.         {
  3.             if (CanDrag(eventData))
  4.             {
  5.                 EventSystem.current.SetSelectedGameObject(gameObject);
  6.                 IsDragged = true;
  7.                 InitDrag(eventData);
  8.             }
  9.         }

 

Thanx