Shader for dark-ish tint of gbc screen backgroud

Hi there I’m using Sameboy as GBC core on my Android device, which is running excellent. I’m using LCD/Samboy/ Simpletex shaders to give my pixel-like and wash out feeling.

But I also want to mimic the dark-ish (yellow or green or brown?) tint of the real GBC screen background. Simpletex is paper-ish, still not close to the real background.

I’m just wondering how can I achieve this, which parameters should I adjust.

Any suggestions will be highly appreciated.

Cheers,

1 Like

You might want to take a look at these:

2 Likes

I don’t think SImpletex will do it for you, the gameboy shader will be more like the real thing.

If you want to go through the work, I added a dmg.png to the simpletex png folder,

made a copy of the lcd-4k (lcd-2k if you don’t have a 4k monitor) and edited the preset to point to the new dmg.png.

I got this.

Here’s a shot of the gameboy shader for comparison.

4 Likes

Thank you so much. I will have a try. So I only need to add a png file without compiling with anything?

2 Likes

Yep here’s my temp copy of simpletex_dmg.slangp

shaders = "1"

shader0 = "shaders/simpletex_lcd/simpletex_lcd-4k.slang"

filter_linear0 = "true"
wrap_mode0 = "clamp_to_border"
mipmap_input0 = "false"
alias0 = ""
float_framebuffer0 = "false"
srgb_framebuffer0 = "false"

textures = "BACKGROUND"
BACKGROUND = "shaders/simpletex_lcd/png/2k/dmg.png"
BACKGROUND_linear = false

parameters = "GRID_INTENSITY;GRID_WIDTH;GRID_BIAS;DARKEN_GRID;DARKEN_COLOUR"
GRID_INTENSITY = "0.65"
GRID_WIDTH = "0.65"
GRID_BIAS = "0.6"
DARKEN_GRID = "0.0"
DARKEN_COLOUR = "0.05"

I am using a 4k monitor so I edited the 4k lcd preset. The path you want to change in either case is.

BACKGROUND = "shaders/simpletex_lcd/png/2k/dmg.png"
4 Likes

Thank you. Amazing.

Currently I’m using sameboy-lcd-gbc-color-motionblur.glslp, which including repsonse-time.glsl, sameboy-lcd.glsl and gbc-color.glsl.

I find that they are using other methods to produce the background colour beyond my mind.

Cheers,

2 Likes

You are welcome. I don’t know how beefy of a PC you’ve got, but keep an eye on the three thread links Cyber posted above. An upcoming feature in the mega bezel may give us a pretty realistic method of doing the gameboy screen.

Edit: I noticed you are using glsl shaders, the Mega Bezel linked to above is a slang shader and requires glcore or Vulkan.

I’m glad you have something working for you.

2 Likes

Thank you Duimon.

I think editing my post makes me unclear.

Using sameboy-lcd-gbc-color-motionblur.glslp doesn’t give me the real background, I’m using it not simpletex, due to I prefer its scanline style.

I find that gls file use more complex method to generate the background colour, which is beyond my normal skills.

sameboy-lcd.glsl /* SameBoy LCD shader Author: LIJI32 License: MIT

   Copyright (c) 2015-2016 Lior Halphon

   Permission is hereby granted, free of charge, to any person obtaining a copy
   of this software and associated documentation files (the "Software"), to deal
   in the Software without restriction, including without limitation the rights
   to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
   copies of the Software, and to permit persons to whom the Software is
   furnished to do so, subject to the following conditions:

   The above copyright notice and this permission notice shall be included in all
   copies or substantial portions of the Software.

   THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
   IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
   FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
   AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
   LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
   OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
   SOFTWARE.
*/

#pragma parameter COLOR_LOW "Color Low" 0.8 0.0 1.5 0.05
#pragma parameter COLOR_HIGH "Color High" 1.0 0.0 1.5 0.05
#pragma parameter SCANLINE_DEPTH "Scanline Depth" 0.1 0.0 2.0 0.05

#if defined(VERTEX)

#if __VERSION__ >= 130
#define COMPAT_VARYING out
#define COMPAT_ATTRIBUTE in
#define COMPAT_TEXTURE texture
#else
#define COMPAT_VARYING varying 
#define COMPAT_ATTRIBUTE attribute 
#define COMPAT_TEXTURE texture2D
#endif

#ifdef GL_ES
#define COMPAT_PRECISION mediump
#else
#define COMPAT_PRECISION
#endif

