Merge pull request #2334 from DKolter/image-rotation

Adding feature: Image rotation
This commit is contained in:
Héctor Ramón 2024-05-03 07:31:34 +02:00 committed by GitHub
commit 1cefe6be21
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
26 changed files with 697 additions and 111 deletions

View file

@ -8,7 +8,8 @@ use crate::core::mouse;
use crate::core::renderer;
use crate::core::widget::Tree;
use crate::core::{
ContentFit, Element, Layout, Length, Rectangle, Size, Vector, Widget,
ContentFit, Element, Layout, Length, Point, Rectangle, Rotation, Size,
Vector, Widget,
};
pub use image::{FilterMethod, Handle};
@ -36,6 +37,7 @@ pub struct Image<Handle> {
height: Length,
content_fit: ContentFit,
filter_method: FilterMethod,
rotation: Rotation,
}
impl<Handle> Image<Handle> {
@ -45,8 +47,9 @@ impl<Handle> Image<Handle> {
handle: handle.into(),
width: Length::Shrink,
height: Length::Shrink,
content_fit: ContentFit::Contain,
content_fit: ContentFit::default(),
filter_method: FilterMethod::default(),
rotation: Rotation::default(),
}
}
@ -75,6 +78,12 @@ impl<Handle> Image<Handle> {
self.filter_method = filter_method;
self
}
/// Applies the given [`Rotation`] to the [`Image`].
pub fn rotation(mut self, rotation: impl Into<Rotation>) -> Self {
self.rotation = rotation.into();
self
}
}
/// Computes the layout of an [`Image`].
@ -85,22 +94,24 @@ pub fn layout<Renderer, Handle>(
width: Length,
height: Length,
content_fit: ContentFit,
rotation: Rotation,
) -> layout::Node
where
Renderer: image::Renderer<Handle = Handle>,
{
// The raw w/h of the underlying image
let image_size = {
let Size { width, height } = renderer.measure_image(handle);
let image_size = renderer.measure_image(handle);
let image_size =
Size::new(image_size.width as f32, image_size.height as f32);
Size::new(width as f32, height as f32)
};
// The rotated size of the image
let rotated_size = rotation.apply(image_size);
// The size to be available to the widget prior to `Shrink`ing
let raw_size = limits.resolve(width, height, image_size);
let raw_size = limits.resolve(width, height, rotated_size);
// The uncropped size of the image when fit to the bounds above
let full_size = content_fit.fit(image_size, raw_size);
let full_size = content_fit.fit(rotated_size, raw_size);
// Shrink the widget to fit the resized image, if requested
let final_size = Size {
@ -124,32 +135,44 @@ pub fn draw<Renderer, Handle>(
handle: &Handle,
content_fit: ContentFit,
filter_method: FilterMethod,
rotation: Rotation,
) where
Renderer: image::Renderer<Handle = Handle>,
Handle: Clone,
{
let Size { width, height } = renderer.measure_image(handle);
let image_size = Size::new(width as f32, height as f32);
let rotated_size = rotation.apply(image_size);
let bounds = layout.bounds();
let adjusted_fit = content_fit.fit(image_size, bounds.size());
let adjusted_fit = content_fit.fit(rotated_size, bounds.size());
let scale = Vector::new(
adjusted_fit.width / rotated_size.width,
adjusted_fit.height / rotated_size.height,
);
let final_size = image_size * scale;
let position = match content_fit {
ContentFit::None => Point::new(
bounds.x + (rotated_size.width - adjusted_fit.width) / 2.0,
bounds.y + (rotated_size.height - adjusted_fit.height) / 2.0,
),
_ => Point::new(
bounds.center_x() - final_size.width / 2.0,
bounds.center_y() - final_size.height / 2.0,
),
};
let drawing_bounds = Rectangle::new(position, final_size);
let render = |renderer: &mut Renderer| {
let offset = Vector::new(
(bounds.width - adjusted_fit.width).max(0.0) / 2.0,
(bounds.height - adjusted_fit.height).max(0.0) / 2.0,
);
let drawing_bounds = Rectangle {
width: adjusted_fit.width,
height: adjusted_fit.height,
..bounds
};
renderer.draw_image(
handle.clone(),
filter_method,
drawing_bounds + offset,
drawing_bounds,
rotation.radians(),
);
};
@ -187,6 +210,7 @@ where
self.width,
self.height,
self.content_fit,
self.rotation,
)
}
@ -206,6 +230,7 @@ where
&self.handle,
self.content_fit,
self.filter_method,
self.rotation,
);
}
}

