Panel

Panel prvky jsou složky, které řídí vykreslování prvků – jejich velikost a rozměry, jejich umístění a uspořádání jejich vnořeného obsahu. Windows Presentation Foundation (WPF) poskytuje řadu předdefinovaných Panel prvků a také schopnost vytvářet vlastní Panel prvky.

Title	Description
Vytvoření vlastního prvku panelu	Ukazuje, jak vytvořit vlastní prvek panelu.
Přepsat metodu OnRender panelu	Ukazuje, jak přepsat metodu OnRender panelu.
Nastavení vlastností výšky elementu	Ukazuje, jak nastavit vlastnosti výšky elementu.
Nastavení vlastností šířky elementu	Ukazuje, jak nastavit vlastnosti šířky elementu.

Styly a šablony

Panel je abstraktní základní třída, která nedefinuje výchozí vzhled šablony nebo vizuálu. Odvozené třídy panelu implementují vlastní styling a chování šablony.

Vlastnost obsahu

Tento ovládací prvek používá Children vlastnost jako jeho vlastnost obsahu.

Součástky

Tento ovládací prvek nedefinuje žádné části šablony.

Vizuální stavy

Tento ovládací prvek nedefinuje žádné vizuální stavy.

Třída Panel

Panel je základní třída pro všechny prvky, které poskytují podporu rozložení ve Windows Presentation Foundation (WPF). Odvozené Panel prvky se používají k umístění a uspořádání prvků v jazyce XAML (Extensible Application Markup Language) a kódu.

WPF obsahuje komplexní sadu odvozených implementací panelů, které umožňují mnoho složitých rozložení. Tyto odvozené třídy zpřístupňují vlastnosti a metody, které umožňují většinu standardních scénářů uživatelského rozhraní (UI). Vývojáři, kteří nemohou najít chování uspořádání podřízených, které vyhovuje jejich potřebám, mohou vytvářet nová rozložení přepsáním metod ArrangeOverride a MeasureOverride.

Běžní členové panelu

Všechny prvky Panel podporují základní vlastnosti velikosti a umístění definované FrameworkElement, včetně Height, Width, HorizontalAlignment, VerticalAlignment, Margin a LayoutTransform. Další informace o vlastnostech umístění definovaných pomocí FrameworkElement, naleznete v Přehledu zarovnání, okrajů a odsazení.

Panel zveřejňuje další vlastnosti, které mají zásadní význam při pochopení a používání rozložení. Vlastnost Background slouží k vyplnění oblasti mezi hranicemi odvozeného prvku panelu znakem Brush. Children představuje podřízenou kolekci prvků, ze které Panel se skládá. InternalChildren představuje obsah Children kolekce a tyto členy generované datovými vazbami. Oba se skládají z UIElementCollection podřízených prvků hostovaných v nadřazeném Panel objektu.

Panel také zveřejňuje připojenou Panel.ZIndex vlastnost, kterou lze použít k dosažení vrstveného pořadí ve zděděném Panel. Členové kolekce panelu Children s vyšší Panel.ZIndex hodnotou se zobrazují před členy s nižší Panel.ZIndex hodnotou. To je zvlášť užitečné pro panely, jako Canvas a Grid, které umožňují podřízeným prvkům sdílet stejný souřadnicový prostor.

Panel také definuje metodu OnRender, kterou lze použít k přepsání výchozího chování prezentace Panel.

Připojené vlastnosti

Odvozené prvky panelu v rozsáhlé míře využívají připojené vlastnosti. Připojená vlastnost je specializovaná forma vlastnosti závislosti, která nemá konvenční vlastnost CLR (Common Language Runtime) "wrapper". Připojené vlastnosti mají specializovanou syntaxi jazyka XAML (Extensible Application Markup Language), kterou lze vidět v několika následujících příkladech.

Jedním z účelů připojené vlastnosti je umožnit podřízeným prvkům ukládat jedinečné hodnoty vlastnosti, která je ve skutečnosti definována nadřazeným prvkem. Funkčnost umožňuje podřízeným prvkům informovat rodičovské prvky o tom, jak chtějí být prezentovány v uživatelském rozhraní, což je velmi užitečné pro rozložení aplikace. Další informace naleznete v tématu Přehled připojených vlastností.