COMPAT_ATTRIBUTE vec4 VertexCoord;
COMPAT_ATTRIBUTE vec4 COLOR;
COMPAT_ATTRIBUTE vec4 TexCoord;
COMPAT_VARYING vec4 COL0;
COMPAT_VARYING vec4 TEX0;

uniform mat4 MVPMatrix;
uniform COMPAT_PRECISION int FrameDirection;
uniform COMPAT_PRECISION int FrameCount;
uniform COMPAT_PRECISION vec2 OutputSize;
uniform COMPAT_PRECISION vec2 TextureSize;
uniform COMPAT_PRECISION vec2 InputSize;

// compatibility #defines
#define vTexCoord TEX0.xy
#define SourceSize vec4(TextureSize, 1.0 / TextureSize) //either TextureSize or InputSize
#define OutSize vec4(OutputSize, 1.0 / OutputSize)

void main()
{
    gl_Position = MVPMatrix * VertexCoord;
    TEX0.xy = TexCoord.xy;
}

#elif defined(FRAGMENT)

#ifdef GL_ES
#ifdef GL_FRAGMENT_PRECISION_HIGH
precision highp float;
#else
precision mediump float;
#endif
#define COMPAT_PRECISION mediump
#else
#define COMPAT_PRECISION
#endif

#if __VERSION__ >= 130
#define COMPAT_VARYING in
#define COMPAT_TEXTURE texture
out COMPAT_PRECISION vec4 FragColor;
#else
#define COMPAT_VARYING varying
#define FragColor gl_FragColor
#define COMPAT_TEXTURE texture2D
#endif

uniform COMPAT_PRECISION int FrameDirection;
uniform COMPAT_PRECISION int FrameCount;
uniform COMPAT_PRECISION vec2 OutputSize;
uniform COMPAT_PRECISION vec2 TextureSize;
uniform COMPAT_PRECISION vec2 InputSize;
uniform sampler2D Texture;
COMPAT_VARYING vec4 TEX0;

// compatibility #defines
#define Source Texture
#define vTexCoord TEX0.xy

#define SourceSize vec4(TextureSize, 1.0 / TextureSize) //either TextureSize or InputSize
#define OutSize vec4(OutputSize, 1.0 / OutputSize)

#ifdef PARAMETER_UNIFORM
uniform COMPAT_PRECISION float COLOR_LOW;
uniform COMPAT_PRECISION float COLOR_HIGH;
uniform COMPAT_PRECISION float SCANLINE_DEPTH;
#else
#define COLOR_LOW 0.8
#define COLOR_HIGH 1.0
#define SCANLINE_DEPTH 0.1
#endif

