1
0
mirror of https://github.com/emilk/egui.git synced 2026-08-31 13:50:04 -04:00

Improve text redering and do all color operation in gamma space (#2071)

This commit is contained in:
Emil Ernerfeldt
2022-09-24 17:53:11 +02:00
committed by GitHub
parent 29fa63317e
commit 4ac1e28eae
36 changed files with 468 additions and 733 deletions

View File

@@ -8,7 +8,6 @@ use {
glium::{
implement_vertex,
index::PrimitiveType,
program,
texture::{self, srgb_texture2d::SrgbTexture2d},
uniform,
uniforms::{MagnifySamplerFilter, SamplerWrapFunction},
@@ -26,31 +25,77 @@ pub struct Painter {
next_native_tex_id: u64,
}
fn create_program(
facade: &dyn glium::backend::Facade,
vertex_shader: &str,
fragment_shader: &str,
) -> glium::program::Program {
let input = glium::program::ProgramCreationInput::SourceCode {
vertex_shader,
tessellation_control_shader: None,
tessellation_evaluation_shader: None,
geometry_shader: None,
fragment_shader,
transform_feedback_varyings: None,
outputs_srgb: true,
uses_point_size: false,
};
glium::program::Program::new(facade, input)
.unwrap_or_else(|err| panic!("Failed to compile shader: {}", err))
}
impl Painter {
pub fn new(facade: &dyn glium::backend::Facade) -> Painter {
use glium::CapabilitiesSource as _;
let max_texture_side = facade.get_capabilities().max_texture_size as _;
let program = program! {
facade,
120 => {
vertex: include_str!("shader/vertex_120.glsl"),
fragment: include_str!("shader/fragment_120.glsl"),
},
140 => {
vertex: include_str!("shader/vertex_140.glsl"),
fragment: include_str!("shader/fragment_140.glsl"),
},
100 es => {
vertex: include_str!("shader/vertex_100es.glsl"),
fragment: include_str!("shader/fragment_100es.glsl"),
},
300 es => {
vertex: include_str!("shader/vertex_300es.glsl"),
fragment: include_str!("shader/fragment_300es.glsl"),
},
}
.expect("Failed to compile shader");
let program = if facade
.get_context()
.is_glsl_version_supported(&glium::Version(glium::Api::Gl, 1, 4))
{
eprintln!("Using GL 1.4");
create_program(
facade,
include_str!("shader/vertex_140.glsl"),
include_str!("shader/fragment_140.glsl"),
)
} else if facade
.get_context()
.is_glsl_version_supported(&glium::Version(glium::Api::Gl, 1, 2))
{
eprintln!("Using GL 1.2");
create_program(
facade,
include_str!("shader/vertex_120.glsl"),
include_str!("shader/fragment_120.glsl"),
)
} else if facade
.get_context()
.is_glsl_version_supported(&glium::Version(glium::Api::GlEs, 3, 0))
{
eprintln!("Using GL ES 3.0");
create_program(
facade,
include_str!("shader/vertex_300es.glsl"),
include_str!("shader/fragment_300es.glsl"),
)
} else if facade
.get_context()
.is_glsl_version_supported(&glium::Version(glium::Api::GlEs, 1, 0))
{
eprintln!("Using GL ES 1.0");
create_program(
facade,
include_str!("shader/vertex_100es.glsl"),
include_str!("shader/fragment_100es.glsl"),
)
} else {
panic!(
"Failed to find a compatible shader for OpenGL version {:?}",
facade.get_version()
)
};
Painter {
max_texture_side,
@@ -236,13 +281,10 @@ impl Painter {
);
image.pixels.iter().map(|color| color.to_tuple()).collect()
}
egui::ImageData::Font(image) => {
let gamma = 1.0;
image
.srgba_pixels(gamma)
.map(|color| color.to_tuple())
.collect()
}
egui::ImageData::Font(image) => image
.srgba_pixels(None)
.map(|color| color.to_tuple())
.collect(),
};
let glium_image = glium::texture::RawImage2d {
data: std::borrow::Cow::Owned(pixels),

View File

@@ -2,7 +2,7 @@
precision mediump float;
uniform sampler2D u_sampler;
varying vec4 v_rgba;
varying vec4 v_rgba_gamma; // 0-1 gamma sRGBA
varying vec2 v_tc;
// 0-255 sRGB from 0-1 linear
@@ -30,16 +30,9 @@ vec4 linear_from_srgba(vec4 srgba) {
}
void main() {
// We must decode the colors, since WebGL doesn't come with sRGBA textures:
vec4 texture_rgba = linear_from_srgba(texture2D(u_sampler, v_tc) * 255.0);
// WebGL doesn't come with sRGBA textures:
vec4 texture_in_gamma = texture2D(u_sampler, v_tc);
/// Multiply vertex color with texture color (in linear space).
gl_FragColor = v_rgba * texture_rgba;
// We must gamma-encode again since WebGL doesn't support linear blending in the framebuffer.
gl_FragColor = srgba_from_linear(v_rgba * texture_rgba) / 255.0;
// WebGL doesn't support linear blending in the framebuffer,
// so we apply this hack to at least get a bit closer to the desired blending:
gl_FragColor.a = pow(gl_FragColor.a, 1.6); // Empiric nonsense
// Multiply vertex color with texture color (in gamma space).
gl_FragColor = v_rgba_gamma * texture_in_gamma;
}

View File

@@ -1,11 +1,31 @@
#version 120
uniform sampler2D u_sampler;
varying vec4 v_rgba;
varying vec4 v_rgba_gamma; // 0-1 gamma sRGBA
varying vec2 v_tc;
void main() {
// The texture sampler is sRGB aware, and glium already expects linear rgba output
// so no need for any sRGB conversions here:
gl_FragColor = v_rgba * texture2D(u_sampler, v_tc);
// 0-255 sRGB from 0-1 linear
vec3 srgb_from_linear(vec3 rgb) {
bvec3 cutoff = lessThan(rgb, vec3(0.0031308));
vec3 lower = rgb * vec3(3294.6);
vec3 higher = vec3(269.025) * pow(rgb, vec3(1.0 / 2.4)) - vec3(14.025);
return mix(higher, lower, vec3(cutoff));
}
// 0-255 sRGBA from 0-1 linear
vec4 srgba_from_linear(vec4 rgba) {
return vec4(srgb_from_linear(rgba.rgb), 255.0 * rgba.a);
}
// 0-1 gamma from 0-1 linear
vec4 gamma_from_linear_rgba(vec4 linear_rgba) {
return vec4(srgb_from_linear(linear_rgba.rgb) / 255.0, linear_rgba.a);
}
void main() {
// The texture is set up with `SRGB8_ALPHA8`
vec4 texture_in_gamma = gamma_from_linear_rgba(texture2D(u_sampler, v_tc));
// Multiply vertex color with texture color (in gamma space).
gl_FragColor = v_rgba_gamma * texture_in_gamma;
}

View File

@@ -1,12 +1,32 @@
#version 140
uniform sampler2D u_sampler;
in vec4 v_rgba;
in vec4 v_rgba_gamma;
in vec2 v_tc;
out vec4 f_color;
void main() {
// The texture sampler is sRGB aware, and glium already expects linear rgba output
// so no need for any sRGB conversions here:
f_color = v_rgba * texture(u_sampler, v_tc);
// 0-255 sRGB from 0-1 linear
vec3 srgb_from_linear(vec3 rgb) {
bvec3 cutoff = lessThan(rgb, vec3(0.0031308));
vec3 lower = rgb * vec3(3294.6);
vec3 higher = vec3(269.025) * pow(rgb, vec3(1.0 / 2.4)) - vec3(14.025);
return mix(higher, lower, vec3(cutoff));
}
// 0-255 sRGBA from 0-1 linear
vec4 srgba_from_linear(vec4 rgba) {
return vec4(srgb_from_linear(rgba.rgb), 255.0 * rgba.a);
}
// 0-1 gamma from 0-1 linear
vec4 gamma_from_linear_rgba(vec4 linear_rgba) {
return vec4(srgb_from_linear(linear_rgba.rgb) / 255.0, linear_rgba.a);
}
void main() {
// The texture is set up with `SRGB8_ALPHA8`
vec4 texture_in_gamma = gamma_from_linear_rgba(texture(u_sampler, v_tc));
// Multiply vertex color with texture color (in gamma space).
f_color = v_rgba_gamma * texture_in_gamma;
}

View File

@@ -2,7 +2,7 @@
precision mediump float;
uniform sampler2D u_sampler;
varying vec4 v_rgba;
varying vec4 v_rgba_gamma; // 0-1 gamma sRGBA
varying vec2 v_tc;
// 0-255 sRGB from 0-1 linear
@@ -13,21 +13,20 @@ vec3 srgb_from_linear(vec3 rgb) {
return mix(higher, lower, vec3(cutoff));
}
// 0-255 sRGBA from 0-1 linear
vec4 srgba_from_linear(vec4 rgba) {
return vec4(srgb_from_linear(rgba.rgb), 255.0 * rgba.a);
}
void main() {
// The texture is set up with `SRGB8_ALPHA8`, so no need to decode here!
vec4 texture_rgba = texture2D(u_sampler, v_tc);
/// Multiply vertex color with texture color (in linear space).
gl_FragColor = v_rgba * texture_rgba;
// We must gamma-encode again since WebGL doesn't support linear blending in the framebuffer.
gl_FragColor = srgba_from_linear(v_rgba * texture_rgba) / 255.0;
// WebGL doesn't support linear blending in the framebuffer,
// so we apply this hack to at least get a bit closer to the desired blending:
gl_FragColor.a = pow(gl_FragColor.a, 1.6); // Empiric nonsense
// 0-1 gamma from 0-1 linear
vec4 gamma_from_linear_rgba(vec4 linear_rgba) {
return vec4(srgb_from_linear(linear_rgba.rgb) / 255.0, linear_rgba.a);
}
void main() {
// The texture is set up with `SRGB8_ALPHA8`
vec4 texture_in_gamma = gamma_from_linear_rgba(texture2D(u_sampler, v_tc));
// Multiply vertex color with texture color (in gamma space).
gl_FragColor = v_rgba_gamma * texture_in_gamma;
}

View File

@@ -5,28 +5,15 @@ uniform vec2 u_screen_size;
attribute vec2 a_pos;
attribute vec2 a_tc;
attribute vec4 a_srgba;
varying vec4 v_rgba;
varying vec4 v_rgba_gamma; // 0-1 gamma sRGBA
varying vec2 v_tc;
// 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, vec3(cutoff));
}
vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
}
void main() {
gl_Position = vec4(
2.0 * a_pos.x / u_screen_size.x - 1.0,
1.0 - 2.0 * a_pos.y / u_screen_size.y,
0.0,
1.0);
// egui encodes vertex colors in gamma spaces, so we must decode the colors here:
v_rgba = linear_from_srgba(a_srgba);
v_rgba_gamma = a_srgba / 255.0;
v_tc = a_tc;
}

View File

@@ -4,28 +4,15 @@ uniform vec2 u_screen_size;
attribute vec2 a_pos;
attribute vec4 a_srgba; // 0-255 sRGB
attribute vec2 a_tc;
varying vec4 v_rgba;
varying vec4 v_rgba_gamma; // 0-1 gamma sRGBA
varying vec2 v_tc;
// 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, vec3(cutoff));
}
vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
}
void main() {
gl_Position = vec4(
2.0 * a_pos.x / u_screen_size.x - 1.0,
1.0 - 2.0 * a_pos.y / u_screen_size.y,
0.0,
1.0);
// egui encodes vertex colors in gamma spaces, so we must decode the colors here:
v_rgba = linear_from_srgba(a_srgba);
v_rgba_gamma = a_srgba / 255.0;
v_tc = a_tc;
}

View File

@@ -4,28 +4,15 @@ uniform vec2 u_screen_size;
in vec2 a_pos;
in vec4 a_srgba; // 0-255 sRGB
in vec2 a_tc;
out vec4 v_rgba;
out vec4 v_rgba_gamma;
out vec2 v_tc;
// 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, cutoff);
}
vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
}
void main() {
gl_Position = vec4(
2.0 * a_pos.x / u_screen_size.x - 1.0,
1.0 - 2.0 * a_pos.y / u_screen_size.y,
0.0,
1.0);
// egui encodes vertex colors in gamma spaces, so we must decode the colors here:
v_rgba = linear_from_srgba(a_srgba);
v_rgba_gamma = a_srgba / 255.0;
v_tc = a_tc;
}

View File

@@ -5,28 +5,15 @@ uniform vec2 u_screen_size;
attribute vec2 a_pos;
attribute vec2 a_tc;
attribute vec4 a_srgba;
varying vec4 v_rgba;
varying vec4 v_rgba_gamma; // 0-1 gamma sRGBA
varying vec2 v_tc;
// 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, vec3(cutoff));
}
vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
}
void main() {
gl_Position = vec4(
2.0 * a_pos.x / u_screen_size.x - 1.0,
1.0 - 2.0 * a_pos.y / u_screen_size.y,
0.0,
1.0);
// egui encodes vertex colors in gamma spaces, so we must decode the colors here:
v_rgba = linear_from_srgba(a_srgba);
v_rgba_gamma = a_srgba / 255.0;
v_tc = a_tc;
}