<?xml version="1.0" encoding="utf-8"?>
<page xmlns="http://projectmallard.org/1.0/" xmlns:uix="http://projectmallard.org/experimental/ui/" xmlns:itst="http://itstool.org/extensions/" type="topic" id="lists" xml:lang="sv">

  <info>
    <link type="guide" xref="patterns#primary"/>
    <desc>Rader av information eller innehållsobjekt.</desc>
    <credit type="author">
      <name>Allan Day</name>
      <email>aday@gnome.org</email>
    </credit>
    <include xmlns="http://www.w3.org/2001/XInclude" href="legal.xml"/>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Anders Jonsson</mal:name>
      <mal:email>anders.jonsson@norsjovallen.se</mal:email>
      <mal:years>2015, 2018</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Sebastian Rasmussen</mal:name>
      <mal:email>sebras@gmail.com</mal:email>
      <mal:years>2017, 2018</mal:years>
    </mal:credit>
  </info>

<title>Listor</title>

<p>Listor är ett grundläggande användargränssnittselement som kan användas för att presentera information, innehållsobjekt eller komponenter. Det finns två primära typer av listor i GNOME 3: standardlistor och tabeller.</p>

<p><link xref="sidebar-lists">Sidopanelslistor</link> är ett separat designmönster som också använder en lista.</p>

<section id="when-to-use">
<title>När ska de användas</title>

<p>En lista är ett lämpligt sätt att presentera innehållsobjekt som har distinkta namn som sin primäridentifierare. Om innehållet är till naturen visuellt så som foton eller videor bör du kanske istället överväga att använda ett <link xref="grids">rutnät</link>.</p>

<p>I vissa fall är det fördelaktigt att visa både en lista och en rutnätsvy för samma innehållsobjekt. Använt på detta sätt låter en listvy ytterligare information visas om innehållet via kolumner av information.</p>

</section>

<section id="standard-lists">
<title>Standardlistor</title>

<p>Standardlistor är den vanligaste listtypen och bör generellt användas istället för tabeller.</p>

<p>I standardlistor delas varje rad upp av avskiljare och att ändra sorteringsordning åstadkoms genom en komponent utanför själva listan.</p>

<section id="styles">
<title>Stilar</title>

<p>Standardlistor har två stilar: fullbredd och inbäddad. Fullbreddslistor fyller hela deras behållare medan inbäddade listor omges av utfyllnad.</p>

<p>Fullbreddslistor är visuellt enklare och därför mer eleganta. De bör användas när möjligt. Samtidigt är det inte alltid möjligt att använda fullbreddslistor och det finns vissa situationer då inbäddade listor är ett bättre val:</p>

<list>
<item><p>När listan innehåller kolumner av information som måste hållas tätt ihop av läsbarhetsskäl och när det finns ett behov av att ha listan inuti en bred behållare.</p></item>
<item><p>När ett fönster innehåller flera listor.</p></item>
<item><p>När listan behöver justeras med avseende på andra komponenter inuti fönstret.</p></item>
</list>

<media type="image" mime="image/svg" src="figures/patterns/list-styles.svg"/>

</section>

<section id="editable-lists">
<title>Redigerbara listor</title>

<p>Redigerbara listor låter en användare lägga till eller ta bort objekt från listan (på grund av detta kallas de ibland för lägg till/ta bort-listor). Både fullbreddslistor och inbäddade listor kan vara redigerbara.</p>

<p>Varje rad innehåller en borttagningsknapp. Om antalet objekt är litet kommer den sista raden att användas som en tilläggsknapp. Alternativt, om listan är lång, kan tilläggsknappen placeras i en <link xref="header-bars">rubrikrad</link> eller <link xref="action-bars">åtgärdsrad</link>.</p>

<media type="image" mime="image/svg" src="figures/patterns/editable-lists.svg"/>

</section>
</section>

<section id="tables">
<title>Tabeller</title>

<p>Tabeller kan användas för mer komplexa flerkolumnslistor, där sortering av tabellen via ett antal kolumner är vanligt. Kolumnrubriker låter människor identifiera informationstypen i varje kolumn och att ordna om listan enligt innehållet i varje kolumn.</p>

