fnmain/glyphon
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Handle text overflow

Browse source 
Cull glyphs fully outside the bounds, and clip glyphs intersecting the
bounds. This is all done on the CPU for now.

Fixes #2
This commit is contained in:
grovesNL 2022-09-13 16:35:20 -02:30 committed by Josh Groves
parent 4e9e10061f
commit afab881559
3 changed files with 110 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
Cargo.toml
View file

@ -9,7 +9,7 @@ license = "MIT OR Apache-2.0 OR Zlib"
[dependencies]
wgpu = "0.13.1"
fontdue = "0.7.2"
fontdue = { git = "https://github.com/mooman219/fontdue", rev = "828b4f4" }
etagere = "0.2.6"
[dev-dependencies]

33
examples/hello-world.rs
View file

@ -1,9 +1,10 @@
use fontdue::layout::{HorizontalAlign, VerticalAlign};
use glyphon::{
fontdue::{
layout::{CoordinateSystem, Layout, LayoutSettings, TextStyle},
Font, FontSettings,
},
Color, HasColor, Resolution, TextAtlas, TextRenderer,
Color, HasColor, Resolution, TextAtlas, TextOverflow, TextRenderer,
};
use wgpu::{
Backends, CommandEncoderDescriptor, DeviceDescriptor, Features, Instance, Limits, LoadOp,
@ -88,15 +89,15 @@ async fn run() {
window.request_redraw();
}
Event::RedrawRequested(_) => {
let mut layout = Layout::new(CoordinateSystem::PositiveYDown);
let mut layout1 = Layout::new(CoordinateSystem::PositiveYDown);
layout.reset(&LayoutSettings {
layout1.reset(&LayoutSettings {
x: 0.0,
y: 0.0,
..LayoutSettings::default()
});
layout.append(
layout1.append(
fonts.as_slice(),
&TextStyle::with_user_data(
"Hello world!\nI'm on a new line!",
@ -106,6 +107,28 @@ async fn run() {
),
);
let mut layout2 = Layout::new(CoordinateSystem::PositiveYDown);
layout2.reset(&LayoutSettings {
x: 0.0,
y: 200.0,
max_width: Some(200.0),
max_height: Some(190.0),
horizontal_align: HorizontalAlign::Center,
vertical_align: VerticalAlign::Middle,
..LayoutSettings::default()
});
layout2.append(
fonts.as_slice(),
&TextStyle::with_user_data(
"abcdefghijklmnopqrstuvwxyz\nThis should be partially clipped!\nabcdefghijklmnopqrstuvwxyz",
25.0,
0,
GlyphUserData,
),
);
text_renderer
.prepare(
&device,
@ -116,7 +139,7 @@ async fn run() {
height: config.height,
},
&fonts,
&[layout],
&[(layout1, TextOverflow::Hide), (layout2, TextOverflow::Hide)],
)
.unwrap();

89
src/lib.rs
View file

@ -316,6 +316,15 @@ impl TextAtlas {
}
}
/// Controls the overflow behavior of any glyphs that are outside of the layout bounds.
pub enum TextOverflow {
/// Glyphs can overflow the bounds.
Overflow,
/// Hide any glyphs outside the bounds. If a glyph is partially outside the bounds, it will be
/// clipped to the bounds.
Hide,
}
pub struct TextRenderer {
vertex_buffer: Buffer,
vertex_buffer_size: u64,
@ -365,7 +374,7 @@ impl TextRenderer {
atlas: &mut TextAtlas,
screen_resolution: Resolution,
fonts: &[Font],
layouts: &[Layout<impl HasColor>],
layouts: &[(Layout<impl HasColor>, TextOverflow)],
) -> Result<(), PrepareError> {
self.screen_resolution = screen_resolution;
@ -391,7 +400,7 @@ impl TextRenderer {
self.glyphs_in_use.clear();
for layout in layouts.iter() {
for (layout, _) in layouts.iter() {
for glyph in layout.glyphs() {
self.glyphs_in_use.insert(glyph.key);
@ -494,22 +503,86 @@ impl TextRenderer {
let mut glyph_indices = Vec::new();
let mut glyphs_added = 0;
for layout in layouts.iter() {
for (layout, overflow) in layouts.iter() {
let settings = layout.settings();
// Note: subpixel positioning is not currently handled, so we always use the nearest
// pixel.
let bounds_min_x = settings.x.round() as u32;
let bounds_max_x = settings
.max_width
.map(|w| bounds_min_x + w.round() as u32)
.unwrap_or(u32::MAX);
let bounds_min_y = settings.y.round() as u32;
let bounds_max_y = settings
.max_height
.map(|h| bounds_min_y + h.round() as u32)
.unwrap_or(u32::MAX);
for glyph in layout.glyphs() {
let mut x = glyph.x.round() as u32;
let mut y = glyph.y.round() as u32;
let details = atlas.glyph_cache.get(&glyph.key).unwrap();
let (atlas_x, atlas_y) = match details.gpu_cache {
let (mut atlas_x, mut atlas_y) = match details.gpu_cache {
GpuCache::InAtlas { x, y } => (x, y),
GpuCache::SkipRasterization => continue,
};
let mut width = details.width as u32;
let mut height = details.height as u32;
match overflow {
TextOverflow::Overflow => {}
TextOverflow::Hide => {
// Starts beyond right edge or ends beyond left edge
let max_x = x + width;
if x > bounds_max_x || max_x < bounds_min_x {
continue;
}
// Starts beyond bottom edge or ends beyond top edge
let max_y = y + height;
if y > bounds_max_y || max_y < bounds_min_y {
continue;
}
// Clip left ege
if x < bounds_min_x {
let right_shift = bounds_min_x - x;
x = bounds_min_x;
width = max_x - bounds_min_x;
atlas_x += right_shift as u16;
}
// Clip right edge
if x + width > bounds_max_x {
width = bounds_max_x - x;
}
// Clip top edge
if y < bounds_min_y {
let bottom_shift = bounds_min_y - y;
y = bounds_min_y;
height = max_y - bounds_min_y;
atlas_y += bottom_shift as u16;
}
// Clip bottom edge
if y + height > bounds_max_y {
height = bounds_max_y - y;
}
}
}
let color = glyph.user_data.color();
glyph_vertices.extend(
iter::repeat(GlyphToRender {
// Note: subpixel positioning is not currently handled, so we always use
// the nearest pixel.
pos: [glyph.x.round() as u32, glyph.y.round() as u32],
dim: [details.width, details.height],
pos: [x, y],
dim: [width as u16, height as u16],
uv: [atlas_x, atlas_y],
color: [color.r, color.g, color.b, color.a],
})