Search Unity

  1. Unity 2020.1 has been released.
    Dismiss Notice
  2. 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

USS and UXML support in Visual Studio

Discussion in 'UI Toolkit' started by TheValar, Apr 18, 2019.

  1. TheValar

    TheValar

    Joined:
    Nov 12, 2012
    Posts:
    759
    Just checking out UI Elements this week and Visual Studio doesn't seem to recognize uss files as anything other than plain text. Is there anything specific I need to do to get good styling and autocomplete features for uss in Visual Studio?

    Note:
    using visual studio 2017 professional
    uxml seems somewhat ok but formatting is a bit weird so perhaps it could be better with some configuration
     
  2. jonathanma_unity

    jonathanma_unity

    Unity Technologies

    Joined:
    Jan 7, 2019
    Posts:
    101
    Hi,

    USS is a small subset of CSS so any CSS plugin should help.
    I personally use Visual Studio Code for USS files and it works out of the box as long as you add the file association in your setting.
     
    mandisaw likes this.
  3. TheValar

    TheValar

    Joined:
    Nov 12, 2012
    Posts:
    759
    I assume that means there will be no indication in the IDE if you use valid css that is unsupported by USS right? And same with autocomplete suggestiosn
     
  4. jonathanma_unity

    jonathanma_unity

    Unity Technologies

    Joined:
    Jan 7, 2019
    Posts:
    101
    mandisaw and TheValar like this.
  5. MortonTech

    MortonTech

    Joined:
    Jun 6, 2018
    Posts:
    3
    Easy solution.

    Within Visual Studio 2019 navigate to:
    Tools => Options => TextEditor => File Extensions

    1. Enter the text "uss" (without quotes) into the box "Extension"
    2. Select "CSS Editor" from the drop-down list labelled "Editor"
    3. Click "Add", then click "OK"

    Close Visual Studio and relaunch from within Unity. You now have CSS highlighting.

    The only warning I'd give you: this is full CSS highlighting, and obviously Unity's USS only supports some of the properties, but you can work that out here:
    https://docs.unity3d.com/Manual/UIE-USS-SupportedProperties.html
     
  6. Trinary

    Trinary

    Joined:
    Jul 26, 2013
    Posts:
    370
    Where can I find this uss validation system? So far as I can tell my USS is unvalidated on 2019.2.
     
  7. jonathanma_unity

    jonathanma_unity

    Unity Technologies

    Joined:
    Jan 7, 2019
    Posts:
    101
    Hi Trinary,

    The validation system is on by default. It's possible to disable it in the inspector when the USS file is selected.
    The USS errors are reported as warnings in the Console window, if you don't see any it means that you're USS file is all good.

    If you're not sure you can try something unsupported like this :

    Code (CSharp):
    1. .border {
    2.  
    3. border: solid;
    4.  
    5. }
     
  8. BinaryCats

    BinaryCats

    Joined:
    Feb 8, 2016
    Posts:
    273
    Just found this thread, sorry for such a late reply, but I just had to tell you that Rider has really great support for UXML and USS! I was using VS for a while and for uss/uxml rider hands down wins over VS
     
  9. TheValar

    TheValar

    Joined:
    Nov 12, 2012
    Posts:
    759
    This seems to have improved a lot since first posted. Visual Studio is offering good completion and validation on both UXML and USS. Only downside is that it doesn't know which extra css properties Unity has added or which ones Unity does not support.
     
unityunity