<p>När kolumnrubriker används, indikera sorteringsordningen genom att använda pilar i rubriken.</p>

<table>
<thead>
<tr>
<td><p>Ordning</p></td>
<td><p>Pilriktning</p></td>
<td><p>Exempel</p></td>
</tr>
</thead>
<tbody>
<tr>
<td><p>Naturlig</p></td>
<td><p>Nedåt</p></td>
<td><p>Alfabetiskt, minsta nummer först, tidigast datum först, markerade objekt först</p></td>
</tr>
<tr>
<td><p>Omvänd</p></td>
<td><p>Upp</p></td>
<td><p>Omvänt alfabetiskt, sista nummer först, senaste datum först, omarkerade objekt först</p></td>
</tr>
</tbody>

</table>

</section>

<section id="row-behavior">
<title>Radbeteende</title>

<p>Beroende på typ av lista kan rader ha olika beteenden när det klickas på eller trycks ned. Det finns tre typer av listor i detta avseende:</p>

<table>
<thead>
<tr>
<td><p>Listtyp</p></td>
<td><p>Radbeteende</p></td>
</tr>
</thead>
<tbody>
<tr>
<td><p>Navigering</p></td>
<td><p>Att välja en rad öppnar motsvarande objekt, oavsett om det är genom att bläddra till en ny vy eller att öppna en dialog. Detta mönster är vanligt för listor över innehållsobjekt eller för presentation av grupper av inställningar.</p></td>
</tr>
<tr>
<td><p>Markera</p></td>
<td><p>Listobjektet markeras när det klickas eller trycks på. Detta tillvägagångssätt används ofta för att markera en av en serie av konfigurationsalternativ. I fallet med <link xref="drop-down-lists">rullgardinslistor</link> markeras alltid ett alternativ. Den markerade raden indikeras med en bock.</p></td>
</tr>
<tr>
<td><p itst:context="list-type">Redigera</p></td>
<td><p>Att välja radobjektet gör om raden till ett textinmatningsfält, vilket låter objektet redigeras.</p></td>
</tr>
</tbody>
</table>

<p>Navigeringsstilslistor kan kombineras med <link xref="selection-mode">markeringsläge</link> för att tillåta rader att både öppnas och manipuleras. Att använda dubbelklick för att öppna objekt bör undvikas, då det är svårt att upptäcka och är inkompatibelt med inmatning på pekskärmar.</p>

</section>

<section id="general-guidelines">
<title>Allmänna riktlinjer</title>

<list>
<item><p>Särskilj olika typer av information genom att ha olika justering, <link xref="typography">textfärger och vikter</link>. Markera den viktigaste och mest relevanta informationen genom att ge annan information en lättare vikt och/eller ljusare färg.</p></item>
<item><p>Var aktsam för att inte överfylla listor med olika kolumner och element och säkerställ att du endast använder dem för att presentera nödvändig information.</p></item>
<item><p>Som en tumregel, undvik flera listor i samma fönster, särskilt primärfönster.</p></item>
<item><p>Använd inte listor med färre än omkring fem objekt, om inte antalet objekt kan öka över tid. För alternativlistor kan kryssrutor eller radioknappar användas som ett alternativ i detta fall.</p></item>
<item><p>Säkerställ att listor ordnas för att vara till hjälp för de som använder dem. Senaste dokument kanske skulle vara till mer hjälp än alfabetiskt sorterade dokument, eller kontakter som är inloggade kanske är mer intressanta än de som inte är inloggade.</p></item>
<item><p>Om du använder ikoner i din lista, <link xref="icons-and-artwork">använd symboliska ikoner</link>. Det mindre utrymmesbehovet hos dessa ikoner kommer att innebära att de inte visuellt överbelastar eller dominerar din lista.</p></item>
<item><p>Om listan är lång, gör det möjligt att söka i den via <link xref="search">standardmönstret för sökning</link>.</p></item>
</list>

</section>

<section id="api-reference">
<title>API-referens</title>
<list>
<item><p><link href="https://developer.gnome.org/gtk3/stable/GtkListBox.html">GtkListBox</link></p></item>
<item><p><link href="https://developer.gnome.org/gtk3/stable/GtkTreeView.html">GtkTreeView</link></p></item>
</list>
</section>

</page>
