Drawing A Colored Shape Below A Surface With Text Colors The Outline Of The Text

[Game_Re_creation_Project]

This is a weird issue and I couldn't find a specific forum thread.

You'll notice in the video below that there is a blinking rectangle being drawn below a surface on the thumb of a scrollbar user control. For some reason, the outline of the text being drawn to the surface of the thumb button has its text outline (anti-aliasing) colored whenever the rectangle is drawn. I was not expecting this to occur and am wondering if it is normal behavior.

//...
#region Bar Button

if (self.struct_scrollBar.bar_button_exists)
{
    //Main
    if (struct_scrollBar.bar_button.button_render_button)
    {
        try
        {
            vertex_submit(struct_scrollBar.arr_v_buffers[ENUM_ScrollBar_Constituents.bar_button],
                        pr_trianglelist,
                        (sprite_exists(struct_scrollBar.bar_button.texture_sprite_index) && !struct_scrollBar.bar_button.texture_is_an_overlay && struct_scrollBar.bar_button.texture_sprite_index != noone) ? struct_scrollBar.bar_button.texture : -1);
        }
        catch (e)
        {}
    }

    //get halign and valign
    draw_set_halign(struct_scrollBar.bar_button.caption_HAlign);
    draw_set_valign(struct_scrollBar.bar_button.caption_VAlign);

    //Surface for overlay
    if surface_exists(struct_scrollBar.bar_button.overlay_surface)
    {
        
        surface_set_target(struct_scrollBar.bar_button.overlay_surface);
        //Overlay
        if (sprite_exists(struct_scrollBar.bar_button.texture_sprite_index) && struct_scrollBar.bar_button.texture_is_an_overlay && struct_scrollBar.bar_button.texture_sprite_index != noone)
        {
            try
            {
                vertex_submit(struct_scrollBar.arr_v_buffers[ENUM_ScrollBar_Constituents.bar_button_overlay],
                            pr_trianglelist,
                            struct_scrollBar.bar_button.texture);
            }
            catch (e)
            {}
        }

        draw_text_ext_color(struct_scrollBar.bar_button.caption_x1 - struct_scrollBar.bar_button.xx1 + (struct_scrollBar.bar_button.is_clicked ? 1 : 0), struct_scrollBar.bar_button.caption_y1 - struct_scrollBar.bar_button.yy1 + (struct_scrollBar.bar_button.is_clicked ? 1 : 0), struct_scrollBar.bar_button.caption_string,string_height("M"),struct_scrollBar.bar_button.caption_used_width, struct_scrollBar.fore_color, struct_scrollBar.fore_color, struct_scrollBar.fore_color, struct_scrollBar.fore_color, self.CTRL_Opacity);
        surface_reset_target();
    
//This is where the problem occurs. When the black rectangle is drawn below the surface, for some reason, the surface text's outline is made darker per the black color of the rectangle. Is this normal behavior? Please view the attached video to see an example.
//Thank you for all that you do in the GML Community!
        //Cause the bar button to blink
        //Matches HWND Controls
        if (self.struct_scrollBar.design_motif == SKEUOMORPHISM && self.struct_scrollBar.bar_button_blink) {draw_rectangle_color(struct_scrollBar.bar_button.inner_plateau_x1,struct_scrollBar.bar_button.inner_plateau_y1,struct_scrollBar.bar_button.inner_plateau_x2-1,struct_scrollBar.bar_button.inner_plateau_y2-1,c_black,c_black,c_black,c_black,false);}
        //Caption And Overlay
        draw_surface(struct_scrollBar.bar_button.overlay_surface, struct_scrollBar.bar_button.xx1, struct_scrollBar.bar_button.yy1);
        
    }
}
#endregion
//...

Video example. (Sorry for the rushed quality).
Look closely to see the darkening effect around the text.

 

[Nocturne]

You'll notice in the video below that there is a blinking rectangle being drawn below a surface on the thumb of a scrollbar user control. For some reason, the outline of the text being drawn to the surface of the thumb button has its text outline (anti-aliasing) colored whenever the rectangle is drawn. I was not expecting this to occur and am wondering if it is normal behavior.

Yes, pretty much, this is expected behavior because of the way surfaces and alpha work together... There are a number of workarounds, and which one works for you will depend on the project itself. Check the following links for more information as it's rather complex to explain in a single forum post:

Alpha and Surfaces | Blog | YoYo Games

Making top 2D games with the GameMaker: Studio game engine is easy. No code or programming required

web.archive.org

(web archive link as it appears the blog hasn't been carried over to the new YYG site)

The general workaround would be to draw to the surface ignoring the alpha, something like this:

surface_set_target(mysurface);
gpu_set_colourwriteenable(true,true,true,false)
draw_sprite(sprite1)
draw_sprite(sprite2)
gpu_set_colourwriteenable(true, true, true, true)
surface_reset_target();

However that isn't a 100% guaranteed fix and will depend on a lot of other things! Might be worthwhile checking out other topics that deal with the issue as there are a lot of them and some interesting solutions can be found:

surfaces and alpha gamemaker - Google Search