Search Unity

  1. Good news ✨ We have more Unite Now videos available for you to watch on-demand! Come check them out and ask our experts any questions!
    Dismiss Notice

New UI Widgets

Discussion in 'Assets and Asset Store' started by ilih, Feb 11, 2015.

  1. snake1029

    snake1029

    Joined:
    Dec 16, 2015
    Posts:
    6
    hi ililh thanks for the code , but i use this code on listview, it thorw errors

    IndexOutOfRangeException: Index must be between 0 and Items.Count (-1). Gameobject ListView.
    UIWidgets.ListViewBase.Select (Int32 index) (at Assets/UIWidgets/Standart Assets/ListView/ListViewBase.cs:511)
    UIWidgets.Extensions.ForEach[Int32] (IEnumerable`1 enumerable, System.Action`1 handler) (at Assets/UIWidgets/Standart Assets/Utilites/Extensions.cs:36)
    UIWidgets.ListViewBase.set_SelectedIndicies (System.Collections.Generic.List`1 value) (at Assets/UIWidgets/Standart Assets/ListView/ListViewBase.cs:111)
    UIWidgetsSamples.ListViewSaveIndicies.LoadIndicies () (at Assets/Script/ListViewSaveIndicies.cs:30)
    UIWidgetsSamples.ListViewSaveIndicies.Start () (at Assets/Script/ListViewSaveIndicies.cs:19)
     
  2. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    I suppose you add items in list after ListViewSaveIndicies.Start() call, so you have few options to fix it:
    • If you load data in Start() without corutines you can change script executon order - "Edit / Project Settings / Script Execution Order", add ListViewSaveIndicies after default time
    • Or you can combine script which set items and ListViewSaveIndicies into one.
      Something like that:
      Code (CSharp):
      1.         void Start()
      2.         {
      3.             // first set items
      4.             list = GetComponent<ListViewIcons>();
      5.             list.Start();
      6.  
      7.             list.DataSource = items;
      8.  
      9.             // then load indicies and add save indicies callback
      10.             LoadIndicies();
      11.  
      12.             list.OnSelect.AddListener(SaveIndicies);
      13.             list.OnDeselect.AddListener(SaveIndicies);
      14.         }
    • Or add ListViewSaveIndicies from script after you set items, not in Inspector window
      Code (CSharp):
      1.         void Start()
      2.         {
      3.             // script to set items
      4.             list = GetComponent<ListViewIcons>();
      5.             list.Start();
      6.  
      7.             list.DataSource = items;
      8.  
      9.             var saveIndicies = gameObject.AddComponent<ListViewSaveIndicies>();
      10.             saveIndicies.Key = "some key";
      11.         }

    Code (CSharp):
    1. using UnityEngine;
    2. using UIWidgets;
    3. using System.Collections.Generic;
    4. using System.Linq;
    5.  
    6. namespace UIWidgetsSamples {
    7.     [RequireComponent(typeof(ListViewBase))]
    8.     public class ListViewSaveIndicies : MonoBehaviour {
    9.         [SerializeField]
    10.         public string Key = "Unique Key";
    11.  
    12.         [SerializeField]
    13.         ListViewBase list;
    14.  
    15.         void Start()
    16.         {
    17.             list = GetComponent<ListViewBase>();
    18.             list.Start();
    19.  
    20.             LoadIndicies();
    21.  
    22.             list.OnSelect.AddListener(SaveIndicies);
    23.             list.OnDeselect.AddListener(SaveIndicies);
    24.         }
    25.  
    26.         void LoadIndicies()
    27.         {
    28.             if (PlayerPrefs.HasKey(Key))
    29.             {
    30.                 var indicies = String2Indicies(PlayerPrefs.GetString(Key));
    31.                 indicies.RemoveAll(x => !list.IsValid(x));
    32.                 list.SelectedIndicies = indicies;
    33.             }
    34.         }
    35.  
    36.         void SaveIndicies(int index, ListViewItem component)
    37.         {
    38.             PlayerPrefs.SetString(Key, Indicies2String(list.SelectedIndicies));
    39.         }
    40.  
    41.         List<int> String2Indicies(string str)
    42.         {
    43.             if (str=="")
    44.             {
    45.                 return new List<int>();
    46.             }
    47.             return str.Split(',').Select(x => int.Parse(x)).ToList();
    48.         }
    49.  
    50.         string Indicies2String(List<int> indicies)
    51.         {
    52.             if ((indicies==null) || (indicies.Count==0))
    53.             {
    54.                 return "";
    55.             }
    56.             return string.Join(",", indicies.Select(x => x.ToString()).ToArray());
    57.         }
    58.     }
    59. }
     
  3. snake1029

    snake1029

    Joined:
    Dec 16, 2015
    Posts:
    6
    hi ililh thanks ! problem solved !
     
  4. Jinxology

    Jinxology

    Joined:
    Jul 13, 2013
    Posts:
    76
    Is it possible to use this asset with Unityscript?
     
  5. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    Yes, but you need to move UIWidgets folder to "Standard Assets" or Plugins folder.
    And specify "import UIWidgets;" in scripts.
     
  6. Eidoboy

    Eidoboy

    Joined:
    Jul 3, 2012
    Posts:
    27
    Hi, thanks for this amazing widget collection.
    It will be nice to also have a tab menu which uses icons instead of texts
     
    Last edited: Dec 22, 2015
  7. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    I have plans for this.
     
  8. alizdesk

    alizdesk

    Joined:
    Mar 26, 2015
    Posts:
    46
    @ilih
    Any plans for AutoComplete and Switch Component? Happy Christmas
     
  9. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    May be, not sure for now.

    What is this?
     
  10. alizdesk

    alizdesk

    Joined:
    Mar 26, 2015
    Posts:
    46
  11. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
  12. alizdesk

    alizdesk

    Joined:
    Mar 26, 2015
    Posts:
    46
    I actually need animation, Thanks
     
  13. Magic73

    Magic73

    Joined:
    Jun 23, 2015
    Posts:
    97
    Three days ago, I was going to buy it at 20$. Today I opened the asset store, and I found it at 40$. Any chance to get it at 20$? (or I have to wait for the next discount... :( if any.. )
     
  14. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    Only wait for next discount. Sorry.
     
  15. earthcrosser

    earthcrosser

    Joined:
    Oct 13, 2010
    Posts:
    113
    Hi, using your asset love it.
    My question is general. I replaced my Scroll view with a ListViewGameObjects. It was pretty easy to do but my question is, is there a performance advantage? Is there some kind of infinite scroll logic going on?

    Before I just had a scroll view and I instantiated objects and added them to the content of the scroll view with a rectTransform.setParent. Looking at my game hierarchy it seems like the ListViewGameObject is essentially doing the same thing when I add objects to it.
     
  16. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    No.
    ListViewGameObjects was added in first versions and it don't have any perfomance advantage.
    Later was added ListViewCustom for creating own ListView's - it's easy to use and have optimized perfomance (GameObjects created only for visible items).
    You can check how to create own ListView in documentation and with Sample Assets: folders ListView, ToDoList, Table, Shops and sample scene (TileView also can be helpful - it's have only visual difference with ListViewCustom). If you will have problem with creating own ListView I be glad to help.

    For now ListView's does not support infinite scroll.
     
    Last edited: Jan 4, 2016
    earthcrosser likes this.
  17. earthcrosser

    earthcrosser

    Joined:
    Oct 13, 2010
    Posts:
    113
    Thanks! I will try it out :)
     
  18. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    Version 1.7.4 released

    Changelog:
    • v.1.7.4:
      • Added Switch
      • Resizable: added KeepAspectRatio property
      • Tabs: added SelectedTab property
      • Tabs: added OnTabSelect event
      • Known problems: Accordion with EasyLayout and Canvas.PixelPerfect enabled in Unity 5.3 cause error "Trying to add (Layout Rebuilder for) {ObjectName} (UnityEngine.RectTransform) for layout rebuild while we are already inside a layout rebuild loop. This is not supported." in some cases. Workaround - use Vertical or Horizontal Layout Group instead EasyLayout.
    • v.1.7.2:
      • Fixed errors in WinStore builds
      • IDropSupport: added DropCanceled method
      • DragSupport: added DragPoint property (empty gameobject on cursor/touch position), you can use it to attach custom gameobject with information about draggable object
      • ListViewIconsDragSupport, TreeViewNodeDragSupport: show information about draggable object
      • Tabs: added Tabs with icons
     
  19. fritzpoll

    fritzpoll

    Joined:
    Apr 2, 2014
    Posts:
    3
    I have bought this and am a little frustrated, because I can't seem to get the assets to do anything different to their sample state.

    I Click UI->ListViewIcons, and all I am trying to do to start with is get the scroll to work horizontally (not vertically as default). Setting the property to "Horizontal" on the ListViewIcons, doesn't work, nor attempting to subsequently set all the child objects up correctly (like the scrollbar and the scrollrect)

    I am sure this is something I am doing wrong, but there are no instructions that I can find with this asset pack to tell me how to actually use it. Have I missed these?
     
  20. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    Yes, I forgot to mention it in documentation.
    ListViewIcons can be easily visiually customized, but it make imposible to automaticly change visual with direction change.
    (Probably it's possible correctly proccess direction change for initial state with some code, but after changing sprite, sizes, etc it will make visual only worse - you can check it with default Unity Slider or Scrollbar - create one of them, set RectTransform anchors to any with strech, then change direction from horizontal to vertical or backwards and you can see how it's broken.)
    Because of this visual not changed with direction change, it should be done manually after changing direction to Horizontal:
    • DefaultItem.RectTransform: set anchors to top left (or any without horizontal stretch)
    • ListViewIcons.RectTransform: change height to fit only one item
    • Duplicate Scrollbar, set Direction = Left to Right, fix size and position, replace sprites for Background (scrollbar_horizontal_background) and Handle (scrollbar_horizontal_handle), specify HorizontalScrollbar in ScrollRect
    • List.ContentSizeFitter: HorizontalFit = PreferredSize, VerticalFit = Unconstrained (for now it's a bug, it should be done automaticly with direction change)

    Or changing direction in runtime:
    Code (CSharp):
    1. using UnityEngine;
    2. using UnityEngine.UI;
    3. using UIWidgets;
    4.  
    5. namespace UIWidgetsSamples {
    6.     public class TestListViewDirectionToggle : MonoBehaviour {
    7.         public ListViewIcons ListView;
    8.  
    9.         public void ToggleDirection()
    10.         {
    11.             // DefaultItem.RectTransform.anchors should be top left
    12.  
    13.             var fitter = ListView.Container.GetComponent<ContentSizeFitter>();
    14.             var list_transform = (ListView.transform as RectTransform);
    15.             if (ListView.Direction==ListViewDirection.Horizontal)
    16.             {
    17.                 // reset scroll position
    18.                 (ListView.Container as RectTransform).anchoredPosition = Vector2.zero;
    19.  
    20.                 // change ListViewIcons size
    21.                 list_transform.SetSizeWithCurrentAnchors(RectTransform.Axis.Vertical, 190f);
    22.                 list_transform.SetSizeWithCurrentAnchors(RectTransform.Axis.Horizontal, 240f);
    23.  
    24.                 // fix content size fitter
    25.                 fitter.horizontalFit = ContentSizeFitter.FitMode.Unconstrained;
    26.                 fitter.verticalFit = ContentSizeFitter.FitMode.PreferredSize;
    27.  
    28.                 // change direction
    29.                 ListView.Direction = ListViewDirection.Vertical;
    30.             }
    31.             else
    32.             {
    33.                 // reset scroll position
    34.                 (ListView.Container as RectTransform).anchoredPosition = Vector2.zero;
    35.  
    36.                 // change ListViewIcons size
    37.                 list_transform.SetSizeWithCurrentAnchors(RectTransform.Axis.Vertical, 70f);
    38.                 list_transform.SetSizeWithCurrentAnchors(RectTransform.Axis.Horizontal, 400f);
    39.  
    40.                 // fix content size fitter
    41.                 fitter.horizontalFit = ContentSizeFitter.FitMode.PreferredSize;
    42.                 fitter.verticalFit = ContentSizeFitter.FitMode.Unconstrained;
    43.  
    44.                 // change direction
    45.                 ListView.Direction = ListViewDirection.Horizontal;
    46.             }
    47.         }
    48.     }
    49. }
     
  21. FatIgor

    FatIgor

    Joined:
    Sep 13, 2015
    Posts:
    29
    Hi @ilih

    Is there a way to get tooltips to stop showing in the editor?

    I have a few tooltips set up, and they are all showing when using the editor.

    Am I setting them up correctly? What I do is, drag the tooltip.cs file onto the item on which I want to have a tooltip.

    They work fine when I am running the scene, I'd just like them to hide themselves in the editor.
     
  22. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    Disable Tooltip gameobject in Inspector window
     
    FatIgor likes this.
  23. FatIgor

    FatIgor

    Joined:
    Sep 13, 2015
    Posts:
    29
    Welll that was simple enough! Thank you for the prompt reply.
     
  24. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,084
    Hi @ilih
    setting left margin increases item height which is wrong. please take a look.
     

    Attached Files:

  25. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    Thanks.
    Fix:
    EasyLayout.cs, replace line 528
    old line:
    Code (CSharp):
    1. BlockSize = new Vector2(UISize.x + MarginLeft + MarginRight, UISize.y + MarginLeft + MarginRight);
    new line:
    Code (CSharp):
    1. BlockSize = new Vector2(UISize.x + MarginLeft + MarginRight, UISize.y + MarginTop + MarginBottom);
     
  26. fritzpoll

    fritzpoll

    Joined:
    Apr 2, 2014
    Posts:
    3
    Thanks! Will give it a go!
     
  27. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,084
    Thanks!
     
  28. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,084
    Hi @ilih
    Should i use Sprite or Texture for use in CustomList? which one do you recommend?
     
  29. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    Sprite will be better in most cases, unless you already have list of textures and you don't need Sprite or Image features.
     
  30. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,084
    ill be loading them from net and they will be loaded as textures, 1 texture may appear in multiple list items, so which one should i go with peformance wise?
     
  31. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    Texture
     
  32. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,084
    Will do, Thanks
     
  33. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,084
    Please make DataSource virtual in next update so we can add custom logic by overriding it.
    Thanks
     
  34. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    Ok
     
    jGate99 likes this.
  35. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,084
    Is there any function to see what items are visible on CustomList? For example items from index 5 to 10 visible?
     
  36. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    You can use protected fields topHiddenItems and visibleItems. Indicies of visible items will be in range from topHiddenItems to topHiddenItems + visibleItems - 1
    You can check if item visible with following code
    Code (CSharp):
    1.         public bool IsItemVisible(int index)
    2.         {
    3.             return topHiddenItems<=index && index<=(topHiddenItems + visibleItems - 1);
    4.         }
    5.  
     
  37. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,084
    so if i want to get all visible items indices then it should be like that?

    Code (CSharp):
    1.         public List<int> GetVisibleIdeces(){
    2.  
    3.  
    4.             int lastIndex = (topHiddenItems + visibleItems - 1);
    5.  
    6.  
    7.  
    8.             List<int> visibleIndecis = new List<int> ();
    9.  
    10.  
    11.             for (int i = topHiddenItems; i <= lastIndex; i++) {
    12.  
    13.  
    14.                 visibleIndecis.Add (i);
    15.  
    16.             }
    17.  
    18.  
    19.             return visibleIndecis;
    20.  
    21.         }
     
  38. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    It can be shorter
    Code (CSharp):
    1. using System.Linq;
    2.         //...
    3.         public List<int> GetVisibleIndicies()
    4.         {
    5.             return Enumerable.Range(topHiddenItems, visibleItems).ToList();
    6.         }
     
    jGate99 likes this.
  39. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,084
    Please add both functions in next update.
     
  40. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    Ok
     
  41. Aston-Martin

    Aston-Martin

    Joined:
    Jul 5, 2012
    Posts:
    59
    hi ilih,

    Need so help here, using the ListViewVariableHeightSample to built a chat box.
    Adding/clearing message from the chatterbox working as intended.

    As i continue adding messages to the chat listbox, the new message is hidden from view.
    How to scroll down to the bottom of the list and display the latest item from the c# code?

    Br,
    Martin

    -
     
  42. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    1. Fix for ListViewCustomHeight (without it will be displayed only two items)
      Replace SetNewItems() in ListViewCustomHeight.cs
      Code (CSharp):
      1.         protected override void SetNewItems(ObservableList<TItem> newItems)
      2.         {
      3.             SetItemsHeight(newItems);
      4.             CalculateMaxVisibleItems();
      5.  
      6.             base.SetNewItems(newItems);
      7.         }
    2. Code to scroll to latest item:
      Code (CSharp):
      1.             // recalculate container RectTransform size
      2.             var fitter = ListViewVariableHeightSample.Container.GetComponent<ContentSizeFitter>();
      3.             fitter.SetLayoutHorizontal();
      4.             fitter.SetLayoutVertical();
      5.  
      6.             // scroll to end
      7.             ListViewVariableHeightSample.ScrollRect.verticalNormalizedPosition = 0f;
    Sample code with prefab
    https://ilih.ru/unity-assets/Demos/Chat-sample.zip
     
  43. Aston-Martin

    Aston-Martin

    Joined:
    Jul 5, 2012
    Posts:
    59
    FINALLY SOLVED! the issue has been bugging me for the past 24hrs...
    Amazing ilih...., Thank you!

    BTW, what's the best way to set red color text for sys message ?
     
    Last edited: Jan 26, 2016
  44. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    Specify message type
    Code (CSharp):
    1.             // add system message to chat
    2.             Chat.DataSource.Add(new ChatLine(){
    3.                 UserName = "User",
    4.                 Message = "Some message",
    5.                 Time = DateTime.Now,
    6.                 Type = ChatLineType.System,
    7.             });
    And set text color depend of message type in ChatLineComponent.SetData()
    Code (CSharp):
    1.             if (item.Type==ChatLineType.System)
    2.             {
    3.                 UserName.color = Color.red;
    4.                 Message.color = Color.red;
    5.             }
    6.             else
    7.             {
    8.                 UserName.color = Color.white;
    9.                 Message.color = Color.white;
    10.             }
     
  45. Aston-Martin

    Aston-Martin

    Joined:
    Jul 5, 2012
    Posts:
    59
    Thanks!, thats makes the code clean and neat!!! Like it!
     
  46. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,084
    How can i enforce EasyLayout to use only 1 column when it can show items into multiple columns?
     
  47. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    Fow now only set width (with padding and spacing) more than 50% of parent size - best way is set RectTransform anchors to horizontal stretch and edit left and right values.
     
    jGate99 likes this.
  48. Aston-Martin

    Aston-Martin

    Joined:
    Jul 5, 2012
    Posts:
    59
    Need help in modify the teamspyview report.
    Basically, i attempt to add country column to the existing report framework. The country data is iso_2, example, 'us' will display the us flag icon in the column. default is 'us'.

    Progress till display the text field, but not the icon sprite...an example will be good !!!
     
  49. ilih

    ilih

    Joined:
    Aug 6, 2013
    Posts:
    839
    1. Create class to keep country code with flag
      Code (CSharp):
      1.     [System.Serializable]
      2.     public class CountryFlag {
      3.         [SerializeField]
      4.         public string Country;
      5.         [SerializeField]
      6.         public Sprite Flag;
      7.     }
    2. Add array of CountryFlag to component and Image to display flag
      Code (CSharp):
      1.  
      2.         [SerializeField]
      3.         public Image Flag;
      4.         [SerializeField]
      5.         public CountryFlag[] Flags;
    • Specify flags
    • Create function to get flag by country code
      Code (CSharp):
      1.         Sprite GetFlag(string country)
      2.         {
      3.             foreach (var flag in Flags)
      4.             {
      5.                 if (flag.Country==country)
      6.                 {
      7.                     return flag.Flag;
      8.                 }
      9.             }
      10.             return null;
      11.         }
    • Set flag sprite in SetData()
      Code (CSharp):
      1. Flag.sprite = GetFlag(item.Country);
    Full code in attachment
     

    Attached Files:

  50. Aston-Martin

    Aston-Martin

    Joined:
    Jul 5, 2012
    Posts:
    59
    Screen Shot 2016-02-03 at 5.41.30 PM.png Screen Shot 2016-02-03 at 5.41.48 PM.png

    Ok, flag icon shown in the column, code works.
    But, the column drag/sort will mess up with table.
     
unityunity