correct blending mode for text, but still terrible font rendering :(

Author: FlurinBruehwiler

Flamui.Components/DropDown.cs

@@ -29,7 +29,10 @@ public override void Build(Ui ui)
 
             ui.Text(SelectedOption.ToString() ?? string.Empty).Color(ColorPalette.TextColor);
 
-            // ui.SvgImage("./Icons/expand_more.svg");
+            using (ui.Div().Height(23).Width(23))
+            {
+                ui.SvgImage("Icons/TVG/expand_more.tvg");
+            }
 
             if (_isExpanded)
             {

Flamui/Drawing/FontLoader.cs

@@ -154,14 +154,14 @@ public unsafe AtlasGlyphInfo FindGlyphEntry(char c, float resolutionMultiplier)
 
         Console.WriteLine($"glyph cache miss: {c}:{resolutionMultiplier}, inserting into slot {entry.SlotNumber}");
 
-        for (var i = 0; i < bitmapSpan.Length; i++) //correct upwards for clearer text, not sure why we need to do it...
-        {
-            ref var b = ref bitmapSpan[i];
-
-            var f = (double)b;
-            f = 255 * Math.Pow(f / 255, 0.5f);
-            b = (byte)f;
-        }
+        // for (var i = 0; i < bitmapSpan.Length; i++) //correct upwards for clearer text, not sure why we need to do it...
+        // {
+        //     ref var b = ref bitmapSpan[i];
+        //
+        //     var f = (double)b;
+        //     f = 255 * Math.Pow(f / 255, 0.5f);
+        //     b = (byte)f;
+        // }
 
         GpuTexture.Gl.BindTexture(TextureTarget.Texture2D, GpuTexture.TextureId);
         GpuTexture.Gl.PixelStore(PixelStoreParameter.UnpackAlignment, 1);

Flamui/Drawing/GlCanvas.cs

@@ -241,7 +241,9 @@ public void Start()
         _renderer.Gl.StencilMask(0xFF);
         _renderer.Gl.StencilFunc(StencilFunction.Always, 1, 0xFF);
 
-
+        // _renderer.Gl.Enable(EnableCap.FramebufferSrgb);
+        _renderer.Gl.Enable(EnableCap.Blend);
+        _renderer.Gl.BlendFunc(BlendingFactor.One, BlendingFactor.OneMinusSrcAlpha);
     }
 
     public void Flush()

Flamui/Drawing/Renderer.cs

@@ -205,8 +205,8 @@ public unsafe GpuTexture UploadTexture(Bitmap bitmap)
 
         Gl.TexParameterI(TextureTarget.Texture2D, TextureParameterName.TextureWrapS, (int)TextureWrapMode.Repeat);
         Gl.TexParameterI(TextureTarget.Texture2D, TextureParameterName.TextureWrapT, (int)TextureWrapMode.Repeat);
-        Gl.TexParameterI(TextureTarget.Texture2D, TextureParameterName.TextureMinFilter, (int)TextureMinFilter.Nearest);
-        Gl.TexParameterI(TextureTarget.Texture2D, TextureParameterName.TextureMagFilter, (int)TextureMagFilter.Nearest);
+        Gl.TexParameterI(TextureTarget.Texture2D, TextureParameterName.TextureMinFilter, (int)TextureMinFilter.Linear);
+        Gl.TexParameterI(TextureTarget.Texture2D, TextureParameterName.TextureMagFilter, (int)TextureMagFilter.Linear);
 
         Gl.BindTexture(TextureTarget.Texture2D, 0);
 

Flamui/Drawing/Shaders/main_fragment.glsl

@@ -20,7 +20,8 @@ void main()
         }else if(texture_type == 1){
             out_color = texture(uTextures[int(texture_id)], frag_texCoords);
         }else if(texture_type == 2){
-            out_color = texture(uTextures[int(texture_id)], frag_texCoords).r * frag_color;
+            float alpha = texture(uTextures[int(texture_id)], frag_texCoords).r;
+            out_color = vec4(frag_color.rgb * alpha, alpha);
            // out_color = vec4(1, 0, 0, 1);
         }
     }else{
@@ -50,6 +51,8 @@ void main()
             discard;
         }
 
-        out_color = vec4(frag_color.r, frag_color.g, frag_color.b, frag_color.a * opacity);
+        opacity *= frag_color.a;
+
+        out_color = vec4(frag_color.r * opacity, frag_color.g * opacity, frag_color.b * opacity, opacity);
     }
 }

Flamui/UiWindow.cs

@@ -304,7 +304,7 @@ private void RenderToCanvas()
 
         if (!RenderContextAreSame(RenderContext, LastRenderContext))
         {
-            RenderContext.PrintCommands();
+            // RenderContext.PrintCommands();
 
             _renderer.Gl.Viewport(Window.Size);
             RenderContext.Rerender(_renderer);

Flamui/VgAtlas.cs

@@ -93,6 +93,16 @@ public unsafe AtlasEntry GetAtlasEntry(int svgHash, Span<byte> vgData, uint widt
                 BitmapFormat = BitmapFormat.RGBA
             };
 
+            //premultiply alpha
+            for (int i = 0; i < bitmap.Height * bitmap.Width; i++)
+            {
+                var a = (float)bitmap.Data[i * 4 + 3] / 255;
+
+                bitmap.Data[i * 4 + 0] = (byte)((float)bitmap.Data[i * 4 + 0] * a);
+                bitmap.Data[i * 4 + 1] = (byte)((float)bitmap.Data[i * 4 + 1] * a);
+                bitmap.Data[i * 4 + 2] = (byte)((float)bitmap.Data[i * 4 + 2] * a);
+            }
+
             bitmap.CopyTo(tempBitmap);
             // tempBitmap.PrintToConsole();
 

Sample.LayoutTest/Program.cs

@@ -1,4 +1,5 @@
 using Flamui;
+using Flamui.Components;
 
 /*
  * Todo
@@ -24,7 +25,7 @@ public class LayoutTest : FlamuiComponent
         "Lorem ipsum dolor sit amet, consectetur adipiscing elit.";
 
     private string input2 = "anita max wynn";
-    private string selectedOption = "";
+    private string selectedOption = "John";
 
     private string[] icons =
     [
@@ -49,7 +50,9 @@ public class LayoutTest : FlamuiComponent
 
     public override void Build(Ui ui)
     {
-        using (ui.Div().Margin(10).Color(C.Gray6).ScrollVertical().Clip().Padding(10))
+        ui.CascadingValues.TextColor = C.White;
+
+        using (ui.Div().Margin(10).Color(C.Gray6).ScrollVertical().Clip().Padding(10).Rounded(10))
         {
             foreach (var icon in icons)
             {
@@ -61,9 +64,16 @@ public override void Build(Ui ui)
             }
         }
 
-        using (ui.Div().Color(C.Green7))
+        using (ui.Div().Color(C.Gray6).Padding(10).Rounded(10).Margin(10).Gap(10))
         {
+            var dd = ui.CreateDropDown(selectedOption);
+            dd.Component.Option("John");
+            dd.Component.Option("Albert");
+            dd.Component.Option("Div");
+            dd.Component.Option("Size");
+            dd.Build(out selectedOption);
 
+            ui.StyledInput(ref input2);
         }
     }
 }