Odvozené prvky panelu

Mnoho objektů je odvozeno z Panel, ale ne všechny jsou určeny pro použití jako kořenových zprostředkovatelů rozložení. K dispozici je šest definovaných tříd panelu (Canvas, DockPanel, GridStackPanel, , VirtualizingStackPanela WrapPanel) navržených speciálně pro vytváření uživatelského rozhraní aplikace.

Každý prvek panelu zapouzdřuje vlastní speciální funkcionalitu, jak je vidět v následující tabulce.

Název elementu	Panel uživatelského rozhraní?	Description
Canvas	Ano	Definuje oblast, ve které můžete umístit podřízené prvky explicitně podle souřadnic vzhledem k Canvas oblasti.
DockPanel	Ano	Definuje oblast, ve které můžete uspořádat podřízené prvky vodorovně nebo svisle vzhledem k sobě.
Grid	Ano	Definuje flexibilní oblast mřížky skládající se ze sloupců a řádků. Podřízené prvky objektu Grid lze umístit přesně pomocí Margin vlastnosti.
StackPanel	Ano	Uspořádá podřízené prvky na jednu čáru, která může být orientována vodorovně nebo svisle.
TabPanel	Ne	Zpracovává rozložení tlačítek tabulátoru v souboru TabControl.
ToolBarOverflowPanel	Ne	Uspořádá obsah v ToolBar ovládacím prvku.
UniformGrid	Ne	UniformGrid slouží k uspořádání potomků v mřížce s rozměry všech buněk stejnými.
VirtualizingPanel	Ne	Poskytuje základní třídu pro panely, které mohou virtualizovat svou podřízenou kolekci.
VirtualizingStackPanel	Ano	Uspořádá a virtualizuje obsah na jednu čáru orientované vodorovně nebo svisle.
WrapPanel	Ano	WrapPanel umístí podřízené prvky do sekvenční pozice zleva doprava a rozdělí obsah na další řádek na okraji obsahujícího pole. Následné řazení probíhá postupně od horního do dolního nebo pravého doleva v závislosti na hodnotě Orientation vlastnosti.

Panely uživatelského rozhraní

WpF má k dispozici šest tříd panelů, které jsou optimalizované pro podporu scénářů uživatelského rozhraní: Canvas, , DockPanelGrid, StackPanel, VirtualizingStackPanela WrapPanel. Tyto prvky panelu jsou snadno použitelné, všestranné a rozšiřitelné dostatečně pro většinu aplikací.

Každý odvozený Panel prvek zpracovává omezení velikosti odlišně. Pochopení toho, jak Panel zpracovává omezení ve vodorovném nebo svislém směru, může učinit rozložení předvídatelnějším.

Název panelu	rozměr x	Rozměr y
Canvas	Omezené na obsah	Omezený na obsah
DockPanel	Přinucený	Přinucený
StackPanel (Svislá orientace)	Přinucený	Omezené na obsah
StackPanel (Vodorovná orientace)	Omezené na obsah	Přinucený
Grid	Přinucený	Omezené, s výjimkou případů, kdy Auto platí pro řádky a sloupce
WrapPanel	Omezené na obsah	Omezené na obsah

Podrobnější popisy a příklady použití jednotlivých prvků najdete níže.

Plátno

Prvek Canvas umožňuje umístění obsahu podle absolutních souřadnic x a y . Prvky lze nakreslit v jedinečném umístění; nebo, pokud prvky zabírají stejné souřadnice, pořadí, ve kterém se zobrazují v kódu, určuje pořadí, ve kterém jsou prvky vykresleny.

Canvas poskytuje nejflexibilnější podporu rozložení libovolného Panel. Vlastnosti Výška a Šířka se používají k definování oblasti plátna a prvky uvnitř jsou přiřazeny absolutní souřadnice vzhledem k oblasti nadřazeného Canvasobjektu . Čtyři připojené vlastnosti , Canvas.Lefta Canvas.TopCanvas.RightCanvas.Bottom, umožňují jemné řízení umístění objektů v rámci , Canvascož vývojáři umožňuje umístění a uspořádání prvků přesně na obrazovce.

