LivelyKernel / LivelyKernel/lively.next

"Shrink"-extent-mode for `Text`

Open
#1,559 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

✨ enhancement
Dominant language
JavaScript
Stars
90
Forks
20
PR merge metrics
No merged PRs in 30d

Description

Currently, Textmorphs inside of an Autolayout provide three sizing modes: They can have a fixed extent, hug their content or fill the morph.
We noticed, that there might be a fourth value that one would like to have for Text which we called "shrink":

When setting the width mode of a Text to "shrink", its extent will never grow beyond the extent that would result from "hug", i.e., the morph gets at most exactly as wide as is necessary to display all its text content.
However, the width of the morph would then respond to changes in the width of its container, similar to how it would respond with a width mode of "fill". This would only take effect when the resulting width becomes smaller than the value determined by the "hug" width mode. "Shrink" would also enable text wrapping by default or might even enforce it.

The reason for wanting this are cases where one would like to use the "positioning" capabilities of the layout, for example centering the text morph, while still wanting the fill behavior so that the text morph shrinks when the container is very small to break the text accordingly.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by locating the Text morph sizing modes and the Autolayout code that handles fixed, hug, and fill extents. Trace how container-width changes and text wrapping are tested, then define the shrink mode's behavior for both normal and constrained widths before implementing and adding coverage.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
design, frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.