Val av datamall: Formatera objekt baserat på deras egenskaper

Den anpassade utformningen av kontrollmallar för samlingar hanteras av en DataTemplate. Datamallar definierar hur varje objekt ska läggas ut och formateras, och den markeringen tillämpas på varje objekt i samlingen. Den här artikeln beskriver hur du använder en DataTemplateSelector för att tillämpa olika datamallar på en samling och välja vilken datamall som ska användas, baserat på vissa objektegenskaper eller värden som du väljer.

Viktiga API:er: DataTemplateSelector, DataTemplate

DataTemplateSelector är en klass som möjliggör anpassad mallvalslogik. Du kan definiera regler som anger vilken datamall som ska användas för vissa objekt i en samling. För att implementera den här logiken skapar du en underklass av DataTemplateSelector i koden bakom och definierar logiken som avgör vilken datamall som ska användas för vilken kategori av objekt (till exempel objekt av en viss typ eller objekt med ett visst egenskapsvärde osv.). Du deklarerar en instans av den här klassen i avsnittet Resurser i XAML-filen, tillsammans med definitionerna av de datamallar som du ska använda. Du identifierar dessa resurser med ett x:Key värde som gör att du kan referera till dem i din XAML.

Förutsättningar

• Så här använder och skapar du en samlingskontroll, till exempel en ListView eller GridView.
• Så här anpassar du utseendet på dina objekt med hjälp av ett DataTemplate.

När du inte ska använda en DataTemplateSelector

I allmänhet bör du inte ge varje objekt i en ListView eller GridView en helt annan layout/formatmall – detta skulle vara dålig användning av en DataTemplateSelector och påverka prestanda negativt.

Vissa element i den visuella visningen av ett listobjekt kan styras med bara en datamall, genom att binda vissa egenskaper. Objekt kan till exempel ha en annan ikon genom att binda till en ikonkällaegenskap i datamallen och ge varje objekt ett annat värde för den ikonkällaegenskapen. Detta skulle ge bättre prestanda än att använda en DataTemplateSelector.

När du ska använda en DataTemplateSelector

Du bör skapa en DataTemplateSelector när du vill använda flera datamallar i en samlingskontroll. A DataTemplateSelector ger dig flexibiliteten att få vissa objekt att sticka ut, samtidigt som objekten hålls i en liknande layout. Det finns många användningsfall där en DataTemplateSelector är användbar och några scenarier där det är bättre att tänka om den kontroll och strategi som du använder.

Samlingskontroller är vanligtvis bundna till en samling objekt som alla är av samma typ. Även om objekt kan vara av samma typ kan de dock ha olika värden för vissa egenskaper eller representera olika betydelser. Vissa objekt kan också vara viktigare än andra, eller ett objekt kan vara särskilt viktigt eller annorlunda och har ett behov av att visuellt sticka ut. I dessa situationer är en DataTemplateSelector till stor hjälp.

Du kan också binda till en samling som innehåller olika typer av objekt – den bundna samlingen kan ha en blandning av strängar, ints, anpassade klassobjekt med mera. Detta gör DataTemplateSelector särskilt användbart eftersom det kan tilldela olika datamallar baserat på objekttypen för ett objekt.

Här följer några exempel på när du kan använda en datamallsväljare:

• Att representera olika nivåer av anställda i en ListView – varje typ/nivå av medarbetare kan behöva en annan färgbakgrund för att enkelt kunna särskiljas.
• Representerar försäljningsobjekt i ett produktgalleri som använder en GridView – ett försäljningsobjekt kan behöva en röd bakgrund, eller ett annat färgteckensnitt för att göra att det sticker ut från vanliga prissatta objekt.
• Representerar vinnare/toppfoton i ett fotogalleri med hjälp av FlipView.
• Behöver representera negativa/positiva tal i en ListView på ett annat sätt eller korta strängar/långa strängar.

Skapa en DataTemplateSelector

När du skapar en datamallsväljare definierar du mallvalslogik i koden och definierar datamallarna i XAML.

Komponent bakom kod

Om du vill använda en datamallsväljare skapar du först en underklass av DataTemplateSelector (en klass som härleds från den) i koden bakom. I klassen deklarerar du varje mall som en egenskap för klassen. Sedan åsidosätter du metoden SelectTemplateCore för att inkludera din egen mallvalslogik.