View file

@ -6,8 +6,8 @@ use crate::core::mouse;
use crate::core::renderer;
use crate::core::widget::tree::{self, Tree};
use crate::core::{
Clipboard, Element, Layout, Length, Pixels, Point, Rectangle, Shell, Size,
Vector, Widget,
Clipboard, Element, Layout, Length, Pixels, Point, Radians, Rectangle,
Shell, Size, Vector, Widget,
};
/// A frame that displays an image with the ability to zoom in/out and pan.
@ -341,6 +341,7 @@ where
y: bounds.y,
..Rectangle::with_size(image_size)
},
Radians(0.0),
);
});
});

View file

@ -5,8 +5,8 @@ use crate::core::renderer;
use crate::core::svg;
use crate::core::widget::Tree;
use crate::core::{
Color, ContentFit, Element, Layout, Length, Rectangle, Size, Theme, Vector,
Widget,
Color, ContentFit, Element, Layout, Length, Point, Rectangle, Rotation,
Size, Theme, Vector, Widget,
};
use std::path::PathBuf;
@ -29,6 +29,7 @@ where
height: Length,
content_fit: ContentFit,
class: Theme::Class<'a>,
rotation: Rotation,
}
impl<'a, Theme> Svg<'a, Theme>
@ -43,6 +44,7 @@ where
height: Length::Shrink,
content_fit: ContentFit::Contain,
class: Theme::default(),
rotation: Rotation::default(),
}
}
@ -95,6 +97,12 @@ where
self.class = class.into();
self
}
/// Applies the given [`Rotation`] to the [`Svg`].
pub fn rotation(mut self, rotation: impl Into<Rotation>) -> Self {
self.rotation = rotation.into();
self
}
}
impl<'a, Message, Theme, Renderer> Widget<Message, Theme, Renderer>
@ -120,11 +128,14 @@ where
let Size { width, height } = renderer.measure_svg(&self.handle);
let image_size = Size::new(width as f32, height as f32);
// The rotated size of the svg
let rotated_size = self.rotation.apply(image_size);
// The size to be available to the widget prior to `Shrink`ing
let raw_size = limits.resolve(self.width, self.height, image_size);
let raw_size = limits.resolve(self.width, self.height, rotated_size);
// The uncropped size of the image when fit to the bounds above
let full_size = self.content_fit.fit(image_size, raw_size);
let full_size = self.content_fit.fit(rotated_size, raw_size);
// Shrink the widget to fit the resized image, if requested
let final_size = Size {
@ -153,35 +164,46 @@ where
) {
let Size { width, height } = renderer.measure_svg(&self.handle);
let image_size = Size::new(width as f32, height as f32);
let rotated_size = self.rotation.apply(image_size);
let bounds = layout.bounds();
let adjusted_fit = self.content_fit.fit(image_size, bounds.size());
let adjusted_fit = self.content_fit.fit(rotated_size, bounds.size());
let scale = Vector::new(
adjusted_fit.width / rotated_size.width,
adjusted_fit.height / rotated_size.height,
);
let final_size = image_size * scale;
let position = match self.content_fit {
ContentFit::None => Point::new(
bounds.x + (rotated_size.width - adjusted_fit.width) / 2.0,
bounds.y + (rotated_size.height - adjusted_fit.height) / 2.0,
),
_ => Point::new(
bounds.center_x() - final_size.width / 2.0,
bounds.center_y() - final_size.height / 2.0,
),
};
let drawing_bounds = Rectangle::new(position, final_size);
let is_mouse_over = cursor.is_over(bounds);
let status = if is_mouse_over {
Status::Hovered
} else {
Status::Idle
};
let style = theme.style(&self.class, status);
let render = |renderer: &mut Renderer| {
let offset = Vector::new(
(bounds.width - adjusted_fit.width).max(0.0) / 2.0,
(bounds.height - adjusted_fit.height).max(0.0) / 2.0,
);
let drawing_bounds = Rectangle {
width: adjusted_fit.width,
height: adjusted_fit.height,
..bounds
};
let status = if is_mouse_over {
Status::Hovered
} else {
Status::Idle
};
let style = theme.style(&self.class, status);
renderer.draw_svg(
self.handle.clone(),
style.color,
drawing_bounds + offset,
drawing_bounds,
self.rotation.radians(),
);
};