How do I make sure build includes UXML and USS for a custom control?

Hello! I’m setting up a specialised control that inherits from MultiColumnListView. How can I “reference” the UXML and USS that I’m using to ensure that I can use them in runtime? For Editor I could simply use AssetDatabase and load it, but in a build I’d have to throw it in a Resources folder, or similar.

What’s the recommended approach here?

If you are using Unity 6+ you could add UxmlAttribute fields of StyleSheet and VisualTreeAsset to your control and then add references to them in the UI Builder.
Alternatively you could use the Resources system to load them Unity - Scripting API: Resources

Does that mean I would have to configure that on every instance of my custom control? If so, is there a way to set a default?

Yes you would need to set it on every instance. There are some options described here Unity - Manual: Load UXML and USS C# scripts

1 Like

Can maybe set up the styles in a theme style sheet: Unity - Manual: Theme Style Sheet (TSS)

This is how I set up all the styles for reusable elements across a project, without said controls needing to handle anything about their styling.

And then specific UI docs can set overriding styles atop of those.

My issue with Theme Style Sheets is that they seem to be a lower precedence than normal style sheets, so if you do use a normal Style Sheet selector precedence goes out the window.

I started with TSS, but ended up with a main USS that imports the top level sheets. Afaik it’s best to not avoid normal style sheets, as they’re are generally where the object references are, so can matter when you load them as far as memory management is concerned. I hope having them closer to the elements they relate to also reduces the overhead of matching relevant selectors.

TSS sheets having a lower precedence makes sense though. They are your default styles, and then any styles sheets directly referenced by the UXML file are ‘overrides’ for those default styles.

I haven’t had any issues with using a TSS this way. It makes it a lot quicker to implement a control that is widely used across a project.

This is probably off-topic, and maybe I’ll move these posts to a new thread if it’s not quick, but:

If selector precedence doesn’t work then anything mildly complicated just falls apart.

<VisualElement>
  <VisualElement class="listElement -first">
  <VisualElement class="listElement">
</VisualElement>
// TSS
.listElement {
  margin: 5px;
}

VisualElement > .listElement.-first {
   margin-top: 0;
}
// USS
.listElement {
  margin: 50px;
}

The first child now has 50px top margin. So now the TSS rule is inconsistently implemented. Imo it should have a lower precedence than a plain style sheet, yes, but that should happen after selector precedence!

I don’t see the issue here? The USS should apply after the TSS. So the margin-top of 50 makes sense.