Sdílet prostřednictvím

GridView – přehled

GridView režim zobrazení je jedním z režimů ListView zobrazení ovládacího prvku. Třída GridView a její podpůrné třídy umožňují vám a vašim uživatelům zobrazit kolekce položek v tabulce, která obvykle používá tlačítka jako interaktivní záhlaví sloupců. Toto téma představuje GridView třídu a popisuje její použití.

Co je zobrazení GridView?

Režim GridView zobrazení zobrazí seznam datových položek vazbou datových polí ke sloupcům a zobrazením záhlaví sloupce pro identifikaci pole. Výchozí GridView styl implementuje tlačítka jako záhlaví sloupců. Pomocí tlačítek pro záhlaví sloupců můžete implementovat důležité možnosti interakce uživatelů; Uživatelé mohou například kliknout na záhlaví sloupce a seřadit GridView data podle obsahu konkrétního sloupce.

Poznámka:

Ovládací prvky tlačítka, které používá GridView pro záhlaví sloupců, jsou odvozeny z ButtonBase.

Následující obrázek znázorňuje GridView zobrazení ListView obsahu.

Snímek obrazovky zobrazující ListView s výstupem GridView zobrazující informace o souboru

GridView sloupce jsou reprezentovány GridViewColumn objekty, které mohou automaticky přizpůsobit svou velikost svému obsahu. Volitelně můžete explicitně nastavit konkrétní šířku GridViewColumn . Sloupce můžete změnit přetažením úchytu mezi záhlavími sloupců. Můžete také dynamicky přidávat, odebírat, nahrazovat a měnit pořadí sloupců, protože tato funkce je integrovaná do GridView. GridView Nelze však přímo aktualizovat zobrazená data.

Následující příklad ukazuje, jak definovat GridView , který zobrazuje data zaměstnanců. V tomto příkladu ListView definuje EmployeeInfoDataSource jako ItemsSource. Definice vlastností propojují obsah DisplayMemberBinding s GridViewColumn kategoriemi dat EmployeeInfoDataSource.


<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>

Rozložení a styl GridView

Buňky sloupců a záhlaví sloupce GridViewColumn mají stejnou šířku. Ve výchozím nastavení každý sloupec přizpůsobuje šířku tak, aby odpovídala obsahu. Volitelně můžete sloupec nastavit na pevnou šířku.

Související datový obsah se zobrazuje ve vodorovných řádcích. Například na předchozím obrázku se jako sada zobrazí příjmení, křestní jméno a id každého zaměstnance, protože se zobrazí ve vodorovném řádku.

Definování a stylování sloupců v objektu GridView

Při definování datového pole, které se má zobrazit v objektu GridViewColumn, použijte DisplayMemberBindingCellTemplate, nebo CellTemplateSelector vlastnosti. Vlastnost DisplayMemberBinding má přednost před některou z vlastností šablony.

Chcete-li určit zarovnání obsahu ve sloupci GridView, definujte CellTemplate. Nepoužívejte HorizontalContentAlignment a VerticalContentAlignment vlastnosti pro ListView obsah, který je zobrazen pomocí GridView.

Chcete-li zadat vlastnosti šablony a stylu pro záhlaví sloupců, použijte GridView, GridViewColumna GridViewColumnHeader třídy. Další informace naleznete v tématu GridView Column Header Styles and Templates Overview.

Přidání vizuálních prvků do objektu GridView

Pokud chcete do režimu zobrazení přidat vizuální prvky, jako jsou ovládací prvky CheckBox a Button, použijte šablony nebo styly GridView.

Pokud explicitně definujete vizuální prvek jako datovou položku, může se zobrazit pouze jednou v objektu GridView. Toto omezení existuje, protože prvek může mít pouze jeden nadřazený prvek, a proto se může ve vizuálním stromu zobrazit pouze jednou.

Styling řádků v GridView

Pomocí tříd GridViewRowPresenter a GridViewHeaderRowPresenter naformátujte a zobrazte řádky GridView. Příklad, jak stylovat řádky v GridView režimu zobrazení, viz Styl řádku v ListView, který implementuje GridView.

Problémy se zarovnáním při použití ItemContainerStyle

Chcete-li zabránit problémům se zarovnáním mezi záhlavími sloupců a buňkami, nenastavujte vlastnost ani nezadávejte šablonu, která ovlivňuje šířku položky v objektu ItemContainerStyle. Například nenastavujte Margin vlastnost nebo nezadávejte ControlTemplate, která přidá CheckBox do ItemContainerStyle ovládacího prvku definovaného ListView objektem. Místo toho zadejte vlastnosti a šablony, které ovlivňují šířku sloupce přímo u tříd, které definují GridView režim zobrazení.

Chcete-li například přidat CheckBox do řádků v GridView režimu zobrazení, přidejte CheckBox do objektu DataTemplatea potom nastavte CellTemplate vlastnost na hodnotu DataTemplate.

Interakce uživatelů s objektem GridView

Při použití GridView ve vaší aplikaci mohou uživatelé interagovat s GridView a upravovat jeho formátování. Uživatelé můžou například měnit pořadí sloupců, měnit velikost sloupce, vybírat položky v tabulce a procházet obsah. Můžete také definovat obslužnou rutinu události, která reaguje, když uživatel klikne na tlačítko záhlaví sloupce. Obslužná rutina události může provádět operace, jako je řazení dat zobrazených v GridView souladu s obsahem sloupce.

