Просмотр исходного кода

Taak 91: meer omschrijvingstekst op de evenementkaart bij breder scherm

HomeUitgaantabelKaartComponent toonde van $.inhoud altijd maar een regel,
ook op een tablet waar de Expanded eromheen 154 dp hoog is. Oorzaak: Text
Overflow Replacement stond op Ellipsis terwijl Max Lines leeg was, en dat
is voor Flutter single-line ellipsis.

Max Lines is nu een Responsive Value: 2 / 4 / 6 / 8. De waarden komen uit
een meting van de render-tree (restruimte = kaarthoogte - 126, regelhoogte
16,8 dp), met een regel marge op de tablet voor een wrappend categorielabel.

Geverifieerd op de tablet-AVD (8 regels) en op telefoonformaat (2 regels),
geen overflow of exceptie in de run-log.

Alleen het kaartcomponent is gecommit; het datum-zoekveld dat een andere
sessie tegelijk op home bouwt blijft bewust ongecommit in de working tree.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
bob 3 часов назад
Родитель
Сommit
e00eba924b

+ 21 - 0
CLAUDE.md

@@ -1571,6 +1571,27 @@ hem in beeld (Alignment staat vlak boven Text Properties en is groot). **Max
 Lines** staat wél gewoon zichtbaar, rechts naast *Text Align*, en is een
 numeriek veld — dus `left_click` + `ctrl+a` + typen, niet `triple_click`.
 
+**⚠️ Ellipsis mét een LEEG Max Lines kapt af op ÉÉN regel — ook als de widget
+ruimte heeft voor negen.** Bevestigd 2026-09-18 (taak 91, `$.inhoud` op
+`HomeUitgaantabelKaartComponent`): de omschrijving stond in een `Expanded` die
+op een tablet 154 dp hoog was, en toonde toch één regel met "…". In de export
+herken je het aan `overflow: TextOverflow.ellipsis` **zonder** een `maxLines:`
+ernaast — dat is voor Flutter single-line ellipsis, geen "vul de hoogte". Het
+ziet er in de builder volkomen normaal uit en `dart analyze` zegt niets. Wil je
+meer regels naarmate het scherm groeit: **Max Lines → icoontje naast het label →
+Responsive Value** (2 / 4 / 6 / 8 op deze kaart). De `Expanded` blijft de
+bovengrens, dus een te hoge waarde kan de kaart niet laten overlopen — hij geeft
+alleen een half geclipte laatste regel *zonder* "…", dus blijf één regel onder
+wat past.
+
+**Restruimte voor zo'n tekst meet je, je schat 'm niet** — via de render-tree
+van een draaiende debug-app (recept elders in dit bestand): zoek de
+`RenderParagraph` en lees `constraints: BoxConstraints(..., h=N)` plus
+`parentData: offset=Offset(0, Y)`. Voor deze kaart gaf dat: vaste opbouw boven
+de tekst 88 dp + categorielabel 38 dp, dus **restruimte = kaarthoogte − 126**,
+en regelhoogte = fontSize × height (12 × 1,4 = 16,8 dp). Bij kaarthoogte
+160/200/240/280 passen er dan 2/4/6/9 regels.
+
 **FlutterFlow's `On Change`-trigger op een TextField krijgt automatisch een
 `EasyDebounce` van 2000 ms, en die is niet instelbaar.** Bevestigd 2026-09-05:
 geen `debounce`-eigenschap op het widget (zoeken op "debounce" in "Search

+ 0 - 5
TASKS.md

@@ -32,11 +32,6 @@ klopt sinds je 'm las.*
    (mooier label via `datumKnopLabel` — moet Bob doen, de Confirm-knop van die
    dialoog werkt niet voor Claude), **P2-45b** (annuleren zet het filter op vandaag)
    en **P2-45c** (chiplabels korter maken).
-8. **91 · meer omschrijvingstekst op de evenementkaart bij een breder scherm ·
-   Eigenaar: Claude — bezig (2026-09-18).** `HomeUitgaantabelKaartComponent`,
-   de `Text` van `$.inhoud`: Max Lines binden aan een Responsive Value i.p.v.
-   leeg laten. Zie het blok verderop.
-
 7. **89a · kopie-component `HeaderButtonsComponentCopy` opruimen · Eigenaar:
    Bob.** Taak 89 (logo boven de gemeentenaam in de header) is **af** en
    gecommit (`4c3f0aa`); deze kopie is vooraf op Bob's verzoek als vangnet

+ 19 - 0
lib/uitgaanspaginas/home_uitgaantabel_kaart_component/home_uitgaantabel_kaart_component_widget.dart

@@ -623,6 +623,25 @@ class _HomeUitgaantabelKaartComponentWidgetState
                                               r'''$.inhoud''',
                                             ).toString(),
                                             textAlign: TextAlign.start,
+                                            maxLines: () {
+                                              if (MediaQuery.sizeOf(context)
+                                                      .width <
+                                                  kBreakpointSmall) {
+                                                return 2;
+                                              } else if (MediaQuery.sizeOf(
+                                                          context)
+                                                      .width <
+                                                  kBreakpointMedium) {
+                                                return 4;
+                                              } else if (MediaQuery.sizeOf(
+                                                          context)
+                                                      .width <
+                                                  kBreakpointLarge) {
+                                                return 6;
+                                              } else {
+                                                return 8;
+                                              }
+                                            }(),
                                             style: FlutterFlowTheme.of(context)
                                                 .bodySmall
                                                 .override(