Widgetarna

Allt man ser på en skärm är en widget. Paletten Widgetar, till vänster om canvasen, innehåller 32 medföljande widgetar — från den här sidan går du därifrån med vetskap om vad var och en är till för, och med de viktigaste förklarade i detalj. Om appen har widgetar som du själv har programmerat dyker de upp i samma palett, i avsnittet Anpassad.

#Katalogen, per kategori

#Formulärfält

Alla binds till ett fält i en post-datastore (avsnittet Databindning) och ingår i valideringen — se formulären.

Widget	Vad den är till för
Textruta	Text på en rad. Har Mask, läget Lösenord (dölj texten) och platshållare.
Textområde	Lång text, flera rader — anteckningar, beskrivningar.
Tal	Numeriska värden.
Ja/Nej	Ett booleskt reglage.
Listruta	Val bland alternativ: Fast lista, Enum från modellen eller Datastore; med Sökbar, Flerval och läget Träd (hierarkiskt).
Datum	Datum, Datum och tid eller bara Tid (fältet Typ avgör).
Färg	Val av en färg.
Fil	Uppladdning via dragning och/eller knapp, med förhandsvisning, storleksgräns och val av lagring.

#Åtgärder och navigering

Widget	Vad den är till för
Knapp	Den klassiska åtgärden. Visa: Ikon + text, Bara ikon eller Bara text; Åtgärd vid klick navigerar, öppnar en modal eller kör kod.
Knapp med meny	En knapp som öppnar fler alternativ. Utseende: Delad (kroppen agerar, pilen öppnar menyn), Meny eller Hamburgare. Varje alternativ kan döljas eller inaktiveras via villkor.
Länk	Klickbar text — Mål: Skärm i appen (med parametrar) eller Extern URL (med Öppna i ny flik).
Breadcrumb	”Du är här”-vägen, med klickbara nivåer och den sista nivån fast eller bunden till ett fält.
Exportera	En knapp som laddar ner data från en datastore som kalkylblad (.xlsx) — valda fält, valfri Rubrikrad och Filnamn med {date}.

#Struktur

Widget	Vad den är till för
Panel	En behållare med ram och titel — samlar widgetar som sedan flyttas tillsammans.
Flikar	En behållare med flikar; varje barnwidget hör till en flik. Flikarnas stil: Ruta, Piller eller Understruken.
Fast list	En list i full bredd, fäst Överst eller vid skärmens Sidfot — för åtgärdsfält som alltid ska synas.
Linje	En avdelande linje, Horisontell eller Vertikal — färgen och strecket kommer från Utseende.

#Innehåll och media

Widget	Vad den är till för
Etikett	Enkel text — rubriker, bildtexter, lösa värden. Tar emot Värden i texten ({n} i texten).
Markdown	Rik text skriven i Markdown — fast eller hämtad från ett fält.
Bild	En bild via Fast URL, en Asset i appen eller Fält (dynamiskt); Anpassning: Innesluta, Fylla eller Sträcka.
Extern sida	Bäddar in en sida utifrån (en karta, en video, BI från tredje part) eller HTML som du skrivit. Den körs isolerat: den ser varken sessionen eller appens data.

#Data

Widget	Vad den är till för
Tabell	Rutnätet med poster — typade kolumner, sortering, markering och åtgärdsknappar. Detaljer nedan.
Lista	Poster i en lodrät lista, med fält i roller (Titel, Underrubrik, Brödtext, Undertext) och valfri bild.
Kort	Samma mall som Lista, men i ett rutnät av kort med N Kolumner.
Diagram	Uppritade serier — staplar, linjer, cirklar och mer. Detaljer nedan.
KPI	En rad numeriska indikatorer med trender, mål och sparkline. Detaljer nedan.

#Tavlor och planering

Widget	Vad den är till för
Kanban	Kort som dras mellan statuskolumner. Detaljer nedan.
Kalender	Händelser i vyerna Dag/Vecka/Månad/År. Detaljer nedan.
Gantt	Staplar från start→slut med framsteg, grupper och beroenden. Detaljer nedan.

#Dokument och processer

Widget	Vad den är till för
Rapport	Visar en rapport från appen (PDF) inuti skärmen, med parametrar bundna till det som finns på skärmen och Åtgärdsfält för att uppdatera och ladda ner.
Processens status	Historiken och det aktuella steget i en posts arbetsflöden, med beslutsknappar när den öppna uppgiften tillhör den som tittar.
Mina uppgifter	Inkorgen med arbetsflödesuppgifter för den inloggade användaren — den öppnar uppgiftens skärm och beslutar därifrån.

#Tabell