Här är ett exempel på en enkel DataTemplateSelector underklass med namnet MyDataTemplateSelector.

public class MyDataTemplateSelector : DataTemplateSelector
{
    public DataTemplate Normal { get; set; }
    public DataTemplate Accent { get; set; }

    protected override DataTemplate SelectTemplateCore(object item)
    {
        if ((int)item % 2 == 0)
        {
            return Normal;
        }
        else
        {
            return Accent;
        }
    }
}

Klassen MyDataTemplateSelector härleds från DataTemplateSelector klassen och definierar först två DataTemplate-objekt : Normal och Accent. Det här är tomma deklarationer för tillfället, men kommer att "fyllas i" med markering i XAML-filen.

Metoden SelectTemplateCore tar in ett objekt (dvs. varje samlingsobjekt) och skrivs om med regler för vilka DataTemplate som ska returneras under vissa omständigheter. I det här fallet, om objektet är ett udda tal, tar det emot datamallen Accent , medan om det är ett jämnt tal tar det emot datamallen Normal .

XAML-komponent

För det andra måste du skapa en instans av den här nya MyDataTemplateSelector klassen i avsnittet Resurser i XAML-filen. Alla resurser kräver en x:Key, som du använder för att binda den till samlingskontrollens ItemTemplateSelector egenskap (i ett senare steg). Du skapar också två instanser av DataTemplate objekt och definierar deras layout i avsnittet resurser. Du tilldelar dessa datamallar till egenskaperna Accent och Normal som du deklarerade i MyDataTemplateSelector klassen.

Här är ett exempel på de XAML-resurser och XAML-markup som behövs:

<Page.Resources>

<DataTemplate x:Key="NormalItemTemplate" x:DataType="x:Int32">
    <Button HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="{ThemeResource SystemChromeLowColor}">
        <TextBlock Text="{x:Bind}" />
    </Button>
</DataTemplate>

<DataTemplate x:Key="AccentItemTemplate" x:DataType="x:Int32">
    <Button HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="{ThemeResource SystemAccentColor}">
        <TextBlock Text="{x:Bind}" />
    </Button>
</DataTemplate>

<l:MyDataTemplateSelector x:Key="MyDataTemplateSelector"
    Normal="{StaticResource NormalItemTemplate}"
    Accent="{StaticResource AccentItemTemplate}"/>

</Page.Resources>

Som du ser ovan definieras de två datamallarna Normal och Accent - de båda visar objekten som knappar, men datamallen Accent använder en accentfärgborste för bakgrunden, medan datamallen Normal använder en grå färgpensel (SystemChromeLowColor). Dessa två datamallar tilldelas sedan Normal och Accent, vilka är DataTemplate-objekt som fungerar som attribut för klassen MyDataTemplateSelector, skapade i C#-kodens bakomliggande del.

Det sista steget är att binda din DataTemplateSelector till ItemTemplateSelector-egenskapen i din samlingskontroll (i det här fallet en ListView). Detta ersätter behovet av att tilldela ett värde till egenskapen ItemTemplate .

<ListView x:Name = "TestListView"
          ItemsSource = "{x:Bind NumbersList}"
          ItemTemplateSelector = "{StaticResource MyDataTemplateSelector}">
</ListView>

När koden har kompilerats körs varje samlingsobjekt via den åsidosatta SelectTemplateCore metoden i MyDataTemplateSelectoroch renderas med rätt DataTemplate.

Prestandaöverväganden för DataTemplateSelector

När du använder en ListView eller GridView med en stor datainsamling kan prestanda vid rullning och panorering bli ett problem. För att se till att stora samlingar fungerar bra finns det några steg du kan vidta för att förbättra prestandan för dina datamallar. Dessa beskrivs mer detaljerat i optimering av ListView- och GridView-användargränssnittet.

• Minskning av element per objekt – Behåll antalet användargränssnittselement i en datamall till ett rimligt minimum.
• Containeråtervinning med heterogena samlingar
  • Använd händelsen ChoosingItemContainer – Den här händelsen är ett högpresterande sätt att använda olika datamallar för olika objekt. För att uppnå bästa prestanda bör du optimera cachelagring och välja datamallar för dina specifika data.
  • Använd en objektmallväljare – En objektmallsväljare (DataTemplateSelector) bör undvikas i vissa instanser på grund av dess inverkan på prestandan.