Dela via

Översikt över GridView

GridView visningsläget är ett av vylägena för en ListView kontroll. Med GridView klassen och dess stödklasser kan du och dina användare visa objektsamlingar i en tabell som vanligtvis använder knappar som interaktiva kolumnrubriker. Det här avsnittet introducerar GridView-klassen och beskriver dess användning.

Vad är en GridView-vy?

Visningsläget GridView visar en lista över dataobjekt genom att binda datafält till kolumner och genom att visa en kolumnrubrik för att identifiera fältet. GridView Standardformatet implementerar knappar som kolumnrubriker. Genom att använda knappar för kolumnrubriker kan du implementera viktiga funktioner för användarinteraktion. Användarna kan till exempel klicka på kolumnrubriken för att sortera GridView data enligt innehållet i en specifik kolumn.

Anmärkning

De knappkontroller som GridView används för kolumnrubriker härleds från ButtonBase.

Följande bild visar en GridView vy över ListView innehåll.

Skärmbild som visar GridView-vyn över ListView-innehåll.

GridView kolumner representeras av GridViewColumn objekt som automatiskt kan storleksanpassas till innehållet. Du kan också uttryckligen ange en GridViewColumn till en viss bredd. Du kan ändra storlek på kolumner genom att dra handtag mellan kolumnrubriker. Du kan också dynamiskt lägga till, ta bort, ersätta och ordna om kolumner eftersom den här funktionen är inbyggd i GridView. Det går dock GridView inte att uppdatera de data som visas direkt.

I följande exempel visas hur du definierar en GridView som visar medarbetardata. I det här exemplet ListView definierar EmployeeInfoDataSource som ItemsSource. Egenskapsdefinitionerna för DisplayMemberBinding binder GridViewColumn innehåll till EmployeeInfoDataSource datakategorier.


<ListView ItemsSource="{Binding Source={StaticResource EmployeeInfoDataSource}}">

    <ListView.View>

        <GridView AllowsColumnReorder="true" ColumnHeaderToolTip="Employee Information">

            <GridViewColumn DisplayMemberBinding="{Binding Path=FirstName}" Header="First Name" Width="100"/>

            <GridViewColumn DisplayMemberBinding="{Binding Path=LastName}" Width="100">
                <GridViewColumnHeader>Last Name
                    <GridViewColumnHeader.ContextMenu>
                        <ContextMenu MenuItem.Click="LastNameCM_Click" Name="LastNameCM">
                            <MenuItem Header="Ascending" />
                            <MenuItem Header="Descending" />
                        </ContextMenu>
                    </GridViewColumnHeader.ContextMenu>
                </GridViewColumnHeader>
            </GridViewColumn>

            <GridViewColumn DisplayMemberBinding="{Binding Path=EmployeeNumber}" Header="Employee No." Width="100"/>
        </GridView>

    </ListView.View>
</ListView>

Följande bild visar tabellen som i föregående exempel skapas. Kontrollen GridView visar data från ett ItemsSource-objekt:

Skärmbild som visar en ListView med GridView-utdata.

Layout och formatmall för GridView

Kolumncellerna och kolumnrubriken i en GridViewColumn har samma bredd. Som standard storleksanpassar varje kolumn sin bredd så att den passar innehållet. Du kan också ange en kolumn till en fast bredd.

Relaterat datainnehåll visas i vågräta rader. I föregående bild visas till exempel varje medarbetares efternamn, förnamn och ID-nummer som en uppsättning eftersom de visas i en vågrät rad.

Definiera och formatera kolumner i en GridView

När du definierar vilket datafält som ska visas i GridViewColumn, använder du egenskaperna DisplayMemberBinding, CellTemplate eller CellTemplateSelector. Egenskapen DisplayMemberBinding har företräde framför någon av mallegenskaperna.

Om du vill ange justering av innehåll i en kolumn i en GridViewdefinierar du en CellTemplate. Använd inte HorizontalContentAlignment och VerticalContentAlignment egenskaperna för ListView innehåll som visas med hjälp av en GridView.

Om du vill ange mall- och formategenskaper för kolumnrubriker använder du klasserna GridView, GridViewColumnoch GridViewColumnHeader . Mer information finns i GridView Column Header Styles and Templates Overview.

Lägga till visuella element i en GridView

Om du vill lägga till visuella element, till exempel CheckBox och Button kontroller, i ett GridView visningsläge använder du mallar eller formatmallar.