Tabell är plattformens mest använda widget: den binds till en list-datastore och visar posterna i ett rutnät, med sidindelning, sortering och markering.

#Kolumner

När du binder datastoren föds kolumnerna, en per fält. Sedan finjusterar du: under Kolumner använder du + kolumn för att lägga till, och du klickar på en kolumn på canvasen för att redigera den — inspektorn byter till den.

Varje kolumn har Rubrik, Bredd, Sorterbar via rubriken, Dold — och en Typ:

Typ	Vad den gör
Text	Värdet som det är, med valfri Mask (# = tecken).
Tal	Formaterar värdet: Tal (regionalt) (med Decimaler, Tusentalsavgränsare, Kompakt — 1,2 M i stället för 1 234 567 —, Prefix och Suffix) eller Mask (# = siffra).
Länk	Cellen blir klickbar. Mål: Skärm i appen (med parametrar från Fält från raden, URL-parameter eller Fast värde) eller Skript — din egen kod som körs vid klicket.
Bild	Visar bilden vars adress eller innehåll ligger i fältet.
Fil	En nedladdningslänk till filen som fältet pekar på.

#Tabellens åtgärder

I kategorin Beteende skapar åtgärdsavsnittet CRUD-knapparna: Uppdatera, Lägg till ny, Redigera post, Ta bort post och Ta bort flera. Varje påslagen åtgärd skapar en fristående knapp på canvasen, kopplad till tabellen — du placerar och stylar den knappen som vilken annan som helst.

• Lägg till ny och Redigera post öppnar en skärm eller en modal som du väljer (vanligtvis postens formulär), med parametrarna ifyllda från raden.
• Redigera post och Ta bort post blir bara aktiva när en rad är markerad; Ta bort flera arbetar mot Flerval (reglaget som lägger till kryssrutornas kolumn).
• De åtgärder som skriver kräver att datastoren har en primärnyckel — inspektorn varnar: Datastoren behöver en primärnyckel.

#Formulär (inmatningsfält + post + validering)

Det finns ingen ”formulär”-widget: ett formulär är summan av tre delar, och det är den friheten som låter dig rita kortet precis som du vill.

1. Skapa en post-datastore på skärmen (se Datastorer och data) — till exempel conta, laddad via nyckeln som kommer från ruttens parameter id.
2. Dra dit formulärfälten (Textruta, Listruta, Datum…) och bind i vart och ett Databindning till rätt fält i datastoren.
3. Sätt dit en Knapp ”Spara” vars händelse sparar datastoren — den fördefinierade åtgärden Spara datastore i händelseredigeraren skriver koden åt dig (se Händelser och SDK:t).

Valideringen bor i varje fält, i kategorin Validering:

• Obligatoriskt — fältet måste vara ifyllt.
• Standardreglerna: Min tecken, Max tecken, Är e-post, Är telefonnummer, Är tal, Min värde, Max värde, Mönster (regex) och Lika med fältet (lösenordsbekräftelse, till exempel).
• Validering med skript — för din egen logik: koden tar emot value (fältets aktuella värde) och returnerar true om det är giltigt, eller felmeddelandet. Ett organisationsnummer, ett IBAN, en affärsregel.

Vid sparning körs hela valideringen: obligatoriska först, sedan reglerna, sedan skriptet. Posten går bara vidare om allt passerar.

#Diagram

Diagram binds till en datastore och ritar serier. Under Diagramtyp väljer du: Staplar, Linje, Yta, Cirkel/Donut, Punkt, Radar, Mätare, Tratt eller Värmekarta.

Det väsentliga är mappningen, i kategorin Data:

• Kategorifält (X-axel/sektorer) — det som skiljer staplarna eller sektorerna åt.
• Värdefält — ett eller flera numeriska fält; vart och ett är en serie.
• Seriefält (gruppering) — ett alternativ till flera värden: det pivoterar på det första värdefältet och skapar en serie per distinkt värde (utan värden räknas poster).

Och sedan finishen:

Alternativ	Vad det gör
Staplat, Horisontell, Mjuka linjer, Värden vid punkterna	Variationer på ritningen, beroende på typen.
Förklaring, Förklaringens position, Verktygstips	Diagrammets ram. Förklaringen går också att dra direkt i diagrammet för att placera den.
Värdeformat	Samma format som tabellens Tal-kolumner, applicerat på axlar, etiketter och verktygstips.
Värdeskala	Linjär eller Logaritmisk — den logaritmiska hjälper när serierna har olika storleksordningar.
Använd en andra axel	En axel till höger med egen skala — för att sätta en summa i kronor och ett antal i samma diagram.
Serier	Typ per serie (kombinationer av staplar och linjer) och vilka serier som går till den andra axeln.
Avancerade alternativ	En kodredigerare med alla egenskaper i diagrammotorn, med autokomplettering — de läggs ovanpå konfigurationen, för de fall som fälten inte täcker.

#KPI

KPI är en rad indikatorer — fyra tal sida vid sida görs med en widget med fyra indikatorer, inte med fyra widgetar: justeringen och avstånden blir då garanterade.

Varje indikator (under Indikatorer ▸ Lägg till indikator) har:

• Etikett och ikon, med Etikettens placering (Ovanför värdet / Under värdet).
• Värde (fält) + Aggregering (Summa, Medelvärde, Antal, Max, Min, Första, Sista) över datamängden — eller ett Manuellt värde när det inte finns några bundna data.
• Trender (Lägg till trend) — jämförelser under talet, med Referensfält, formatet Procent eller Absolut värde, och Lägre är bättre (kastar om färgerna): på en växande skuld måste pilen vara röd.
• Mål — Inget mål, Manuellt värde eller Fält från datakällan, med valfri Förloppsindikator.
• Visa sparkline — historikens minilinje, med Seriefält.
• Period (från fält) — vilket bokslut talet gäller (ett ISO-datum visas som MM/ÅÅÅÅ).

Datamängden delas av widgeten, men varje indikator kan ha en Egen datamängd.

#Kanban

Kanban visar posterna som kort i kolumner — pipelinen med affärsmöjligheter i Kundhantering är en kanban per status.

1. Bind datastoren och välj Statusfält (kolumn) — fältet som säger vilken kolumn varje kort ligger i.
2. Ange Kolumnernas källa: Statisk (du lägger till varje kolumn med Etikett, Värde och färg) eller Enum (kolumnerna kommer från värdena i en enum i modellen).
3. Komponera Kortmallen — fälten och rollerna, som i Lista.

Med Tillåt att kort dras påslaget sparar en flytt av ett kort den nya statusen i posten direkt. Ordningsfält (ett numeriskt fält) gör ordningen inom kolumnen bestående. Kolumn för utan kategori fångar upp de poster vars status inte matchar någon kolumn; Antal kort visar totalen i rubriken.

Åtgärderna: Klick på ett kort (redigera) och Skapa kort (knapp i kolumnen) — var och en kan navigera till en skärm, öppna en modal (med parametrar från raden och kolumnen) eller utlösa en händelse för din egen kod.

#Kalender

Kalender visar poster med datum som händelser, i vyerna Dag, Vecka, Månad och År.

• Fält: Datumfält (start), Slutfält (valfritt) (flerdagshändelser), Titelfält.
• Händelsernas färg: En färg eller Per fält — med en karta värde → färg (en typ-enum, till exempel).
• Vy: Startvy, Tillgängliga vyer, Veckans första dag (Måndag/Söndag), Max händelser per dag i månadsvyn, klockslag för Start/Slut i dags- och veckovyerna, Navigeringsfält och Knappar för att byta vy.
• Åtgärder: Klick på en händelse (redigera) och Val av dag eller intervall (skapa) — start och slut följer med till målskärmen som parametrar, redo att förifylla skapandeformuläret.

Kalendern laddar bara posterna i det synliga intervallet — att byta månad hämtar den nya månaden, inte hela tabellen.

#Gantt

Gantt ritar staplar från start→slut på en tidslinje — projektplanering, kampanjer, kundintroduktion.

• Fält: Startfält, Slutfält, Etikettfält, Framstegsfält (0–100) och Grupperingsfält (grupperar rader).
• Beroendefält — föregångarnas id (primärnyckel), som JSON-lista eller kommaseparerade; Gantt ritar pilarna.
• Startzoom (Dag, Vecka, Månad), Linje för idag och Skugga helger.
• Åtgärder: Klick på en stapel (redigera) och Klick på tom yta (skapa) — det klickade datumet följer med som parameter.

Gantt är till för att läsas: staplarna dras inte — datumen ändras i postens formulär.

#Varför inte…?

• Varför dyker avsnittet Validering inte upp i min widget? Bara formulärfält validerar — en Knapp eller en Etikett har inget värde att validera.
• Varför syns widgeten i paletten men grå på canvasen? Den är inaktiverad (reglaget Aktiv i kategorin Layout) eller så har en regel eller händelse inaktiverat den.
• Varför ser jag inga data på canvasen? Canvasen visar exempeldata — de riktiga data dyker upp i förhandsgranskningen och i den publicerade appen. Kontrollera bindningen i kapitlet Datastorer och data.