Simplifying Multi‑Variable UI Logic with Karnaugh Maps in Mobile Development

This article introduces the principle and practical use of Karnaugh maps (K‑maps) for simplifying multi‑variable logical expressions in client‑side UI code. The method is platform‑agnostic and can be applied to any complex interaction scenario.

Background : In a camera page there are several controls (add‑music, filter, shoot, effect selector, effect‑clear). Different user actions (photo vs. video, various effect selections) lead to many possible state combinations, making the interaction logic hard to maintain.

Pain points : The logic is scattered across many listeners, causing redundant dependencies, difficult maintenance, and frequent bugs when the UI changes.

Logical abstraction : Instead of tracking the whole operation sequence, each UI state can be represented by a set of boolean variables (e.g., A = hasVideo, B = hasEffect, C = hasSubEffect, D = hasSubEffectPhoto, F = hasMusic). The UI visibility is then a pure function of these variables, independent of previous actions.

Karnaugh map basics : A K‑map places the minterms of a Boolean function into a grid ordered by Gray code, allowing adjacent cells (differing by one variable) to be combined and variables eliminated. The article explains the algebraic meaning, adjacency rules, and Gray‑code ordering.

Example – shoot button :

Variables: let hasVideo: Bool = isProgressHasSections() // A let hasEffect: Bool = hasSpecialEffect() // B let hasSubEffect: Bool = hasSubStickers() // C let hasSubEffectPhoto: Bool = hasSubStickersGetPhoto() // D let hasMusic: Bool = currentMusicData != nil || musicID > 0 // F

The visibility rule is takeButton.isHidden = !(hasVideo || hasSubEffectPhoto) . By filling a 2‑variable K‑map for A and D, the minimal expression !(A + D) is derived.

Example – effect‑layer button :

Original rule: stickerSelectionButton.isHidden = !hasVideo && (hasEffect || hasSubEffect) || hasSubEffectPhoto (i.e., !A(B+C)+D ). A 4‑variable K‑map (A,B as columns, C,D as rows) yields the same minimal expression after grouping.

Advantages : Changing requirements only requires updating the variable list and re‑drawing the K‑map; the resulting single Boolean expression replaces many scattered conditionals, improving readability and maintainability.

Limitations : K‑maps are practical up to 4 variables; beyond that the grid becomes unwieldy, and other techniques (e.g., Quine‑McCluskey) may be preferable.

References are provided for further reading on K‑maps, Gray code, and Boolean minimization.