Om du uttryckligen definierar ett visuellt element som ett dataobjekt kan det bara visas en gång i en GridView. Den här begränsningen finns eftersom ett element bara kan ha en överordnad och därför bara kan visas en gång i det visuella trädet.

Formatering av rader i en GridView

Använd klasserna GridViewRowPresenter och GridViewHeaderRowPresenter för att formatera och visa raderna i en GridView. Ett exempel på hur du formaterar rader i visningsläge GridView finns i Formatera en rad i en ListView som implementerar en GridView.

Justeringsproblem när du använder ItemContainerStyle

Om du vill förhindra justeringsproblem mellan kolumnrubriker och celler ska du inte ange en egenskap eller ange en mall som påverkar bredden på ett objekt i en ItemContainerStyle. Ange till exempel inte egenskapen Margin eller ange en ControlTemplate som lägger till en CheckBox i en ItemContainerStyle som har definierats för en ListView kontroll. Ange i stället de egenskaper och mallar som påverkar kolumnbredden direkt på klasser som definierar ett GridView visningsläge.

Om du till exempel vill lägga till en CheckBox i raderna i GridView visningsläge, lägger du till CheckBox i en DataTemplate och anger sedan CellTemplate egenskapen till den DataTemplate.

Användarinteraktioner med en GridView

När du använder en GridView i ditt program kan användarna interagera med och ändra formateringen för GridView. Användare kan till exempel ändra ordning på kolumner, ändra storlek på en kolumn, välja objekt i en tabell och bläddra igenom innehåll. Du kan också definiera en händelsehanterare som svarar när en användare klickar på kolumnrubrikknappen. Händelsehanteraren kan utföra åtgärder som att sortera data som visas i enligt innehållet i GridView en kolumn.

I följande lista beskrivs mer detaljerat funktionerna för att använda GridView för användarinteraktion:

  • Ändra ordning på kolumner med hjälp av dra och släpp-metoden.

    Användare kan ändra ordning på kolumner i en GridView genom att trycka på den vänstra musknappen medan den är över en kolumnrubrik och sedan dra kolumnen till en ny position. Medan användaren drar kolumnrubriken visas en flytande version av rubriken samt en helsvart linje som visar var kolumnen ska infogas.

    Om du vill ändra standardformatet för den flytande versionen av en rubrik anger du en ControlTemplate för en GridViewColumnHeader typ som utlöses när Role egenskapen är inställd på Floating. Mer information finns i Skapa en stil för en dragbar GridView-kolumnrubrik.

  • Ändra storlek på en kolumn till dess innehåll.

    Användare kan dubbelklicka på griparen till höger om en kolumnrubrik för att ändra storlek på en kolumn så att den passar dess innehåll.

    Anmärkning

    Du kan ange egenskapen Width till Double.NaN för att ge samma effekt.

  • Välj radobjekt.

    Användare kan välja ett eller flera objekt i en GridView.

    Om du vill ändra Style av ett markerat objekt, se Använda utlösare för att formatera markerade objekt i en ListView.

  • Rulla om du vill visa innehåll som inte visas från början på skärmen.

    Om storleken på GridView är inte tillräckligt stor för att visa alla objekt kan användarna rulla vågrätt eller lodrätt med hjälp av rullningslister som tillhandahålls av en ScrollViewer kontroll. A ScrollBar är dolt om allt innehåll är synligt i en specifik riktning. Kolumnrubriker rullar inte med en lodrät rullningslist, utan rullar vågrätt.

  • Interagera med kolumner genom att klicka på kolumnrubrikknapparna.

    När användarna klickar på en kolumnrubrikknapp kan de sortera data som visas i kolumnen om du har angett en sorteringsalgoritm.

    Du kan hantera Click händelsen för kolumnrubrikknappar för att tillhandahålla funktioner som en sorteringsalgoritm. Om du vill hantera Click händelsen för en kolumnrubrik anger du en händelsehanterare på GridViewColumnHeader. Om du vill ange en händelsehanterare som hanterar Click händelsen för alla kolumnrubriker anger du hanteraren för ListView kontrollen.

Hämta andra anpassade vyer

Klassen GridView , som härleds från den ViewBase abstrakta klassen, är bara ett av de möjliga vylägena ListView för klassen. Du kan skapa andra anpassade vyer för ListView genom att härleda från ViewBase klassen. Ett exempel på ett anpassat visningsläge finns i Skapa ett anpassat visningsläge för en ListView.

Stödklasser för GridView

Följande klasser stöder visningsläget GridView .

Se även

  • Last updated on