Question What is the correct way to use style sheets and templates at runtime

A UI I am making is as follows:


Here's the following questions:

1，When I want to make a ListView, I need "dataSource", "makeItem" and "bindItem" and other binding methods, right? So I create a Template called "ListItem_Record" below as a .uxml file. Unfortunately, when I drag and drop this template onto my UI, its style is inconsistent with the style before it is not set as a template, Like that:


I don’t understand why UI Toolkit will wrap it again when creating the template, which make its style is inconsistent with the style before. If I want them to behave the same, I have to give the '#ListItem_DefectRecord" a ".ListItem_Record" styleSheet to make them act like the same.

2, Is there an officially recommended way to load .uxml and .uss resources at runtime? When I want to create and specify them at runtime, I did not find any tutorials available. Please Help!

 

I don’t have an answer for this, I just wanted to say that I think this behavior is really strange too.

 

And is there some way to specify the stylesheet for some control in the runtime?

 

Yes I run into the same issue.
I wanted to have templates so that the style can be set via uibuilder. But that extra VisualElement, that is generated when using the template works against that.
For example having a container with "justify-content: center;" the behavior is different if there is a VisualElement with no style info there or not.

My workflow is now: When styling the container and the template i put dummy "Visual Element" between to compensate that template-Element

 

Ugh......It still doesn't seem convenient enough