ClipToBounds uvnitř plátna

Canvas může umístit podřízené prvky na libovolné místo na obrazovce, a to i v souřadnicích, které jsou mimo své vlastní definované Height a Width. Kromě toho Canvas není ovlivněna velikostí svých dětí. V důsledku toho je možné, aby podřízený prvek překreslil další prvky mimo ohraničující obdélník nadřazeného objektuCanvas. Výchozí chování objektu Canvas je umožnit vykreslení podřízených položek mimo hranice nadřazeného Canvas objektu. Pokud je toto chování nežádoucí, ClipToBounds vlastnost lze nastavit na truehodnotu . To způsobí, že se Canvas ořízne na vlastní velikost. Canvas je jediný prvek rozložení, který umožňuje zobrazovat děti mimo své hranice.

Toto chování je graficky znázorněno v ukázce porovnání vlastností šířky.

DockPanel

Element DockPanel používá připojenou DockPanel.Dock vlastnost jako nastavenou v podřízených elementech obsahu k umístění obsahu podél okrajů kontejneru. Je-li DockPanel.Dock nastaveno na Top nebo Bottom, umístí podřízené prvky nad sebe nebo pod sebe. Pokud DockPanel.Dock je nastaveno na Left nebo Right, umístí podřízené prvky nalevo nebo napravo od sebe. Vlastnost LastChildFill určuje pozici konečného prvku přidaného jako podřízený prvek DockPanel.

Můžete použít DockPanel k umístění skupiny souvisejících ovládacích prvků, například sady tlačítek. Alternativně ho můžete použít k vytvoření "posunovaného" uživatelského rozhraní, podobně jako v Aplikaci Microsoft Outlook.

Přizpůsobení velikosti obsahu

Pokud nejsou specifikovány jeho vlastnosti Height a Width, DockPanel se přizpůsobí své velikosti obsahu. Velikost se může zvětšovat nebo zmenšovat tak, aby vyhovovala velikosti svých podřízených prvků. Pokud jsou však tyto vlastnosti zadány a pro další zadaný podřízený prvek již není místo pro další zadaný podřízený prvek, DockPanel nezobrazuje podřízený prvek ani následné podřízené prvky a neměří další podřízené prvky.

LastChildFill

Ve výchozím nastavení poslední podřízený DockPanel prvek "vyplní" zbývající nepřidělený prostor. Pokud toto chování není žádoucí, nastavte LastChildFill vlastnost na falsehodnotu .

Examples

Následující příklad ukazuje, jak absolutně umístit obsah pomocí Canvas. Tento kód vytvoří tři čtverce o rozměrech 100 pixelů. První čtverec je červený a jeho pozice vlevo nahoře (x, y) je určená jako (0, 0). Druhý čtverec je zelený a jeho levá horní pozice je (100, 100), těsně pod a vpravo od prvního čtverce. Třetí čtverec je modrý a jeho levá horní pozice je (50, 50), takže zahrnuje pravý dolní kvadrant prvního čtverce a levý horní kvadrant druhého. Vzhledem k tomu, že třetí čtverec je rozložen jako poslední, zdá se, že je nad ostatními dvěma čtverci – to znamená, že překrývající se části předpokládají barvu třetího rámečku.

// Create the application's main window
mainWindow = new Window ();
mainWindow.Title = "Canvas Sample";

// Create the Canvas
myParentCanvas = new Canvas();
myParentCanvas.Width = 400;
myParentCanvas.Height = 400;

// Define child Canvas elements
myCanvas1 = new Canvas();
myCanvas1.Background = Brushes.Red;
myCanvas1.Height = 100;
myCanvas1.Width = 100;
Canvas.SetTop(myCanvas1, 0);
Canvas.SetLeft(myCanvas1, 0);

myCanvas2 = new Canvas();
myCanvas2.Background = Brushes.Green;
myCanvas2.Height = 100;
myCanvas2.Width = 100;
Canvas.SetTop(myCanvas2, 100);
Canvas.SetLeft(myCanvas2, 100);

