deno_sdl2 icon indicating copy to clipboard operation
deno_sdl2 copied to clipboard

How do I render font correctly?

Open nickguimond opened this issue 6 months ago • 1 comments

import { 
    Color,
    EventType, 
    Rect, 
    WindowBuilder 
} from "jsr:@divy/sdl2";

const window = new WindowBuilder(
  "Hello World",
  1000,
  500,
).build();

const canvas = window.canvas();

const font = canvas.loadFont('./fonts/Roboto-Regular.ttf', 16);
const whiteForegroundColor = new Color(255, 255, 255, 255);
const fontTexture = font.renderBlended('Hello World', whiteForegroundColor);


const creator = canvas.textureCreator();
const textTexture = creator.createTextureFromSurface(fontTexture);

const {w, h} = textTexture.query();

const destRect = new Rect(20, 20, w, h);

const frame = () => {
    canvas.setDrawColor(255, 255, 255, 255); // Set background to white
    canvas.clear();
    canvas.copy(textTexture, undefined, destRect);
    canvas.present();
}

for await (const event of window.events()) {
  switch (event.type) {
    case EventType.Draw:
      frame();
      break;
    case EventType.Quit:
      Deno.exit(0);
      break;
    default:
      break;
  }
}

Given this minimal example ^ I get this as a result.. image

Where the text is super faint and I cant seem to figure out how to fix it. All the other 'game' showcase repos* don't use font and a couple of them have it commented out in the code. So I'm not sure if I'm really in the right direction or just trying to use a feature that's not really supported yet?

Running on Apple M2 FWIW *https://github.com/dhairy-online/dino-deno *https://github.com/dhairy-online/flappybird *https://github.com/load1n9/caviar

nickguimond avatar Aug 31 '24 21:08 nickguimond