basic flow layout

res/shaders/TextPass.slang

@@ -4,6 +4,7 @@ struct GlyphInstanceData
 {
     float x;
     float y;
+    float z;
     float width;
     float height;
     uint glyphIndex;
@@ -40,15 +41,15 @@ VertexOutput vertexMain(VertexInput input)
     float h = pText.glyphs[input.instanceId].height;
     
     const float4 coordinates[4] = {
-        float4(xpos,     ypos,     0, 1),
-        float4(xpos,     ypos + h, 0, 0),
-        float4(xpos + w, ypos,     1, 1),
-        float4(xpos + w, ypos + h, 1, 0),
+        float4(xpos,     ypos,     0, 0),
+        float4(xpos,     ypos + h, 0, 1),
+        float4(xpos + w, ypos,     1, 0),
+        float4(xpos + w, ypos + h, 1, 1),
     };
     float4 vertex = coordinates[input.vertexId];
     VertexOutput output;
     output.texCoords = vertex.zw;
-    output.position = mul(pViewParams.projectionMatrix, float4(vertex.xy, 0, 1));
+    output.position = mul(pViewParams.projectionMatrix, float4(vertex.xy, pText.glyphs[input.instanceId].z-1, 1));
     output.glyphIndex = pText.glyphs[input.instanceId].glyphIndex;
     return output;
 }
@@ -60,5 +61,5 @@ float4 fragmentMain(
     uint glyphIndex : GLYPHINDEX
 ) : SV_Target
 {
-    return float4(1, 0, 0, pText.glyphTextures[glyphIndex].Sample(pText.glyphSampler, texCoords));
+    return float4(0,0,0,pText.glyphTextures[glyphIndex].Sample(pText.glyphSampler, texCoords));
 }

res/shaders/UIPass.slang

@@ -2,44 +2,41 @@ import Common;
 
 struct RenderElementStyle
 {
-    float3 position;
-    uint backgroundImageIndex;
-    float3 backgroundColor;
+    float x;
+    float y;
+    float w;
+    float h;
+    float3 color;
     float opacity;
-    //float4 borderBottomColor;
-    //float4 borderLeftColor;
-    //float4 borderRightColor;
-    //float4 borderTopColor;
-    //float borderBottomLeftRadius;
-    //float borderBottomRightRadius;
-    //float borderTopLeftRadius;
-    //float borderTopRightRadius;
-    float2 dimensions;
+    float z;
+    uint textureIndex;
+    uint pad0;
+    uint pad1;
 };
 
 struct UIParameter
 {
-    SamplerState backgroundSampler;
-    uint numBackgroundTextures;
-    Texture2D<float4> backgroundTextures[];
-}
-
+    StructuredBuffer<RenderElementStyle> elements;
+    SamplerState sampler;
+    Texture2D textures[];
+};
 ParameterBlock<UIParameter> pParams;
 
 struct VertexOutput
 {
     float4 position  : SV_Position;
     float2 texCoords : TEXCOORD;
-    RenderElementStyle style : RENDER_STYLE;
+    RenderElementStyle style : STYLE;
 };
 
 [shader("vertex")]
-VertexOutput vertexMain(uint vertexId : SV_VertexID, RenderElementStyle style)
+VertexOutput vertexMain(uint vertexId : SV_VertexID, uint instanceId: SV_InstanceID)
 {
-    float xMin = style.position.x;
-    float xMax = xMin + style.dimensions.x;
-    float yMin = style.position.y;
-    float yMax = yMin + style.dimensions.y;
+    RenderElementStyle style = pParams.elements[instanceId];
+    float xMin = style.x;
+    float xMax = xMin + style.w;
+    float yMin = style.y;
+    float yMax = yMin + style.h;
     float4 coordinates[] = {
         float4(xMin, yMin, 0, 0),
         float4(xMin, yMax, 0, 1),
@@ -47,7 +44,7 @@ VertexOutput vertexMain(uint vertexId : SV_VertexID, RenderElementStyle style)
         float4(xMax, yMax, 1, 1)
     };
     VertexOutput output;
-    output.position = mul(pViewParams.projectionMatrix, float4(coordinates[vertexId].xy, style.position.z, 1));
+    output.position = mul(pViewParams.projectionMatrix, float4(coordinates[vertexId].xy, style.z-1, 1));
     output.texCoords = coordinates[vertexId].zw;
     output.style = style;
     return output;
@@ -55,12 +52,12 @@ VertexOutput vertexMain(uint vertexId : SV_VertexID, RenderElementStyle style)
 
 [shader("fragment")]
 float4 fragmentMain(
-    float4 position : SV_Position,
     float2 texCoords : TEXCOORD,
-    RenderElementStyle style : RENDER_STYLE
+    RenderElementStyle style : STYLE
 ) : SV_Target
 {
-    float4 bgTextureColor = float4(1, 1, 1, 1);
-    uint imageIndex = style.backgroundImageIndex;
-    return float4(0, 1, 0, 1);
+    if(style.textureIndex == -1) {
+        return float4(style.color, style.opacity);
+    }
+    return float4(pParams.textures[style.textureIndex].Sample(pParams.sampler, texCoords.xy).xyz, style.opacity);
 }