Search Unity

Feature Request Serialize/Deserialize UXML from VisualElement hierarchy

Discussion in 'UI Toolkit' started by pegorari, Oct 4, 2019.

  1. pegorari

    pegorari

    Joined:
    Nov 19, 2009
    Posts:
    60
    It would like to create a very simple theme editor, with very high level control (limited customization). I would like to generate a uxml from the entire hierarchy from a VisualElement root, like the UI Builder works (load a file, change it, and save again to uxml).

    I took a look in the UI Builder source code to understand how to serialize/deserialize the uxml template into a VisualElement or VisualAssetTree, but there is a lot of Unity internal code, not exposed.

    If there is a way to implement this that i'm not seeing, it would be very nice to know!

    Thanks!
     
    pegorari, Oct 4, 2019
    #1

  2. uDamian

    uDamian

    Unity Technologies

    Joined:
    Dec 11, 2017
    Posts:
    1,231
    Converting any VisualElement hierarchy to UXML is not possible. UXML > VisualElements is a one-way operation. The UI Builder always operates on the UXML file you have open, not the live VisualElement hierarchy in the canvas (it just makes it look like you're operating on the canvas).

    The main reason is that VisualElements are not serializable in general. They have internal state that would not survive a serialization. Custom VisualElements are also free to modify the hierarchy (both below and above in the tree), and this almost always happens to some degree after you've cloned a UXML asset. You rarely have the same number of elements in the runtime tree as you had tags in the UXML doc.

    That said, why do you need this for a theme editor?
     
    uDamian, Oct 7, 2019
    #2

  3. pegorari

    pegorari

    Joined:
    Nov 19, 2009
    Posts:
    60
    Thanks for your answer uDamian!

    For now i'm still playing with the UI Elements but if it's feasible, the idea is to create a product for asset store. Something like those high level wordpress theme customizers or like this mailchimp template editor
    . I think it would be very useful for programmers with low or zero design skills, so it would be important to have a limited customizing control to keep the quality.

    The developer buys a full ui theme pack on asset store, customize it with (drag some specific template blocks / change colors / font), and then export the customized theme to a folder. It would be cool to have some templates with the skeleton sections already defined (header, footer, columns...), and then specific block templates available to drag to this sections according to its size. After this you can export into a folder the final uxml files and then you can open it on UIBuilder for fine tunning if you wish, or just use in your app.

    Any suggestion/feedback is welcome!
     
    pegorari, Oct 7, 2019
    #3

  4. uDamian

    uDamian

    Unity Technologies

    Joined:
    Dec 11, 2017
    Posts:
    1,231
    Ya, makes sense. You'll still need to do what the UI Builder does and operate on the UXML/USS files themselves. We have no plans to create a VisualElement tree -> UXML/USS conversion workflow. We do have plans to add public APIs for direct access and editing of UXML/USS assets though.

    I'd also note that I see some overlap with your tool and the UI Builder. That's totally fine, of course, this is why we want to open the UXML/USS assets so anyone can build tools on top of them. That said, this kind of tool might makes sense as a plugin on top of UI Builder, once we add extensibility support to the tool.

    Either way, if you want to start building something right now, you'll have to do some serious reflection to get to the functionality you need. I'd recommend waiting a bit for our public APIs to catch up.
     
    uDamian, Oct 7, 2019
    #4

  5. pegorari

    pegorari

    Joined:
    Nov 19, 2009
    Posts:
    60
    Nice to know there will be a public api! Thanks for you support, it was very helpful!
     
    pegorari, Oct 7, 2019
    #5