myCanvas3 = new Canvas();
myCanvas3.Background = Brushes.Blue;
myCanvas3.Height = 100;
myCanvas3.Width = 100;
Canvas.SetTop(myCanvas3, 50);
Canvas.SetLeft(myCanvas3, 50);

// Add child elements to the Canvas' Children collection
myParentCanvas.Children.Add(myCanvas1);
myParentCanvas.Children.Add(myCanvas2);
myParentCanvas.Children.Add(myCanvas3);

// Add the parent Canvas as the Content of the Window Object
mainWindow.Content = myParentCanvas;
mainWindow.Show ();

WindowTitle = "Canvas Sample"
'Create a Canvas as the root Panel
Dim myParentCanvas As New Canvas()
myParentCanvas.Width = 400
myParentCanvas.Height = 400

' Define child Canvas elements
Dim myCanvas1 As New Canvas()
myCanvas1.Background = Brushes.Red
myCanvas1.Height = 100
myCanvas1.Width = 100
Canvas.SetTop(myCanvas1, 0)
Canvas.SetLeft(myCanvas1, 0)

Dim myCanvas2 As New Canvas()
myCanvas2.Background = Brushes.Green
myCanvas2.Height = 100
myCanvas2.Width = 100
Canvas.SetTop(myCanvas2, 100)
Canvas.SetLeft(myCanvas2, 100)

Dim myCanvas3 As New Canvas()
myCanvas3.Background = Brushes.Blue
myCanvas3.Height = 100
myCanvas3.Width = 100
Canvas.SetTop(myCanvas3, 50)
Canvas.SetLeft(myCanvas3, 50)

' Add child elements to the Canvas' Children collection
myParentCanvas.Children.Add(myCanvas1)
myParentCanvas.Children.Add(myCanvas2)
myParentCanvas.Children.Add(myCanvas3)

' Add the parent Canvas as the Content of the Window Object
Me.Content = myParentCanvas

<Page WindowTitle="Canvas Sample" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
  <Canvas Height="400" Width="400">
    <Canvas Height="100" Width="100" Top="0" Left="0" Background="Red"/>
    <Canvas Height="100" Width="100" Top="100" Left="100" Background="Green"/>
    <Canvas Height="100" Width="100" Top="50" Left="50" Background="Blue"/>
  </Canvas>
</Page>

Zkompilovaná aplikace přináší nové uživatelské rozhraní, které vypadá takto.

Následující příklad ukazuje, jak rozdělit prostor pomocí DockPanel. Pět Border prvků se přidá jako podřízené položky nadřazeného DockPanelobjektu . Každý využívá jinou vlastnost umístění prvku DockPanel k rozdělení prostoru. Poslední prvek vyplní zbývající nepřidělený prostor.

// Create the application's main window
mainWindow = gcnew Window();
mainWindow->Title = "DockPanel Sample";

// Create the DockPanel
DockPanel^ myDockPanel = gcnew DockPanel();
myDockPanel->LastChildFill = true;

// Define the child content
Border^ myBorder1 = gcnew Border();
myBorder1->Height = 25;
myBorder1->Background = Brushes::SkyBlue;
myBorder1->BorderBrush = Brushes::Black;
myBorder1->BorderThickness = Thickness(1);
DockPanel::SetDock(myBorder1, Dock::Top);
TextBlock^ myTextBlock1 = gcnew TextBlock();
myTextBlock1->Foreground = Brushes::Black;
myTextBlock1->Text = "Dock = Top";
myBorder1->Child = myTextBlock1;

Border^ myBorder2 = gcnew Border();
myBorder2->Height = 25;
myBorder2->Background = Brushes::SkyBlue;
myBorder2->BorderBrush = Brushes::Black;
myBorder2->BorderThickness = Thickness(1);
DockPanel::SetDock(myBorder2, Dock::Top);
TextBlock^ myTextBlock2 = gcnew TextBlock();
myTextBlock2->Foreground = Brushes::Black;
myTextBlock2->Text = "Dock = Top";
myBorder2->Child = myTextBlock2;

