Search Unity

Need upgrade guide for UIElements 2019.2.

Discussion in 'UI Toolkit' started by Kichang-Kim, Feb 27, 2019.

  1. Kichang-Kim

    Kichang-Kim

    Joined:
    Oct 19, 2010
    Posts:
    1,012
    Hi, I implemented my own Tabs control for mimicking Tabs on Unity's Lighting Window and it works well with Unity 2018.3.

    Here is source code:
    Code (CSharp):
    1. using System.Collections.Generic;
    2. using UnityEngine;
    3. using UnityEngine.Experimental.UIElements;
    4. using UnityEngine.Experimental.UIElements.StyleEnums;
    5.  
    6. namespace UIElementsEx
    7. {
    8.     public class Tabs : VisualElement
    9.     {
    10.         class Tab
    11.         {
    12.             public Button HeaderButton { get; set; }
    13.             public VisualElement Element { get; set; }
    14.  
    15.             public void SetVisibility(bool value)
    16.             {
    17.                 if (value)
    18.                 {
    19.                     this.HeaderButton.style.fontStyleAndWeight = FontStyle.Italic;
    20.                     this.Element.visible = true;
    21.                     this.Element.style.positionType = PositionType.Relative;
    22.                 }
    23.                 else
    24.                 {
    25.                     this.HeaderButton.style.fontStyleAndWeight = FontStyle.Normal;
    26.                     this.Element.visible = false;
    27.                     this.Element.style.positionType = PositionType.Absolute;
    28.                 }
    29.             }
    30.         }
    31.  
    32.         public override VisualElement contentContainer => base.contentContainer;
    33.  
    34.         VisualContainer headerContainer;
    35.         VisualElement tabElementContainer;
    36.         List<Tab> tabs;
    37.  
    38.         public Tabs()
    39.         {
    40.             this.headerContainer = new VisualContainer();
    41.             this.headerContainer.style.flexDirection = FlexDirection.Row;
    42.             this.headerContainer.style.justifyContent = Justify.Center;
    43.             this.shadow.Add(this.headerContainer);
    44.  
    45.             this.tabElementContainer = new VisualElement();
    46.             this.tabElementContainer.clippingOptions = ClippingOptions.ClipContents;
    47.             CompatibilityHelper.SetFlex(this.tabElementContainer, 1.0f);
    48.             this.shadow.Add(tabElementContainer);
    49.  
    50.             this.tabs = new List<Tab>();
    51.         }
    52.  
    53.         public void AddTab(string text, VisualElement element)
    54.         {
    55.             Tab tab = new Tab();
    56.             tab.Element = element;
    57.             tab.HeaderButton = new Button(() =>
    58.             {
    59.                 foreach (Tab otherTab in this.tabs)
    60.                 {
    61.                     otherTab.SetVisibility(false);
    62.                 }
    63.  
    64.                 tab.SetVisibility(true);
    65.             })
    66.             {
    67.                 text = text,
    68.             };
    69.  
    70.             this.tabs.Add(tab);
    71.             this.headerContainer.Add(tab.HeaderButton);
    72.             this.tabElementContainer.Add(tab.Element);
    73.  
    74.             if (this.tabs.Count == 1)
    75.             {
    76.                 tab.SetVisibility(true);
    77.             }
    78.             else
    79.             {
    80.                 tab.SetVisibility(false);
    81.             }
    82.         }
    83.     }
    84. }
    85.  
    But this code does not work with 2019.2, because the stable version of VisualElement does not have shadow, clippingOptions properties and type VisualContainer. Also AddStyleSheetPath() is missing too.

    Is there any documentation for upgrading guide for stable version of UIElements?
     
  2. antoine-unity

    antoine-unity

    Unity Technologies

    Joined:
    Sep 10, 2015
    Posts:
    780
    Hello,

    Here is a draft of the migration guide from the experimental API (2018.3) to the stable api (2019.1+).

    Hopefully it will make the upgrade smooth for you.

    Do let us know if you encounter any issue.
     

    Attached Files:

    Kichang-Kim likes this.
  3. nsmith1024

    nsmith1024

    Joined:
    Mar 18, 2014
    Posts:
    870
    Hi, Im using Unity 2018.3 and I need to have a slider that has two values instead of just one. The slider should have a min value and a max value (a range) instead of just one value in the same slider.

    I saw ths slider:

    https://docs.pumachen.xyz/unity-doc/ScriptReference/Experimental.UIElements.MinMaxSlider.html

    But It doesnt say how to use it? How do I get this minMaxslider into my game canvas? I dont see it when i right click in the hierarchy and select UI. It only has the usual slider, button etc. How do i get the MinMaxSlider slider to show up, so that i can put on into my canvas?

    Thanks
     
  4. uDamian

    uDamian

    Unity Technologies

    Joined:
    Dec 11, 2017
    Posts:
    1,231
    In 2019.2, you can go to Windows > UI > UIElements Samples, where you'll find a use example for MinMaxSlider.
     
  5. nsmith1024

    nsmith1024

    Joined:
    Mar 18, 2014
    Posts:
    870
    Im using 2018.3.14f1 doesn't seem to have it.
     
  6. Sylmerria

    Sylmerria

    Joined:
    Jul 2, 2012
    Posts:
    369
    Indeed, this tool was add from 19.2