mirror of
https://github.com/emilk/egui.git
synced 2026-09-01 14:20:04 -04:00
Improve text redering and do all color operation in gamma space (#2071)
This commit is contained in:
@@ -54,4 +54,5 @@ document-features = { version = "0.2", optional = true }
|
||||
|
||||
|
||||
[dev-dependencies]
|
||||
egui_demo_lib = { version = "0.19.0", path = "../egui_demo_lib", default-features = false }
|
||||
image = { version = "0.24", default-features = false, features = ["png"] }
|
||||
|
||||
@@ -115,7 +115,7 @@ fn create_display(event_loop: &glutin::event_loop::EventLoop<()>) -> glium::Disp
|
||||
|
||||
let context_builder = glutin::ContextBuilder::new()
|
||||
.with_depth_buffer(0)
|
||||
.with_srgb(true)
|
||||
.with_srgb(false)
|
||||
.with_stencil_buffer(0)
|
||||
.with_vsync(true);
|
||||
|
||||
|
||||
@@ -10,6 +10,8 @@ fn main() {
|
||||
|
||||
let mut egui_glium = egui_glium::EguiGlium::new(&display, &event_loop);
|
||||
|
||||
let mut color_test = egui_demo_lib::ColorTest::default();
|
||||
|
||||
event_loop.run(move |event, _, control_flow| {
|
||||
let mut redraw = || {
|
||||
let mut quit = false;
|
||||
@@ -21,6 +23,12 @@ fn main() {
|
||||
quit = true;
|
||||
}
|
||||
});
|
||||
|
||||
egui::CentralPanel::default().show(egui_ctx, |ui| {
|
||||
egui::ScrollArea::vertical().show(ui, |ui| {
|
||||
color_test.ui(ui);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
*control_flow = if quit {
|
||||
@@ -93,7 +101,7 @@ fn create_display(event_loop: &glutin::event_loop::EventLoop<()>) -> glium::Disp
|
||||
|
||||
let context_builder = glutin::ContextBuilder::new()
|
||||
.with_depth_buffer(0)
|
||||
.with_srgb(true)
|
||||
.with_srgb(false)
|
||||
.with_stencil_buffer(0)
|
||||
.with_vsync(true);
|
||||
|
||||
|
||||
@@ -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),
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user