libcosmic/cosmic/iced/widget/keyed/index.html
2026-04-18 20:11:25 +00:00

32 lines
No EOL
6.1 KiB
HTML

<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta name="generator" content="rustdoc"><meta name="description" content="Keyed widgets can provide hints to ensure continuity."><title>cosmic::iced::widget::keyed - Rust</title><script>if(window.location.protocol!=="file:")document.head.insertAdjacentHTML("beforeend","SourceSerif4-Regular-6b053e98.ttf.woff2,FiraSans-Italic-81dc35de.woff2,FiraSans-Regular-0fe48ade.woff2,FiraSans-MediumItalic-ccf7e434.woff2,FiraSans-Medium-e1aa3f0a.woff2,SourceCodePro-Regular-8badfe75.ttf.woff2,SourceCodePro-Semibold-aa29a496.ttf.woff2".split(",").map(f=>`<link rel="preload" as="font" type="font/woff2" crossorigin href="../../../../static.files/${f}">`).join(""))</script><link rel="stylesheet" href="../../../../static.files/normalize-9960930a.css"><link rel="stylesheet" href="../../../../static.files/rustdoc-aa0817cf.css"><meta name="rustdoc-vars" data-root-path="../../../../" data-static-root-path="../../../../static.files/" data-current-crate="cosmic" data-themes="" data-resource-suffix="" data-rustdoc-version="1.90.0-nightly (3048886e5 2025-07-30)" data-channel="nightly" data-search-js="search-fa3e91e5.js" data-settings-js="settings-5514c975.js" ><script src="../../../../static.files/storage-68b7e25d.js"></script><script defer src="../sidebar-items.js"></script><script defer src="../../../../static.files/main-eebb9057.js"></script><noscript><link rel="stylesheet" href="../../../../static.files/noscript-32bb7600.css"></noscript><link rel="alternate icon" type="image/png" href="../../../../static.files/favicon-32x32-6580c154.png"><link rel="icon" type="image/svg+xml" href="../../../../static.files/favicon-044be391.svg"></head><body class="rustdoc mod"><!--[if lte IE 11]><div class="warning">This old browser is unsupported and will most likely display funky things.</div><![endif]--><nav class="mobile-topbar"><button class="sidebar-menu-toggle" title="show sidebar"></button></nav><nav class="sidebar"><div class="sidebar-crate"><h2><a href="../../../../cosmic/index.html">cosmic</a><span class="version">1.0.0</span></h2></div><div class="sidebar-elems"><section id="rustdoc-toc"><h2 class="location"><a href="#">Module keyed</a></h2><h3><a href="#">Sections</a></h3><ul class="block top-toc"><li><a href="#what-is-continuity" title="What is continuity?">What is continuity?</a></li><li><a href="#how-can-we-keep-continuity" title="How can we keep continuity?">How can we keep continuity?</a></li></ul><h3><a href="#modules">Module Items</a></h3><ul class="block"><li><a href="#modules" title="Modules">Modules</a></li><li><a href="#structs" title="Structs">Structs</a></li></ul></section><div id="rustdoc-modnav"><h2><a href="../index.html">In cosmic::<wbr>iced::<wbr>widget</a></h2></div></div></nav><div class="sidebar-resizer" title="Drag to resize sidebar"></div><main><div class="width-limiter"><rustdoc-search></rustdoc-search><section id="main-content" class="content"><div class="main-heading"><div class="rustdoc-breadcrumbs"><a href="../../../index.html">cosmic</a>::<wbr><a href="../../index.html">iced</a>::<wbr><a href="../index.html">widget</a></div><h1>Module <span>keyed</span><button id="copy-path" title="Copy item path to clipboard">Copy item path</button></h1><rustdoc-toolbar></rustdoc-toolbar><span class="sub-heading"></span></div><details class="toggle top-doc" open><summary class="hideme"><span>Expand description</span></summary><div class="docblock"><p>Keyed widgets can provide hints to ensure continuity.</p>
<h2 id="what-is-continuity"><a class="doc-anchor" href="#what-is-continuity">§</a>What is continuity?</h2>
<p>Continuity is the feeling of persistence of state.</p>
<p>In a graphical user interface, users expect widgets to have a
certain degree of continuous state. For instance, a text input
that is focused should stay focused even if the widget tree
changes slightly.</p>
<p>Continuity is tricky in <code>iced</code> and the Elm Architecture because
the whole widget tree is rebuilt during every <code>view</code> call. This is
very convenient from a developer perspective because you can build
extremely dynamic interfaces without worrying about changing state.</p>
<p>However, the tradeoff is that determining what changed becomes hard
for <code>iced</code>. If you have a list of things, adding an element at the
top may cause a loss of continuity on every element on the list!</p>
<h2 id="how-can-we-keep-continuity"><a class="doc-anchor" href="#how-can-we-keep-continuity">§</a>How can we keep continuity?</h2>
<p>The good news is that user interfaces generally have a static widget
structure. This structure can be relied on to ensure some degree of
continuity. <code>iced</code> already does this.</p>
<p>However, sometimes you have a certain part of your interface that is
quite dynamic. For instance, a list of things where items may be added
or removed at any place.</p>
<p>There are different ways to mitigate this during the reconciliation
stage, but they involve comparing trees at certain depths and
backtracking… Quite computationally expensive.</p>
<p>One approach that is cheaper consists in letting the user provide some hints
about the identities of the different widgets so that they can be compared
directly without going deeper.</p>
<p>The widgets in this module will all ask for a “hint” of some sort. In order
to help them keep continuity, you need to make sure the hint stays the same
for the same items in your user interface between <code>view</code> calls.</p>
</div></details><h2 id="modules" class="section-header">Modules<a href="#modules" class="anchor">§</a></h2><dl class="item-table"><dt><a class="mod" href="column/index.html" title="mod cosmic::iced::widget::keyed::column">column</a></dt><dd>Keyed columns distribute content vertically while keeping continuity.
Distribute content vertically.</dd></dl><h2 id="structs" class="section-header">Structs<a href="#structs" class="anchor">§</a></h2><dl class="item-table"><dt><a class="struct" href="struct.Column.html" title="struct cosmic::iced::widget::keyed::Column">Column</a></dt><dd>A container that distributes its contents vertically while keeping continuity.</dd></dl></section></div></main></body></html>