Show the clear control only when there is content
Aliases: clear button visibility · cross on empty slot · value-gated clear
What it is
A cross in the slot wipes the current value in one hit. On an empty slot that cross has no object; a press does nothing or scrambles focus. A content-gated clear control follows the value: show when there is text, hide when empty. The issue is when the clear inlet is present, not whether a clear can be undone, and not whether the cross crowds characters on the right.
Why it happens
Clear is an operation on “content that exists”; the signifier should appear when the object exists. A cross on empty is read as submit, search, or “a menu lives here,” so the first click misses and trust drops. Content without a cross leaves only backspace or select-all, slow on touch and prone to leftover characters. Gating visibility to the value also stops an empty slot from permanently hosting a meaningless target, cutting mis-taps. The cross may fade in, but must not leave a clickable invisible hot area between empty and filled.
Where it stops holding
A password field filled with bullets has content; the cross should show—do not treat “I cannot see glyphs” as empty. A read-only slot cannot be cleared; a cross would lie, so offer copy instead. Clearing a search slot also resets results, which is another control’s job; the visibility rule is still “show when there is a query.” During IME composition the slot holds temporary syllables; a clear press may wipe a syllable being composed. Wait until commit before showing, or let clear commit then wipe.
Applying it
- Bind rendering of clear to “the slot has a value”: show after type, paste, or autofill; hide after a full delete.
- Leave no invisible hot area on empty; gone means unclickable.
- Use the same visibility logic on password, numeric, single-line and multiline; do not leave some slots with a permanent cross.
- Verify: an empty-slot screenshot should show no cross; type one character and it appears; delete all and it vanishes. A press on the empty right side should not clear or throw focus. During composition, check that a press does not eat half a pinyin string.