cosmic-text/examples/editor-libcosmic/src/text_box.rs

402 lines
13 KiB
Rust
Raw Normal View History

2022-10-24 08:56:48 -06:00
// SPDX-License-Identifier: MIT OR Apache-2.0
2022-11-09 08:03:13 -07:00
use cosmic::{
2023-06-25 12:01:18 +01:00
iced_core::{event::Status, widget::tree, *},
iced_runtime::keyboard::KeyCode,
2023-03-23 14:20:48 -06:00
theme::{Theme, ThemeType},
2022-10-18 12:07:22 -06:00
};
2023-01-04 20:03:03 -07:00
use cosmic_text::{Action, Edit, SwashCache};
use std::{cmp, sync::Mutex, time::Instant};
2022-10-18 12:07:22 -06:00
2023-03-24 07:51:31 -06:00
use crate::FONT_SYSTEM;
2022-10-18 14:35:16 -06:00
pub struct Appearance {
background_color: Option<Color>,
text_color: Color,
2022-10-18 14:35:16 -06:00
}
pub trait StyleSheet {
fn appearance(&self) -> Appearance;
}
impl StyleSheet for Theme {
fn appearance(&self) -> Appearance {
2023-03-23 14:20:48 -06:00
match self.theme_type {
2023-06-25 12:01:18 +01:00
ThemeType::Dark | ThemeType::HighContrastDark | ThemeType::Custom(_) => Appearance {
2022-10-18 14:35:16 -06:00
background_color: Some(Color::from_rgb8(0x34, 0x34, 0x34)),
text_color: Color::from_rgb8(0xFF, 0xFF, 0xFF),
2022-10-18 14:35:16 -06:00
},
2023-03-23 14:20:48 -06:00
ThemeType::Light | ThemeType::HighContrastLight => Appearance {
2022-10-18 14:35:16 -06:00
background_color: Some(Color::from_rgb8(0xFC, 0xFC, 0xFC)),
text_color: Color::from_rgb8(0x00, 0x00, 0x00),
2022-10-18 14:35:16 -06:00
},
}
}
}
pub struct TextBox<'a, Editor> {
editor: &'a Mutex<Editor>,
padding: Padding,
2022-10-18 12:07:22 -06:00
}
impl<'a, Editor> TextBox<'a, Editor> {
pub fn new(editor: &'a Mutex<Editor>) -> Self {
Self {
2022-10-31 11:24:36 -06:00
editor,
2023-06-25 12:01:18 +01:00
padding: Padding::new(0.),
}
2022-10-18 12:07:22 -06:00
}
pub fn padding<P: Into<Padding>>(mut self, padding: P) -> Self {
self.padding = padding.into();
self
}
2022-10-18 12:07:22 -06:00
}
2023-03-24 07:51:31 -06:00
pub fn text_box<'a, Editor>(editor: &'a Mutex<Editor>) -> TextBox<'a, Editor> {
2022-10-31 11:24:36 -06:00
TextBox::new(editor)
2022-10-18 12:07:22 -06:00
}
2023-03-24 07:51:31 -06:00
fn draw_pixel(
buffer: &mut [u8],
width: i32,
height: i32,
x: i32,
y: i32,
color: cosmic_text::Color,
) {
let alpha = (color.0 >> 24) & 0xFF;
if alpha == 0 {
// Do not draw if alpha is zero
return;
}
if y < 0 || y >= height {
// Skip if y out of bounds
return;
}
if x < 0 || x >= width {
// Skip if x out of bounds
return;
}
let offset = (y as usize * width as usize + x as usize) * 4;
let mut current = buffer[offset + 2] as u32
| (buffer[offset + 1] as u32) << 8
| (buffer[offset + 0] as u32) << 16
| (buffer[offset + 3] as u32) << 24;
if alpha >= 255 || current == 0 {
// Alpha is 100% or current is null, replace with no blending
current = color.0;
} else {
// Alpha blend with current value
let n_alpha = 255 - alpha;
let rb = ((n_alpha * (current & 0x00FF00FF)) + (alpha * (color.0 & 0x00FF00FF))) >> 8;
let ag = (n_alpha * ((current & 0xFF00FF00) >> 8))
+ (alpha * (0x01000000 | ((color.0 & 0x0000FF00) >> 8)));
current = (rb & 0x00FF00FF) | (ag & 0xFF00FF00);
}
buffer[offset + 2] = current as u8;
buffer[offset + 1] = (current >> 8) as u8;
buffer[offset + 0] = (current >> 16) as u8;
buffer[offset + 3] = (current >> 24) as u8;
}
impl<'a, 'editor, Editor, Message, Renderer> Widget<Message, Renderer> for TextBox<'a, Editor>
2022-10-18 12:07:22 -06:00
where
2023-06-25 12:01:18 +01:00
Renderer: cosmic::iced_core::Renderer + image::Renderer<Handle = image::Handle>,
2022-10-18 14:35:16 -06:00
Renderer::Theme: StyleSheet,
Editor: Edit,
2022-10-18 12:07:22 -06:00
{
2022-10-19 10:12:52 -06:00
fn tag(&self) -> tree::Tag {
tree::Tag::of::<State>()
}
fn state(&self) -> tree::State {
tree::State::new(State::new())
}
2022-10-18 12:07:22 -06:00
fn width(&self) -> Length {
2022-10-18 13:20:13 -06:00
Length::Fill
2022-10-18 12:07:22 -06:00
}
fn height(&self) -> Length {
2022-10-18 13:20:13 -06:00
Length::Fill
2022-10-18 12:07:22 -06:00
}
2023-01-04 20:03:03 -07:00
fn layout(&self, _renderer: &Renderer, limits: &layout::Limits) -> layout::Node {
2022-11-01 11:23:21 -07:00
let limits = limits.width(Length::Fill).height(Length::Fill);
2022-11-01 09:09:36 -06:00
//TODO: allow lazy shape
let mut editor = self.editor.lock().unwrap();
editor
.borrow_with(&mut FONT_SYSTEM.lock().unwrap())
.buffer_mut()
.shape_until(i32::max_value());
2022-11-01 09:09:36 -06:00
let mut layout_lines = 0;
for line in editor.buffer().lines.iter() {
2022-11-01 09:09:36 -06:00
match line.layout_opt() {
Some(layout) => layout_lines += layout.len(),
None => (),
}
}
2023-03-03 18:59:45 +01:00
let height = layout_lines as f32 * editor.buffer().metrics().line_height;
2022-11-01 09:09:36 -06:00
let size = Size::new(limits.max().width, height);
log::info!("size {:?}", size);
2022-11-01 11:23:21 -07:00
layout::Node::new(limits.resolve(size))
2022-10-18 12:07:22 -06:00
}
2022-10-19 09:26:43 -06:00
fn mouse_interaction(
&self,
_tree: &widget::Tree,
layout: Layout<'_>,
2023-06-25 12:01:18 +01:00
cursor_position: mouse::Cursor,
2022-10-19 09:26:43 -06:00
_viewport: &Rectangle,
_renderer: &Renderer,
) -> mouse::Interaction {
2023-06-25 12:01:18 +01:00
if cursor_position.is_over(layout.bounds()) {
2022-10-19 09:26:43 -06:00
mouse::Interaction::Text
} else {
mouse::Interaction::Idle
}
}
2022-10-18 12:07:22 -06:00
fn draw(
&self,
2022-10-27 15:17:52 -06:00
tree: &widget::Tree,
2022-10-18 12:07:22 -06:00
renderer: &mut Renderer,
2022-10-18 14:35:16 -06:00
theme: &Renderer::Theme,
2023-06-25 12:01:18 +01:00
_style: &renderer::Style,
2022-10-18 12:07:22 -06:00
layout: Layout<'_>,
2023-06-25 12:01:18 +01:00
_cursor_position: mouse::Cursor,
2022-11-01 09:09:36 -06:00
viewport: &Rectangle,
2022-10-18 12:07:22 -06:00
) {
2023-03-24 07:51:31 -06:00
let instant = Instant::now();
2022-10-27 15:17:52 -06:00
let state = tree.state.downcast_ref::<State>();
let appearance = theme.appearance();
if let Some(background_color) = appearance.background_color {
2022-10-18 14:35:16 -06:00
renderer.fill_quad(
renderer::Quad {
bounds: layout.bounds(),
2023-03-24 07:51:31 -06:00
border_radius: 0.0.into(),
2022-10-18 14:35:16 -06:00
border_width: 0.0,
border_color: Color::TRANSPARENT,
},
2023-01-04 20:03:03 -07:00
background_color,
2022-10-18 14:35:16 -06:00
);
}
2022-10-18 12:07:22 -06:00
let text_color = cosmic_text::Color::rgba(
cmp::max(0, cmp::min(255, (appearance.text_color.r * 255.0) as i32)) as u8,
cmp::max(0, cmp::min(255, (appearance.text_color.g * 255.0) as i32)) as u8,
cmp::max(0, cmp::min(255, (appearance.text_color.b * 255.0) as i32)) as u8,
cmp::max(0, cmp::min(255, (appearance.text_color.a * 255.0) as i32)) as u8,
);
2022-10-31 11:24:36 -06:00
let mut editor = self.editor.lock().unwrap();
2023-03-24 07:51:31 -06:00
let view_w = cmp::min(viewport.width as i32, layout.bounds().width as i32)
- self.padding.horizontal() as i32;
let view_h = cmp::min(viewport.height as i32, layout.bounds().height as i32)
- self.padding.vertical() as i32;
2023-06-25 12:01:18 +01:00
const SCALE_FACTOR: f64 = 1.;
let image_w = (view_w as f64 * SCALE_FACTOR) as i32;
let image_h = (view_h as f64 * SCALE_FACTOR) as i32;
let mut font_system = FONT_SYSTEM.lock().unwrap();
let mut editor = editor.borrow_with(&mut font_system);
2023-03-24 07:51:31 -06:00
// Scale metrics
let metrics = editor.buffer().metrics();
editor
.buffer_mut()
2023-06-25 12:01:18 +01:00
.set_metrics(metrics.scale(SCALE_FACTOR as f32));
2023-03-24 07:51:31 -06:00
// Set size
editor.buffer_mut().set_size(image_w as f32, image_h as f32);
2022-11-01 09:09:36 -06:00
2023-03-24 07:51:31 -06:00
// Shape and layout
editor.shape_as_needed();
2022-11-01 09:09:36 -06:00
2023-03-24 07:51:31 -06:00
// Draw to pixel buffer
let mut pixels = vec![0; image_w as usize * image_h as usize * 4];
2023-01-04 20:03:03 -07:00
editor.draw(
&mut state.cache.lock().unwrap(),
text_color,
|x, y, w, h, color| {
2023-03-24 07:51:31 -06:00
//TODO: improve performance
for row in 0..h as i32 {
for col in 0..w as i32 {
draw_pixel(&mut pixels, image_w, image_h, x + col, y + row, color);
}
2023-01-04 20:03:03 -07:00
}
},
);
2022-11-01 09:09:36 -06:00
2023-03-24 07:51:31 -06:00
// Restore original metrics
editor.buffer_mut().set_metrics(metrics);
let handle = image::Handle::from_pixels(image_w as u32, image_h as u32, pixels);
2023-01-04 20:03:03 -07:00
image::Renderer::draw(
renderer,
handle,
Rectangle::new(
layout.position() + [self.padding.left as f32, self.padding.top as f32].into(),
2023-03-24 07:51:31 -06:00
Size::new(view_w as f32, view_h as f32),
2023-01-04 20:03:03 -07:00
),
);
2022-11-01 09:09:36 -06:00
let duration = instant.elapsed();
log::debug!("redraw {}, {}: {:?}", view_w, view_h, duration);
2022-10-18 12:07:22 -06:00
}
fn on_event(
&mut self,
2022-10-19 10:12:52 -06:00
tree: &mut widget::Tree,
2022-10-18 12:07:22 -06:00
event: Event,
layout: Layout<'_>,
2023-06-25 12:01:18 +01:00
cursor_position: mouse::Cursor,
2022-10-18 12:07:22 -06:00
_renderer: &Renderer,
_clipboard: &mut dyn Clipboard,
_shell: &mut Shell<'_, Message>,
) -> Status {
2022-10-19 10:12:52 -06:00
let state = tree.state.downcast_mut::<State>();
2022-10-31 11:24:36 -06:00
let mut editor = self.editor.lock().unwrap();
let mut font_system = FONT_SYSTEM.lock().unwrap();
let mut editor = editor.borrow_with(&mut font_system);
2022-10-18 12:07:22 -06:00
let mut status = Status::Ignored;
2022-10-18 12:07:22 -06:00
match event {
2023-06-25 12:01:18 +01:00
Event::Keyboard(keyboard::Event::KeyPressed { key_code, .. }) => match key_code {
2022-10-19 10:12:52 -06:00
KeyCode::Left => {
2022-10-31 11:24:36 -06:00
editor.action(Action::Left);
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
2022-10-19 10:12:52 -06:00
KeyCode::Right => {
2022-10-31 11:24:36 -06:00
editor.action(Action::Right);
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
2022-10-19 10:12:52 -06:00
KeyCode::Up => {
2022-10-31 11:24:36 -06:00
editor.action(Action::Up);
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
2022-10-19 10:12:52 -06:00
KeyCode::Down => {
2022-10-31 11:24:36 -06:00
editor.action(Action::Down);
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
2022-10-19 11:08:15 -06:00
KeyCode::Home => {
2022-10-31 11:24:36 -06:00
editor.action(Action::Home);
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
2022-10-19 11:08:15 -06:00
KeyCode::End => {
2022-10-31 11:24:36 -06:00
editor.action(Action::End);
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
2022-10-19 10:12:52 -06:00
KeyCode::PageUp => {
2022-10-31 11:24:36 -06:00
editor.action(Action::PageUp);
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
2022-10-19 10:12:52 -06:00
KeyCode::PageDown => {
2022-10-31 11:24:36 -06:00
editor.action(Action::PageDown);
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
KeyCode::Escape => {
editor.action(Action::Escape);
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
2022-10-19 11:33:35 -06:00
KeyCode::Enter => {
2022-10-31 11:24:36 -06:00
editor.action(Action::Enter);
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
2022-10-19 11:33:35 -06:00
KeyCode::Backspace => {
2022-10-31 11:24:36 -06:00
editor.action(Action::Backspace);
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
2022-10-19 11:33:35 -06:00
KeyCode::Delete => {
2022-10-31 11:24:36 -06:00
editor.action(Action::Delete);
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
_ => (),
2022-10-19 10:12:52 -06:00
},
2023-06-25 12:01:18 +01:00
Event::Keyboard(keyboard::Event::CharacterReceived(character)) => {
2022-10-31 11:24:36 -06:00
editor.action(Action::Insert(character));
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
2023-06-25 12:01:18 +01:00
Event::Mouse(mouse::Event::ButtonPressed(mouse::Button::Left)) => {
if let Some(position_in) = cursor_position.position_in(layout.bounds()) {
2022-10-31 11:24:36 -06:00
editor.action(Action::Click {
2023-06-25 12:01:18 +01:00
x: position_in.x as i32 - self.padding.left as i32,
y: position_in.y as i32 - self.padding.top as i32,
2022-10-19 10:12:52 -06:00
});
state.is_dragging = true;
status = Status::Captured;
2022-10-19 10:12:52 -06:00
}
2023-01-04 20:03:03 -07:00
}
2023-06-25 12:01:18 +01:00
Event::Mouse(mouse::Event::ButtonReleased(mouse::Button::Left)) => {
2022-10-19 10:12:52 -06:00
state.is_dragging = false;
status = Status::Captured;
2023-01-04 20:03:03 -07:00
}
2023-06-25 12:01:18 +01:00
Event::Mouse(mouse::Event::CursorMoved { position }) => {
2022-10-19 10:12:52 -06:00
if state.is_dragging {
2022-10-31 11:24:36 -06:00
editor.action(Action::Drag {
2023-06-25 12:01:18 +01:00
x: (position.x - layout.bounds().x) as i32 - self.padding.left as i32,
y: (position.y - layout.bounds().y) as i32 - self.padding.top as i32,
2022-10-19 10:12:52 -06:00
});
status = Status::Captured;
2022-10-18 13:27:58 -06:00
}
2023-01-04 20:03:03 -07:00
}
2023-06-25 12:01:18 +01:00
Event::Mouse(mouse::Event::WheelScrolled { delta }) => match delta {
mouse::ScrollDelta::Lines { y, .. } => {
2023-03-24 07:51:31 -06:00
editor.action(Action::Scroll {
lines: (-y * 6.0) as i32,
});
status = Status::Captured;
}
_ => (),
},
2023-01-04 20:03:03 -07:00
_ => (),
2022-10-18 12:07:22 -06:00
}
2022-10-19 10:12:52 -06:00
status
2022-10-18 12:07:22 -06:00
}
}
2023-03-24 07:51:31 -06:00
impl<'a, 'editor, Editor, Message, Renderer> From<TextBox<'a, Editor>>
for Element<'a, Message, Renderer>
2022-10-18 12:07:22 -06:00
where
Renderer: renderer::Renderer + image::Renderer<Handle = image::Handle>,
2022-10-18 14:35:16 -06:00
Renderer::Theme: StyleSheet,
Editor: Edit,
2022-10-18 12:07:22 -06:00
{
fn from(text_box: TextBox<'a, Editor>) -> Self {
2022-10-18 12:07:22 -06:00
Self::new(text_box)
}
}
2022-10-19 10:12:52 -06:00
pub struct State {
is_dragging: bool,
2023-03-01 22:41:59 +01:00
cache: Mutex<SwashCache>,
2022-10-19 10:12:52 -06:00
}
impl State {
/// Creates a new [`State`].
pub fn new() -> State {
State {
is_dragging: false,
2023-03-01 22:41:59 +01:00
cache: Mutex::new(SwashCache::new()),
}
2022-10-19 10:12:52 -06:00
}
}