Handing an item view a new JS array is a model swap: every delegate is thrown away, the scroll offset resets and the page is built again. QbzKeyedModel takes the same arrays and reconciles them by key into removes, inserts, moves and in-place updates, so a view keeps its delegates, its offset and its artwork, and a leaving row can fade out while its neighbours slide into the gap. Each model row carries only `rowKey` and `rowRev`; a delegate looks the row up by key, so it reads the host's own JS object (no copy into a ListModel map) and a rev bump hands it a changed row. New objects for an existing key are compared field by field, so a republished document with the same data touches no delegate. A reorder keeps the longest in-order run steady and moves only the rest; past a cap, and on any scope change (tab, sort, search), the rows are replaced without animation, laid out synchronously and started from the top, like the swap they replace. Three shared transitions (add, remove, displaced) give every adopter the same motion. The remove transition restores opacity and scale as its last step: the view pools a delegate the moment the transition ends and hands it back as it was left, which measured 76 invisible rows after three removals and a scroll. tst_keyed_model covers order and identity under 400 random edits, the one-move reorder, silent resets, a removal that keeps the viewport and creates at most two delegates, the fade that keeps its content, and the pooled rows; it runs in the runtime gate. cc
37 lines
1.1 KiB
QML
37 lines
1.1 KiB
QML
// QbzRowDisplaced — the neighbours of an inserted, removed or moved row slide
|
|
// to their new place (QbzKeyedModel, 2026-09-14). Assign it to a ListView or
|
|
// GridView's `displaced` and `move`, with `enabled: <model>.animate`.
|
|
//
|
|
// A row displaced while it was still fading in or out would otherwise keep
|
|
// that partial opacity or scale for good (Qt's ViewTransition notes), so the
|
|
// slide also settles both back to 1.
|
|
//
|
|
// Not a continuous animation: it runs once per structural change, for the
|
|
// rows actually on screen, and leaves nothing ticking (the repaint pulse
|
|
// rule in CLAUDE.md is about animations that keep presenting frames).
|
|
|
|
import QtQuick
|
|
|
|
Transition {
|
|
id: root
|
|
property int duration: 220
|
|
|
|
NumberAnimation {
|
|
properties: "x,y"
|
|
duration: root.duration
|
|
easing.type: Easing.OutCubic
|
|
}
|
|
NumberAnimation {
|
|
property: "opacity"
|
|
to: 1.0
|
|
duration: root.duration
|
|
easing.type: Easing.OutCubic
|
|
}
|
|
NumberAnimation {
|
|
property: "scale"
|
|
to: 1.0
|
|
duration: root.duration
|
|
easing.type: Easing.OutCubic
|
|
}
|
|
}
|