Shader #1 (My very first shader experience with raylib)
TODO: I should make new post for this
$ pwd
--> ../shader_demo
$ ls
--> main.c
$ mkdir -p resources/shader
$ vim resources/shader/first_shader.fs
> #version 330
> uniform float time_value = 0.0;
> out vec4 finalColor; // result
> void main() {
> // color is --> r,g,b,a - min: 0.0, max: 1.0
> // for this demo we changing g (green) value here
> finalColor = vec4(0.0,time_value,0.0,1.0);
> }
$ vim main.c
> // defining opengl ver.
> #define GLSL_VERSION 330
> // loading shader
> shader = LoadShader(0, TextFormat("resources/shaders/shader_demo.fs", GLSL_VERSION));
> // getting time_value from shader
> time = GetShaderLocation(shader, "time_value");
> // time_value
> time_value = 0.0f;
> // in process
> time_value+=0.01;
> if (time_value > 1) {
> time_value = 0.0f;
> }
> // now we can transfer time_value to --> shaders time_value
> // shader name, get, set, ...
> SetShaderValue(shader,time,&time_value, SHADER_UNIFORM_FLOAT);
> BeginShaderMode(shader);
> // inside this will affect
> DrawRectangle(250,120,85,85,YELLOW);
> EndShaderMode();
> // and unload shader like unloading resources
> UnloadShader(shader);
Get color from hex value
# color code --> #0000ff
# replace # -> 0x & add alpha value at the end; for max -> ff
Color col = GetColor(0x0000ffff);
Format string
TextFormat("Player: %04d", player.score);
# output for score 10 --> 0010
Compile and run [c/c++]
# c
gcc main.c -o demo -lraylib -lGL -lm -lpthread -ldl -lrt -lX11 && ./demo
# c++
g++ main.cpp -o demo -lraylib -lGL -lm -lpthread -ldl -lrt -lX11 && ./demo
Web build code snipped
#include "raylib.h"
#if defined(PLATFORM_WEB)
#include <emscripten/emscripten.h>
#endif
#define _SCREEN_W 640
#define _SCREEN_H 360
void UpdateDrawFrame(void);
int main() {
SetWindowState(FLAG_VSYNC_HINT);
InitWindow(_SCREEN_W,_SCREEN_H,"Pong");
#if defined(PLATFORM_WEB)
emscripten_set_main_loop(UpdateDrawFrame, 0, 1);
#else
SetWindowPosition(0,0); // open window top-left corner
SetTargetFPS(60);
while (!WindowShouldClose()) {
UpdateDrawFrame();
}
#endif
CloseWindow();
return 0;
}
void UpdateDrawFrame(void) {
// update & input event codes here
BeginDrawing();
ClearBackground(BLACK);
// draw codes here
DrawFPS(4,4);
EndDrawing();
}
# build & run
# if there have resources e.g font sound etc. add " --preload-file resources "
mkdir build
emcc -o build/index.html main.c -Os -Wall -I ../raylib/src \
-L ../raylib/src -s USE_GLFW=3 -s ASYNCIFY --shell-file minshell.html \
-DPLATFORM_WEB -lraylib && cd build/ && python -m http.server
4 direction movement logic(grid).
enum MOVE {UP,DOWN,LEFT,RIGHT};
Vector2 move_dir[4] = {{0,-1},{0,1},{-1,0},{1,0}};
int move_dir_size = sizeof(move_dir)/sizeof(move_dir[0]);
for (int i=0; i<move_dir_size; i++) {
move_dir[i] = Vector2Scale(move_dir[i],16);
}
// move e.g
position.x += move_dir[RIGHT].x
position.y += move_dir[RIGHT].y
Drawing pyramid with bunch of rectangles(as is pixel).
int s = 40;
int w = 10;
for (int i=1;i<=s;i+=2) {
for (int j=1; j<=i; j++) {
int x = (screen_w/2)-(s/2);
int y = (screen_h/2)-(s/2*w/2);
DrawRectangle(x-(i/2)*w+j*w,y+(i/2)*w,w,w,RED);
}
}
Marquee effect.
—– Custom font image from raylib repo: alagard.png
Font alagard = LoadFont("resources/alagard.png"); // custom font
char *intro = "HELLO WORLD!";
float scroll_speed = 1.0f;
float current_left = canvasWidth+8;
float left_corner = -(MeasureText(intro, alagard.baseSize*1.0f)-8);
// while loop...
current_left -= scroll_speed;
if (current_left <= left_corner ) {
current_left = canvasWidth+8;
}
// drawing...
DrawTextEx(alagard,intro,(Vector2){current_left,108},alagard.baseSize*1.0f,1.0f,RED);
// unload font
UnloadFont(alagard);
!drop fsp comes while recording.
3d cube on 2d canvas with rotation animation.
—– PICO8 (fake 3D?) CAD BGF 2019
float t = 0;
float rotation_speed = 0.03f;
Vector2 p[4];
// while loop
t += rotation_speed;
if (t >=1.5f) {
t = 0;
}
// drawing...
// background
Rectangle rec = {(float)128/2,(float)128/2-40,60,60};
Vector2 og = {0,0};
DrawRectanglePro(rec,og,45,BLACK);
// cube
for (int i=0; i<4; i++) {
float x = 64+cos(t+((float)i/4.0*M_PI*2))*20;
float y = 56+sin(t+((float)i/4.0*M_PI*2))*20;
p[i] = (Vector2){x,y};
}
for (int i=1; i<5; i++) {
int j = i%4+1;
DrawLine(p[i-1].x,p[i-1].y,p[i-1].x,p[i-1].y+20,RAYWHITE);
DrawLine(p[i-1].x,p[i-1].y,p[j-1].x,p[j-1].y,RAYWHITE);
DrawLine(p[i-1].x,p[i-1].y+20,p[j-1].x,p[j-1].y+20,RAYWHITE);
}
Low-res (pixel) canvas / simple setup.
—– smooth pixel-perfect camera
#include <stdio.h>
#include "raylib.h"
int main() {
const int screenWidth = 512;
const int screenHeight = 512;
const int canvasWidth = 128;
const int canvasHeight = 128;
InitWindow(screenWidth,screenHeight,"low-res");
SetWindowState(FLAG_VSYNC_HINT);
SetTargetFPS(60);
RenderTexture2D target = LoadRenderTexture(canvasWidth,canvasHeight);
Rectangle source = {0,-canvasHeight,target.texture.width,-target.texture.height};
Rectangle dest = {0,0,screenWidth,screenHeight};
Camera2D camera = {0};
camera.zoom = 1.0f;
while (!WindowShouldClose()) {
BeginTextureMode(target);
ClearBackground(RAYWHITE);
BeginMode2D(camera);
DrawFPS(4,4);
// drawing test
Rectangle rec = {(float)128/2,(float)128/2-40,60,60};
Vector2 og = {0,0};
DrawRectanglePro(rec,og,45,BLACK);
EndMode2D();
EndTextureMode();
BeginDrawing();
DrawTexturePro(target.texture,source,dest,(Vector2){0,0},0,WHITE);
EndDrawing();
}
UnloadRenderTexture(target);
CloseWindow();
return 0;
}