void main()
{
    vec2 pos = fract(vTexCoord * SourceSize.xy);
    vec2 sub_pos = fract(vTexCoord * SourceSize.xy * 6.0);
    
    vec4 center = COMPAT_TEXTURE(Source, vTexCoord);
    vec4 left = COMPAT_TEXTURE(Source, vTexCoord - vec2(1.0 / SourceSize.x, 0.0));
    vec4 right = COMPAT_TEXTURE(Source, vTexCoord + vec2(1.0 / SourceSize.x, 0.0));
    
    if (pos.y < 1.0 / 6.0) {
        center = mix(center, COMPAT_TEXTURE(Source, vTexCoord + vec2(0.0, -1.0 / SourceSize.y)), 0.5 - sub_pos.y / 2.0);
        left =   mix(left,   COMPAT_TEXTURE(Source, vTexCoord + vec2(-1.0 / SourceSize.x, -1.0 / SourceSize.y)), 0.5 - sub_pos.y / 2.0);
        right =  mix(right,  COMPAT_TEXTURE(Source, vTexCoord + vec2( 1.0 / SourceSize.x, -1.0 / SourceSize.y)), 0.5 - sub_pos.y / 2.0);
        center *= sub_pos.y * SCANLINE_DEPTH + (1.0 - SCANLINE_DEPTH);
        left *= sub_pos.y * SCANLINE_DEPTH + (1.0 - SCANLINE_DEPTH);
        right *= sub_pos.y * SCANLINE_DEPTH + (1.0 - SCANLINE_DEPTH);
    }
    else if (pos.y > 5.0 / 6.0) {
        center = mix(center, COMPAT_TEXTURE(Source, vTexCoord + vec2(0, 1.0 / SourceSize.y)), sub_pos.y / 2.0);
        left =   mix(left,   COMPAT_TEXTURE(Source, vTexCoord + vec2(-1.0 / SourceSize.x, 1.0 / SourceSize.y)), sub_pos.y / 2.0);
        right =  mix(right,  COMPAT_TEXTURE(Source, vTexCoord + vec2( 1.0 / SourceSize.x, 1.0 / SourceSize.y)), sub_pos.y / 2.0);
        center *= (1.0 - sub_pos.y) * SCANLINE_DEPTH + (1.0 - SCANLINE_DEPTH);
        left *= (1.0 - sub_pos.y) * SCANLINE_DEPTH + (1.0 - SCANLINE_DEPTH);
        right *= (1.0 - sub_pos.y) * SCANLINE_DEPTH + (1.0 - SCANLINE_DEPTH);
    }
    
    
    vec4 midleft = mix(left, center, 0.5);
    vec4 midright = mix(right, center, 0.5);
    
    vec4 ret;
    if (pos.x < 1.0 / 6.0) {
        ret = mix(vec4(COLOR_HIGH * center.r, COLOR_LOW * center.g, COLOR_HIGH * left.b, 1.0),
                  vec4(COLOR_HIGH * center.r, COLOR_LOW * center.g, COLOR_LOW  * left.b, 1.0),
                  sub_pos.x);
    }
    else if (pos.x < 2.0 / 6.0) {
        ret = mix(vec4(COLOR_HIGH * center.r, COLOR_LOW  * center.g, COLOR_LOW * left.b, 1.0),
                  vec4(COLOR_HIGH * center.r, COLOR_HIGH * center.g, COLOR_LOW * midleft.b, 1.0),
                  sub_pos.x);
    }
    else if (pos.x < 3.0 / 6.0) {
        ret = mix(vec4(COLOR_HIGH * center.r  , COLOR_HIGH * center.g, COLOR_LOW * midleft.b, 1.0),
                  vec4(COLOR_LOW  * midright.r, COLOR_HIGH * center.g, COLOR_LOW * center.b, 1.0),
                  sub_pos.x);
    }
    else if (pos.x < 4.0 / 6.0) {
        ret = mix(vec4(COLOR_LOW * midright.r, COLOR_HIGH * center.g , COLOR_LOW  * center.b, 1.0),
                  vec4(COLOR_LOW * right.r   , COLOR_HIGH  * center.g, COLOR_HIGH * center.b, 1.0),
                  sub_pos.x);
    }
    else if (pos.x < 5.0 / 6.0) {
        ret = mix(vec4(COLOR_LOW * right.r, COLOR_HIGH * center.g  , COLOR_HIGH * center.b, 1.0),
                  vec4(COLOR_LOW * right.r, COLOR_LOW  * midright.g, COLOR_HIGH * center.b, 1.0),
                  sub_pos.x);
    }
    else {
        ret = mix(vec4(COLOR_LOW  * right.r, COLOR_LOW * midright.g, COLOR_HIGH * center.b, 1.0),
                  vec4(COLOR_HIGH * right.r, COLOR_LOW * right.g  ,  COLOR_HIGH * center.b, 1.0),
                  sub_pos.x);
    }
    
    FragColor = ret;
} 
#endif

gbc-color.glsl /* Shader Modified: Pokefan531 Color Mangler Author: hunterk License: Public domain */ // Shader that replicates the LCD dynamics from a GameBoy Color

// Compatibility #ifdefs needed for parameters
#ifdef GL_ES
#define COMPAT_PRECISION mediump
#else
#define COMPAT_PRECISION
#endif

// Parameter lines go here:
#pragma parameter lighten_screen "Lighten Screen" 1.0 0.0 1.0 0.05
#ifdef PARAMETER_UNIFORM
// All parameter floats need to have COMPAT_PRECISION in front of them
uniform COMPAT_PRECISION float lighten_screen;
#else
#define lighten_screen 1.0
#endif

#define target_gamma 2.2
#define display_gamma 2.2
#define sat 1.0
#define lum 0.94
#define contrast 1.0
#define blr 0.0
#define blg 0.0
#define blb 0.0
#define r 0.82
#define g 0.665
#define b 0.73
#define rg 0.125
#define rb 0.195
#define gr 0.24
#define gb 0.075
#define br -0.06
#define bg 0.21
#define overscan_percent_x 0.0
#define overscan_percent_y 0.0

