Steins7/canvas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix matrix transformation issues

Browse Source 
This time, the issues should be fixed for good. Everything behaves as expected.
The only issue remaining is that of the text sprite not having the right size
This commit is contained in:
Steins7 2024-02-25 23:13:41 +01:00 committed by Steins7
parent f6e0619be0
commit 1d4de23391
3 changed files with 29 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/main.rs
View File

@ -64,7 +64,8 @@ impl Application<ExampleState> for ExampleApp {
.unwrap();
let mut tex_sprite = canvas.create_texture_sprite(Size {w: 1280, h: 720});
tex_sprite.set_texture(texture.clone(), Some(Position {x: 0, y: 0}), 1.0);
tex_sprite.set_position(Position {x: 1280/2, y: 720/2});
tex_sprite.set_center(Position {x:-1280/2, y:-720/2});
tex_sprite.set_position(Position {x: 0, y: 0});
let mut sub_sprite = canvas.create_texture_sprite(Size {w: 100, h: 100});
sub_sprite.set_texture(texture.clone(), Some(Position {x: 0, y: 0}), 1.0);
@ -73,13 +74,13 @@ impl Application<ExampleState> for ExampleApp {
let mut sub_sprite2 = canvas.create_texture_sprite(Size {w: 200, h: 200});
sub_sprite2.set_texture(texture.clone(), Some(Position {x: 100, y: 0}), 1.0);
sub_sprite2.set_center(Position {x:-100, y:100});
sub_sprite2.set_center(Position {x:100, y:100});
sub_sprite2.set_rotation(0.0);
sub_sprite2.set_position(Position {x: 0, y: 0});
let mut txt_sprite = canvas.create_text_sprite("00", Size {w: 100, h: 100}, 22.0);
txt_sprite.set_center(Position {x:-50, y:50});
txt_sprite.set_position(Position {x:0, y:720});
txt_sprite.set_center(Position {x:0, y:0});
txt_sprite.set_position(Position {x:100, y:100});
txt_sprite.set_scale(1.0);
canvas.clear();
@ -114,8 +115,8 @@ impl Application<ExampleState> for ExampleApp {
state.frame_counter += 1;
if state.frame_counter >= 60 {
state.frame_counter = 0;
state.txt_sprite.set_text(&format!("{}", elapsed));
state.txt_sprite.set_text_size(elapsed as f32);
// state.txt_sprite.set_text(&format!("{}", elapsed));
// state.txt_sprite.set_text_size(elapsed as f32);
}
match state.frame_counter {
0 => state.txt_sprite.set_color(Color::RED),
@ -126,8 +127,8 @@ impl Application<ExampleState> for ExampleApp {
//state.sub_sprite.for_each(|pix| unsafe {pix.flat = pix.flat.wrapping_add(1);});
// state.last_offset += 1;
state.last_pos.x += 1;
state.last_pos.y += 1;
//state.last_pos.x += 1;
//state.last_pos.y += 1;
state.last_rot += 1.0;
debug!("{:#?}", state.last_pos);
state.tex_sprite.set_texture(state.texture.clone(), None, state.last_rot/100.0);
@ -138,6 +139,7 @@ impl Application<ExampleState> for ExampleApp {
state.sub_sprite.set_rotation(state.last_rot);
state.sub_sprite2.set_rotation(state.last_rot + 45.0);
// state.txt_sprite.set_rotation(state.last_rot);
//state.sub_sprite.set_scale(state.last_rot/1000.0);
// inputs
@ -197,9 +199,9 @@ impl Application<ExampleState> for ExampleApp {
canvas.draw(&mut state.tex_sprite);
canvas.draw(&mut state.sub_sprite);
canvas.draw(&mut state.sub_sprite2);
canvas.draw(&mut state.txt_sprite);
canvas.draw(&mut state.sub_sprite);
canvas.update();
Ok(())

19
src/renderer/matrix.rs
View File

@ -34,9 +34,10 @@ impl ModelMatrix {
-> Self
{
let surface_size: Vector2<f32> = renderer.get_surface_size().into();
//A factor 2 is used so scales and offsets can be in sync with the translations wich are
//smaller by a factor 2, and I have no idea why.
let aspect_matrix = Matrix3::from_nonuniform_scale(2.0/surface_size.x, 2.0/surface_size.y)
//A factor 2 is used since the gpu coords go from -1.0 to 1.0 while the engine coords only
//go from 0 to 1
let aspect_matrix = Matrix3::from_nonuniform_scale(2.0 / surface_size.x,
2.0 / surface_size.y)
* Matrix3::from_translation(-surface_size / 2.0);
Self {
@ -81,12 +82,16 @@ impl ModelMatrix {
if self.is_synced == false {
let position = Matrix3::from_translation(self.position.into());
//same factor 2 as for the aspect ratio and the offset, no idea why its needed either
let scale = Matrix3::from_scale(self.scale/2.0);
let scale = Matrix3::from_scale(self.scale);
let center = Matrix3::from_translation((self.center * -1.0).into());
let rotation = Matrix3::from(Basis3::from_angle_z(self.rotation));
let center = Matrix3::from_translation((self.center*-2.0).into());
let matrix = self.aspect_matrix * position * scale * rotation * center;
//to be read in reverse: scale is applied first, then the center offset is applied in
//reverse, so that it lines up with the world's origin. The rotation is then applied
//around the world's origin (and ence, the center). FInally, the translation is applied
//before the aspect matrix can move use from window-space (w x h) to normalized space
//(-1.0 to 1.0)
let matrix = self.aspect_matrix * position * rotation * center * scale;
let mat_bytes: [u8; 36] = bytemuck::bytes_of(&matrix).try_into().unwrap();

6
src/sprite/texture_sprite.rs
View File

@ -112,8 +112,10 @@ impl TextureSprite {
let y_offset = self.offset.y as f32 / size.h as f32;
// compute mesh size
let w = self.inner_size.w as f32;
let h = self.inner_size.h as f32;
//divide by 2 since the quad's coords go from -0.5 to 0.5
let w = self.inner_size.w as f32 / 2.0;
let h = self.inner_size.h as f32 / 2.0;
let mesh = [
TextureVertex {