Border^ myBorder3 = gcnew Border();
myBorder3->Height = 25;
myBorder3->Background = Brushes::LemonChiffon;
myBorder3->BorderBrush = Brushes::Black;
myBorder3->BorderThickness = Thickness(1);
DockPanel::SetDock(myBorder3, Dock::Bottom);
TextBlock^ myTextBlock3 = gcnew TextBlock();
myTextBlock3->Foreground = Brushes::Black;
myTextBlock3->Text = "Dock = Bottom";
myBorder3->Child = myTextBlock3;

Border^ myBorder4 = gcnew Border();
myBorder4->Width = 200;
myBorder4->Background = Brushes::PaleGreen;
myBorder4->BorderBrush = Brushes::Black;
myBorder4->BorderThickness = Thickness(1);
DockPanel::SetDock(myBorder4, Dock::Left);
TextBlock^ myTextBlock4 = gcnew TextBlock();
myTextBlock4->Foreground = Brushes::Black;
myTextBlock4->Text = "Dock = Left";
myBorder4->Child = myTextBlock4;

Border^ myBorder5 = gcnew Border();
myBorder5->Background = Brushes::White;
myBorder5->BorderBrush = Brushes::Black;
myBorder5->BorderThickness = Thickness(1);
TextBlock^ myTextBlock5 = gcnew TextBlock();
myTextBlock5->Foreground = Brushes::Black;
myTextBlock5->Text = "This content will Fill the remaining space";
myBorder5->Child = myTextBlock5;

// Add child elements to the DockPanel Children collection
myDockPanel->Children->Add(myBorder1);
myDockPanel->Children->Add(myBorder2);
myDockPanel->Children->Add(myBorder3);
myDockPanel->Children->Add(myBorder4);
myDockPanel->Children->Add(myBorder5);

// Add the parent Canvas as the Content of the Window Object
mainWindow->Content = myDockPanel;
mainWindow->Show();

// Create the application's main window
mainWindow = new Window ();
mainWindow.Title = "DockPanel Sample";

// Create the DockPanel
DockPanel myDockPanel = new DockPanel();
myDockPanel.LastChildFill = true;

// Define the child content
Border myBorder1 = new Border();
myBorder1.Height = 25;
myBorder1.Background = Brushes.SkyBlue;
myBorder1.BorderBrush = Brushes.Black;
myBorder1.BorderThickness = new Thickness(1);
DockPanel.SetDock(myBorder1, Dock.Top);
TextBlock myTextBlock1 = new TextBlock();
myTextBlock1.Foreground = Brushes.Black;
myTextBlock1.Text = "Dock = Top";
myBorder1.Child = myTextBlock1;

Border myBorder2 = new Border();
myBorder2.Height = 25;
myBorder2.Background = Brushes.SkyBlue;
myBorder2.BorderBrush = Brushes.Black;
myBorder2.BorderThickness = new Thickness(1);
DockPanel.SetDock(myBorder2, Dock.Top);
TextBlock myTextBlock2 = new TextBlock();
myTextBlock2.Foreground = Brushes.Black;
myTextBlock2.Text = "Dock = Top";
myBorder2.Child = myTextBlock2;

Border myBorder3 = new Border();
myBorder3.Height = 25;
myBorder3.Background = Brushes.LemonChiffon;
myBorder3.BorderBrush = Brushes.Black;
myBorder3.BorderThickness = new Thickness(1);
DockPanel.SetDock(myBorder3, Dock.Bottom);
TextBlock myTextBlock3 = new TextBlock();
myTextBlock3.Foreground = Brushes.Black;
myTextBlock3.Text = "Dock = Bottom";
myBorder3.Child = myTextBlock3;

Border myBorder4 = new Border();
myBorder4.Width = 200;
myBorder4.Background = Brushes.PaleGreen;
myBorder4.BorderBrush = Brushes.Black;
myBorder4.BorderThickness = new Thickness(1);
DockPanel.SetDock(myBorder4, Dock.Left);
TextBlock myTextBlock4 = new TextBlock();
myTextBlock4.Foreground = Brushes.Black;
myTextBlock4.Text = "Dock = Left";
myBorder4.Child = myTextBlock4;