#if defined(VERTEX)

#if __VERSION__ >= 130
#define COMPAT_VARYING out
#define COMPAT_ATTRIBUTE in
#define COMPAT_TEXTURE texture
#else
#define COMPAT_VARYING varying 
#define COMPAT_ATTRIBUTE attribute 
#define COMPAT_TEXTURE texture2D
#endif

#ifdef GL_ES
#define COMPAT_PRECISION mediump
#else
#define COMPAT_PRECISION
#endif

COMPAT_ATTRIBUTE vec4 VertexCoord;
COMPAT_ATTRIBUTE vec4 COLOR;
COMPAT_ATTRIBUTE vec4 TexCoord;
COMPAT_VARYING vec4 COL0;
COMPAT_VARYING vec4 TEX0;

uniform mat4 MVPMatrix;
uniform COMPAT_PRECISION int FrameDirection;
uniform COMPAT_PRECISION int FrameCount;
uniform COMPAT_PRECISION vec2 OutputSize;
uniform COMPAT_PRECISION vec2 TextureSize;
uniform COMPAT_PRECISION vec2 InputSize;

void main()
{
    gl_Position = MVPMatrix * VertexCoord;
    COL0 = COLOR;
    TEX0.xy = TexCoord.xy;
}

#elif defined(FRAGMENT)

#if __VERSION__ >= 130
#define COMPAT_VARYING in
#define COMPAT_TEXTURE texture
out vec4 FragColor;
#else
#define COMPAT_VARYING varying
#define FragColor gl_FragColor
#define COMPAT_TEXTURE texture2D
#endif

#ifdef GL_ES
#ifdef GL_FRAGMENT_PRECISION_HIGH
precision highp float;
#else
precision mediump float;
#endif
#define COMPAT_PRECISION mediump
#else
#define COMPAT_PRECISION
#endif

uniform COMPAT_PRECISION int FrameDirection;
uniform COMPAT_PRECISION int FrameCount;
uniform COMPAT_PRECISION vec2 OutputSize;
uniform COMPAT_PRECISION vec2 TextureSize;
uniform COMPAT_PRECISION vec2 InputSize;
uniform sampler2D Texture;
COMPAT_VARYING vec4 TEX0;

// compatibility #defines
#define Source Texture
#define vTexCoord TEX0.xy
#define texture(c, d) COMPAT_TEXTURE(c, d)
#define SourceSize vec4(TextureSize, 1.0 / TextureSize) //either TextureSize or InputSize
#define outsize vec4(OutputSize, 1.0 / OutputSize)

void main()
{
   vec4 screen = pow(texture(Source, vTexCoord), vec4(target_gamma + (lighten_screen * -1.0))).rgba;
   vec4 avglum = vec4(0.5);
   screen = mix(screen, avglum, (1.0 - contrast));
   
 //				r   g    b   black
mat4 color = mat4(r,  rg,  rb, 0.0,  //red channel
			   gr,  g,   gb, 0.0,  //green channel
			   br,  bg,  b,  0.0,  //blue channel
			  blr, blg, blb,    0.0); //alpha channel; these numbers do nothing for our purposes.
			  
mat4 adjust = mat4((1.0 - sat) * 0.3086 + sat, (1.0 - sat) * 0.3086, (1.0 - sat) * 0.3086, 1.0,
(1.0 - sat) * 0.6094, (1.0 - sat) * 0.6094 + sat, (1.0 - sat) * 0.6094, 1.0,
(1.0 - sat) * 0.0820, (1.0 - sat) * 0.0820, (1.0 - sat) * 0.0820 + sat, 1.0,
0.0, 0.0, 0.0, 1.0);
	color *= adjust;
	screen = clamp(screen * lum, 0.0, 1.0);
	screen = color * screen;
	FragColor = pow(screen, vec4(1.0 / display_gamma));
} 
#endif
1 Like

Yeah the code is beyond me also I’m afraid.

I get success on changing Simpletex background. But nothing be done with glsl shader :frowning:

Honestly. If you want it to look real, you can’t do better than gameboy.glsl.

The semi transparent light pixels, the pixel drop shadows, it is really nice! :star_struck:

2 Likes

I played around the shaders on my PC and my gpd xd plus, and find the monitor quality itself will also affect the final result :worried:

On my gpd xd plus, I need to turn on sameboy’s emulate hardware to get the most accurate color, but on my pc, I need to turn it off.