Quicksave Logo

Render Proxy Element

Render Proxy Elements let you change the render order of elements by “proxying” the rendering of one or more other elements at the position of the Render Proxy Element. By effectively reparenting or redistributing draw order, you can control layering and rendering order without restructuring your hierarchy.


Render Proxy Element Properties

PropertyTypeDetails
NametextName of the element. Make sure the name of the element is unique if the element needs to be accessible from code (Enterprise Plan only).
ElementtextThe element to be rendered in place of this proxy element.

Example Use: Dynamically Resize the Background of a Text Element

  1. Create a Render Proxy Element, and name it render-proxy.
  2. Create a Text Element as a child of the Render Proxy Element created in Step 1, and name it text.
  3. Add a Linear Gradient Element as a child of the Text Element created in Step 2, and name it linear-gradient.
  4. In the Linear Gradient Element's Properties, set the Parent Size values to x: 1, y: 1, and the Size values to x: 0, y: 0. This will make the Linear Gradient match the size of its parent element (the Text Element created in Step 2).
  5. Now, set the Element value of the Render Proxy Element to linear-gradient (the name of the Linear Gradient Element). This will change the rendering order of the elements, so the Linear Gradient appears behind the text.

Now you can use the Render Proxy Element to create dynamically sized backgrounds for your UI!

Render Proxy example in the UI Editor