Border myBorder5 = new Border();
myBorder5.Background = Brushes.White;
myBorder5.BorderBrush = Brushes.Black;
myBorder5.BorderThickness = new Thickness(1);
TextBlock myTextBlock5 = new TextBlock();
myTextBlock5.Foreground = Brushes.Black;
myTextBlock5.Text = "This content will Fill the remaining space";
myBorder5.Child = myTextBlock5;

// Add child elements to the DockPanel Children collection
myDockPanel.Children.Add(myBorder1);
myDockPanel.Children.Add(myBorder2);
myDockPanel.Children.Add(myBorder3);
myDockPanel.Children.Add(myBorder4);
myDockPanel.Children.Add(myBorder5);

// Add the parent Canvas as the Content of the Window Object
mainWindow.Content = myDockPanel;
mainWindow.Show ();

WindowTitle = "DockPanel Sample"
'Create a DockPanel as the root Panel
Dim myDockPanel As New DockPanel()
myDockPanel.LastChildFill = True

' Define the child content
Dim myBorder1 As New Border()
myBorder1.Height = 25
myBorder1.Background = Brushes.SkyBlue
myBorder1.BorderBrush = Brushes.Black
myBorder1.BorderThickness = New Thickness(1)
DockPanel.SetDock(myBorder1, Dock.Top)
Dim myTextBlock1 As New TextBlock()
myTextBlock1.Foreground = Brushes.Black
myTextBlock1.Text = "Dock = Top"
myBorder1.Child = myTextBlock1

Dim myBorder2 As New Border()
myBorder2.Height = 25
myBorder2.Background = Brushes.SkyBlue
myBorder2.BorderBrush = Brushes.Black
myBorder2.BorderThickness = New Thickness(1)
DockPanel.SetDock(myBorder2, Dock.Top)
Dim myTextBlock2 As New TextBlock()
myTextBlock2.Foreground = Brushes.Black
myTextBlock2.Text = "Dock = Top"
myBorder2.Child = myTextBlock2

Dim myBorder3 As New Border()
myBorder3.Height = 25
myBorder3.Background = Brushes.LemonChiffon
myBorder3.BorderBrush = Brushes.Black
myBorder3.BorderThickness = New Thickness(1)
DockPanel.SetDock(myBorder3, Dock.Bottom)
Dim myTextBlock3 As New TextBlock()
myTextBlock3.Foreground = Brushes.Black
myTextBlock3.Text = "Dock = Bottom"
myBorder3.Child = myTextBlock3

Dim myBorder4 As New Border()
myBorder4.Width = 200
myBorder4.Background = Brushes.PaleGreen
myBorder4.BorderBrush = Brushes.Black
myBorder4.BorderThickness = New Thickness(1)
DockPanel.SetDock(myBorder4, Dock.Left)
Dim myTextBlock4 As New TextBlock()
myTextBlock4.Foreground = Brushes.Black
myTextBlock4.Text = "Dock = Left"
myBorder4.Child = myTextBlock4

Dim myBorder5 As New Border()
myBorder5.Background = Brushes.White
myBorder5.BorderBrush = Brushes.Black
myBorder5.BorderThickness = New Thickness(1)
Dim myTextBlock5 As New TextBlock()
myTextBlock5.Foreground = Brushes.Black
myTextBlock5.Text = "This content will Fill the remaining space"
myBorder5.Child = myTextBlock5

' Add child elements to the DockPanel Children collection
myDockPanel.Children.Add(myBorder1)
myDockPanel.Children.Add(myBorder2)
myDockPanel.Children.Add(myBorder3)
myDockPanel.Children.Add(myBorder4)
myDockPanel.Children.Add(myBorder5)
Me.Content = myDockPanel

Viz také

• Přehled zarovnání, okrajů a odsazení
• Přehled připojených vlastností
• Vytvořte ukázku panelu pro zabalení obsahu na míru
• Rozložení
• Rozložení a návrh
• Prohlížeč ScrollViewer
• Použijte přehled automatického rozvržení
• Návod: Moje první desktopová aplikace WPF
• Ukázka galerie ovládacích prvků WPF
• Ukázka galerie rozložení WPF