Následující seznam podrobně popisuje možnosti použití GridView pro interakci uživatele:

  • Přeuspořádat sloupce pomocí metody přetažení.

    Uživatelé mohou změnit pořadí sloupců v objektu GridView tak, že stisknou levé tlačítko myši, když je nad záhlavím sloupce, a potom tento sloupec přetáhnete na nové místo. Zatímco uživatel přetáhne záhlaví sloupce, zobrazí se plovoucí verze záhlaví i plná černá čára, která ukazuje, kam se má sloupec vložit.

    Pokud chcete změnit výchozí styl plovoucí verze záhlaví, určete ControlTemplate pro typ GridViewColumnHeader, který se aktivuje, když je vlastnost Role nastavena na Floating. Další informace najdete v tématu Vytvoření stylu pro přetaženou záhlaví sloupce GridView.

  • Změňte velikost sloupce na jeho obsah.

    Uživatelé můžou poklikáním na úchyt napravo od záhlaví sloupce změnit velikost sloupce tak, aby odpovídal jeho obsahu.

    Poznámka:

    Můžete nastavit vlastnost Width na Double.NaN pro dosažení stejného efektu.

  • Vyberte položky v řádku.

    Uživatelé mohou vybrat jednu nebo více položek v souboru GridView.

    Pokud chcete změnit Style u vybraného prvku, podívejte se na Použití aktivačních událostí ke stylování vybraných prvků v ListView.

  • Posuňte se k zobrazení obsahu, který není na obrazovce zpočátku viditelný.

    Pokud velikost GridView není dostatečně velká pro zobrazení všech položek, uživatelé se mohou vodorovně nebo svisle posouvat pomocí posuvníků poskytovaných ovládacím prvkem ScrollViewer. A ScrollBar je skrytý, pokud je veškerý obsah viditelný v určitém směru. Záhlaví sloupců se neposouvají svislým posuvníkem, ale posouvají se vodorovně.

  • Interakce se sloupci kliknutím na tlačítka záhlaví sloupce

    Když uživatelé kliknou na tlačítko záhlaví sloupce, můžou seřadit data zobrazená ve sloupci, pokud jste zadali algoritmus řazení.

    Můžete zpracovat událost pro tlačítka záhlaví sloupců Click, abyste mohli poskytovat funkčnost, například algoritmus řazení. Pokud chcete zpracovat Click událost pro záhlaví jednoho sloupce, nastavte obslužnou rutinu události na objektu GridViewColumnHeader. Chcete-li nastavit obslužnou rutinu události Click, která zpracovává událost pro všechna záhlaví sloupců, nastavte ji na ovládacím prvku ListView.

Získání jiných vlastních zobrazení

Třída GridView , která je odvozena z ViewBase abstraktní třídy, je pouze jedním z možných režimů zobrazení třídy ListView . Další vlastní zobrazení ListView můžete vytvořit odvozením z ViewBase třídy. Příklad vlastního režimu zobrazení naleznete v tématu Vytvoření vlastního režimu zobrazení pro ListView.

GridView – podpůrné třídy

Následující třídy podporují GridView režim zobrazení.

Styly a šablony

Vzhled GridView záhlaví sloupců můžete přizpůsobit úpravou jejich stylů a šablon. Tato část popisuje pořadí priorit pro vlastnosti, které slouží k přizpůsobení záhlaví sloupce v GridView režimu ListView zobrazení ovládacího prvku. Další informace najdete v tématu Co jsou styly a šablony? a Jak vytvořit šablonu pro ovládací prvek.

Přizpůsobení záhlaví sloupce v objektu GridView

Vlastnosti, které definují obsah, rozložení a styl záhlaví sloupce v objektu GridView , jsou nalezeny v mnoha souvisejících třídách. Některé z těchto vlastností mají podobné nebo stejné funkce.

Řádky v následující tabulce zobrazují skupiny vlastností, které provádějí stejnou funkci. Tyto vlastnosti můžete použít k přizpůsobení záhlaví sloupců v objektu GridView. Pořadí priorit souvisejících vlastností je zprava doleva, kde vlastnost v nejbližším pravém sloupci má nejvyšší prioritu. Pokud ContentTemplate je například nastaven na GridViewColumnHeader objekt a HeaderTemplateSelector je nastaven na přidruženém GridViewColumnobjektu, ContentTemplate má přednost. V tomto scénáři HeaderTemplateSelector nemá žádný vliv.

Související vlastnosti pro záhlaví sloupců v objektu GridView

GridView GridViewColumn GridViewColumnHeader
Vlastnosti místní nabídky ColumnHeaderContextMenu Není relevantní ContextMenu
Nástroj tip

Vlastnosti		 ColumnHeaderToolTip Není relevantní ToolTip
Šablona záhlaví

Vlastnosti		 ColumnHeaderTemplate 1/

ColumnHeaderTemplateSelector		 HeaderTemplate 1/

HeaderTemplateSelector		 ContentTemplate 1/

ContentTemplateSelector
Vlastnosti stylu ColumnHeaderContainerStyle HeaderContainerStyle Style

1Pokud pro vlastnosti šablony záhlaví nastavíte vlastnosti šablony i selektoru šablony, má tato vlastnost přednost. Pokud například nastavíte vlastnosti ContentTemplate i ContentTemplateSelector, vlastnost ContentTemplate má přednost.

Viz také

  • Last updated on