So I’ll try to summarise this to the best of my ability, as I was not able to recreate this problem in a fresh project, though that might simply be accounted for by me not remembering something.
First two images, the first is a screenshot from the editor and the second is from the build (HTML5):
,
Now it is only in one scene of mine that this happens, every other label in another scene is fine. But that is surely because I tried to have some UI render behind game objects in that specific scene. I don’t have experience in graphics programming and shaders so the way I achieved this was by slightly rearranging the render script that was provided by @britzl orthographic camera asset, it now looks like the following:
Render Script
local camera = require "orthographic.camera"
camera.ORTHOGRAPHIC_RENDER_SCRIPT_USED = true
local CLEAR_COLOR = hash("clear_color")
local IDENTITY = vmath.matrix4()
function init(self)
self.tile_pred = render.predicate({"tile"})
self.gui_pred = render.predicate({"gui"})
self.text_pred = render.predicate({"text"})
self.inventory_text_pred = render.predicate({"font"})
self.inventory_pred = render.predicate({"inventory"})
self.particle_pred = render.predicate({"particle"})
self.clear_color = vmath.vector4(0, 0, 0, 0)
self.clear_color.x = sys.get_config("render.clear_color_red", 0)
self.clear_color.y = sys.get_config("render.clear_color_green", 0)
self.clear_color.z = sys.get_config("render.clear_color_blue", 0)
self.clear_color.w = sys.get_config("render.clear_color_alpha", 0)
end
function update(self)
-- clear color
render.set_depth_mask(true)
render.clear({[render.BUFFER_COLOR_BIT] = self.clear_color, [render.BUFFER_DEPTH_BIT] = 1, [render.BUFFER_STENCIL_BIT] = 0})
render.set_depth_mask(false)
-- set default blend state
render.enable_state(render.STATE_BLEND)
render.set_blend_func(render.BLEND_SRC_ALPHA, render.BLEND_ONE_MINUS_SRC_ALPHA)
-- draw inventory in screen space using an orthographic projection
render.disable_state(render.STATE_DEPTH_TEST)
render.disable_state(render.STATE_CULL_FACE)
render.enable_state(render.STATE_STENCIL_TEST)
render.set_viewport(0, 0, render.get_window_width(), render.get_window_height())
render.set_view(IDENTITY)
render.set_projection(vmath.matrix4_orthographic(0, render.get_window_width(), 0, render.get_window_height(), -1, 1))
render.draw(self.inventory_pred)
render.draw(self.inventory_text_pred)
render.disable_state(render.STATE_STENCIL_TEST)
-- draw world per camera
local cameras = camera.get_cameras()
if #cameras > 0 then
render.disable_state(render.STATE_DEPTH_TEST)
render.disable_state(render.STATE_CULL_FACE)
render.disable_state(render.STATE_STENCIL_TEST)
for _,camera_id in ipairs(cameras) do
local viewport = camera.get_viewport(camera_id)
render.set_viewport(viewport.x, viewport.y, viewport.z, viewport.w)
render.set_view(camera.get_view(camera_id))
render.set_projection(camera.get_projection(camera_id))
render.draw(self.tile_pred)
render.draw(self.particle_pred)
render.draw_debug3d()
end
end
-- draw gui in screen space using an orthographic projection
render.disable_state(render.STATE_DEPTH_TEST)
render.disable_state(render.STATE_CULL_FACE)
render.enable_state(render.STATE_STENCIL_TEST)
render.set_viewport(0, 0, render.get_window_width(), render.get_window_height())
render.set_view(IDENTITY)
render.set_projection(vmath.matrix4_orthographic(0, render.get_window_width(), 0, render.get_window_height(), -1, 1))
render.draw(self.gui_pred)
render.draw(self.text_pred)
render.disable_state(render.STATE_STENCIL_TEST)
end
function on_message(self, message_id, message)
if message_id == CLEAR_COLOR then
self.clear_color = message.color
end
end
In this script, I created two predicates, namely font and inventory, which are meant to be rendered behind game objects. Font in this case covers all the labels as I have also created a new material for it to match the predicate, it can be viewed as analogous to the text predicate. Similarly, inventory corresponds to the GUI predicate, a new material was created here as well. But the only difference in these materials is that their tag is different to match the according render script predicates, all of the vertex programs etc. are the same as in the default font (in my case font-df) and GUI material.
All in all, I’m really unsure where this difference in transparency between editor and build stems from, I’d appreciate help in figuring this out I’ll try to provide all the information necessary.
I’m using Defold version 1.2.186 on Windows.