gpui: Add line_clamp
to truncate text after a specified number of lines (#23058)
Release Notes:
- N/A
Add this feature for some case we need keep 2 or 3 lines, but truncate.
For example the blog post summary.
- Added `line_clamp` method.
Ref: https://tailwindcss.com/docs/line-clamp
## Break changes:
- Renamed `gpui::Truncate` to `gpui::TextOverflow` to match
[CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow).
- Update `truncate` style method to match [Tailwind
CSS](https://tailwindcss.com/docs/text-overflow) behavior:
```css
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
```
<img width="538" alt="image"
src="https://github.com/user-attachments/assets/c69c4213-eac9-4087-9daa-ce7afe18c758"
/>
## Show case
<img width="816" alt="image"
src="https://github.com/user-attachments/assets/e0660290-8042-4954-b93c-c729d609484a"
/>

## Describe changes
The [second
commit](6b41c2772f
)
for make sure text layout to match with the line clamp. Before this
change, they may wrap many lines in sometimes. And I also make
line_clamp default to 1 if we used `truncate` to ensure no wrap.
> TODO: There is still a tiny detail that is not easy to fix. This
problem only occurs in the case of certain long words. I will think
about how to improve it later. At present, this has some flaws but does
not affect the use.
This commit is contained in:
parent
baac01cea4
commit
706f7be5e7
14 changed files with 118 additions and 66 deletions
|
@ -374,12 +374,15 @@ impl WindowTextSystem {
|
|||
font_size: Pixels,
|
||||
runs: &[TextRun],
|
||||
wrap_width: Option<Pixels>,
|
||||
line_clamp: Option<usize>,
|
||||
) -> Result<SmallVec<[WrappedLine; 1]>> {
|
||||
let mut runs = runs.iter().filter(|run| run.len > 0).cloned().peekable();
|
||||
let mut font_runs = self.font_runs_pool.lock().pop().unwrap_or_default();
|
||||
|
||||
let mut lines = SmallVec::new();
|
||||
let mut line_start = 0;
|
||||
let mut max_wrap_lines = line_clamp.unwrap_or(usize::MAX);
|
||||
let mut wrapped_lines = 0;
|
||||
|
||||
let mut process_line = |line_text: SharedString| {
|
||||
let line_end = line_start + line_text.len();
|
||||
|
@ -430,9 +433,14 @@ impl WindowTextSystem {
|
|||
run_start += run_len_within_line;
|
||||
}
|
||||
|
||||
let layout = self
|
||||
.line_layout_cache
|
||||
.layout_wrapped_line(&line_text, font_size, &font_runs, wrap_width);
|
||||
let layout = self.line_layout_cache.layout_wrapped_line(
|
||||
&line_text,
|
||||
font_size,
|
||||
&font_runs,
|
||||
wrap_width,
|
||||
Some(max_wrap_lines - wrapped_lines),
|
||||
);
|
||||
wrapped_lines += layout.wrap_boundaries.len();
|
||||
|
||||
lines.push(WrappedLine {
|
||||
layout,
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue