Postupy: Uspořádání ovládacích prvků na formuláři Windows s použitím ovládacího prvku FlowLayoutPanel
Některé aplikace vyžadují formulář s rozložením, které se správně uspořádá, protože formulář se změní nebo se změní velikost obsahu. Pokud potřebujete dynamické rozložení a nechcete zpracovávat Layout události explicitně v kódu, zvažte použití panelu rozložení.
Ovládací FlowLayoutPanel prvek a TableLayoutPanel ovládací prvek poskytují intuitivní způsoby uspořádání ovládacích prvků ve formuláři. Oba poskytují automatickou konfigurovatelnou možnost řídit relativní pozice podřízených ovládacích prvků obsažených v nich, a oba poskytují dynamické funkce rozložení za běhu, aby mohly měnit velikost a umístění podřízených ovládacích prvků při změně dimenzí nadřazeného formuláře. Panely rozložení lze vnořit do panelů rozložení, aby bylo možné realizovat sofistikovaná uživatelská rozhraní.
Uspořádá TableLayoutPanel jeho obsah do mřížky a poskytuje funkce podobné elementu tabulky> HTML<. Buňky jsou uspořádány v řádcích a sloupcích a můžou mít různé velikosti. Další informace naleznete v tématu Návod: Uspořádání ovládacích prvků na model Windows Forms Pomocí TableLayoutPanel.
Uspořádá FlowLayoutPanel jeho obsah v určitém směru toku: vodorovně nebo svisle. Jeho obsah lze zabalit z jednoho řádku na další nebo z jednoho sloupce na další. Případně můžete jeho obsah vystřihot místo zabalení. Mezi úlohy znázorněné v tomto názorném postupu patří:
Vytvoření projektu model Windows Forms
Uspořádání ovládacích prvků vodorovně a svisle
Změna směru toku
Vkládání konců toků
Uspořádání ovládacích prvků pomocí odsazení a okrajů
Vložení ovládacích prvků poklikáním na ně v sadě nástrojů
Vložení ovládacího prvku výkresem jeho obrysu
Vkládání ovládacích prvků pomocí kurzoru
Změna přiřazení existujících ovládacích prvků k jinému nadřazení
Až budete hotovi, budete mít přehled o roli, kterou hrají tyto důležité funkce rozložení.
Vytvoření projektu
V sadě Visual Studio vytvořte projekt aplikace založený na Windows s názvem FlowLayoutPanelExample (File>New>Project>Visual C# nebo Visual Basic>Classic Desktop> model Windows Forms Application).
Vyberte formulář v Návrháři formulářů.
Uspořádání ovládacích prvků vodorovně a svisle
Ovládací FlowLayoutPanel prvek umožňuje umístit ovládací prvky podél řádků nebo sloupců, aniž byste museli přesně určit pozici jednotlivých ovládacích prvků.
Ovládací FlowLayoutPanel prvek může změnit velikost nebo přeformátovat podřízené ovládací prvky při změně dimenzí nadřazeného formuláře.
Uspořádání ovládacích prvků vodorovně a svisle pomocí flowLayoutPanel
FlowLayoutPanel Přetáhněte ovládací prvek ze sady nástrojů do formuláře.
Button Přetáhněte ovládací prvek ze sady nástrojů do objektu FlowLayoutPanel. Všimněte si, že se automaticky přesune do levého horního FlowLayoutPanel rohu ovládacího prvku.
Přetáhněte jiný Button ovládací prvek ze sady nástrojů do objektu FlowLayoutPanel. Všimněte si, že ovládací Button prvek se automaticky přesune na pozici vedle prvního Button ovládacího prvku. Pokud je příliš FlowLayoutPanel úzký, aby se dva ovládací prvky vešly na stejný řádek, nový Button ovládací prvek se automaticky přesune na další řádek.
Přetáhněte několik dalších Button ovládacích prvků ze sady nástrojů do objektu FlowLayoutPanel. Pokračujte v umístění Button ovládacích prvků, dokud se jeden nezalomí na další řádek.
Změňte hodnotu FlowLayoutPanel vlastnosti ovládacího prvku WrapContents na
false
. Všimněte si, že podřízené ovládací prvky už nebudou přetékat na další řádek. Místo toho se přesunou na první řádek a vystřihnou.Změňte hodnotu FlowLayoutPanel vlastnosti ovládacího prvku WrapContents na
true
. Všimněte si, že podřízené ovládací prvky se znovu zabalí na další řádek.Zmenší šířku FlowLayoutPanel ovládacího prvku, dokud se všechny Button ovládací prvky nepřesunou do prvního sloupce.
Zvětšete šířku FlowLayoutPanel ovládacího prvku, dokud se všechny Button ovládací prvky nepřesunou na první řádek. Možná budete muset změnit velikost formuláře tak, aby vyhovoval větší šířce.
Změna směru toku
Vlastnost FlowDirection umožňuje změnit směr uspořádání ovládacích prvků. Podřízené ovládací prvky můžete uspořádat zleva doprava, zprava doleva, shora dolů nebo shora nahoru.
Změna směru toku v sadě FlowLayoutPanel
Změňte hodnotu FlowLayoutPanel vlastnosti ovládacího prvku FlowDirection na TopDown. Všimněte si, že podřízené ovládací prvky se přeuspořádají do jednoho nebo více sloupců v závislosti na výšce ovládacího prvku.
FlowLayoutPanel Změňte velikost tak, aby jeho výška byla kratší než sloupec ovládacích Button prvků. Všimněte si, že FlowLayoutPanel změna uspořádání podřízených ovládacích prvků tak, aby tok do dalšího sloupce. Pokračujte ve snížení výšky a všimněte si, že podřízené ovládací prvky přetékají do po sobě jdoucích sloupců. Změňte hodnotu FlowLayoutPanel vlastnosti ovládacího prvku FlowDirection na RightToLeft. Všimněte si, že pozice podřízených ovládacích prvků jsou obrácené. Při změně hodnoty FlowDirection vlastnosti BottomUpna .
Vkládání konců toků
Ovládací FlowLayoutPanel prvek poskytuje Vlastnost FlowBreak jeho podřízeným ovládacím prvkům. Nastavení hodnoty FlowBreak vlastnost způsobíFlowLayoutPanel, že true
ovládací prvek přestane rozkládat ovládací prvky v aktuálním směru toku a zalamuje do dalšího řádku nebo sloupce.
Vložení konců toků
Změňte hodnotu FlowLayoutPanel vlastnosti ovládacího prvku FlowDirection na TopDown.
Vyberte jeden z ovládacích Button prvků uprostřed levého sloupce.
Nastavte hodnotu Button vlastnosti FlowBreak ovládacího prvku na
true
. Všimněte si, že sloupec je poškozený a ovládací prvky, které následují za vybraným Button tokem ovládacího prvku, do dalšího sloupce. Nastavte hodnotu Button vlastnosti FlowBreak ovládacího prvku tak, abyfalse
se vrátila k původnímu chování.
Umístění ovládacích prvků pomocí ukotvení a ukotvení
Chování ukotvení a ukotvení podřízených ovládacích prvků se liší od chování v jiných ovládacích prvcích kontejneru. Ukotvení i ukotvení je relativní vzhledem k největšímu řízení ve směru toku.
Umístění ovládacích prvků pomocí ukotvení a ukotvení
Zvětšete velikost ovládacích FlowLayoutPanel prvků, dokud Button nebudou všechny ovládací prvky uspořádány ve sloupci.
Vyberte horní Button ovládací prvek. Zvětšete jeho šířku tak, aby byla přibližně dvakrát širší než ostatní Button ovládací prvky.
Vyberte druhý Button ovládací prvek. Změňte hodnotu jeho Anchor vlastnosti na Right. Všimněte si, že se přesune tak, aby jeho pravé ohraničení odpovídalo pravému ohraničení prvního Button ovládacího prvku.
Změňte hodnotu jeho Anchor vlastnosti na Right a Left. Všimněte si, že má velikost stejné šířky jako první Button ovládací prvek.
Vyberte třetí Button ovládací prvek. Změňte hodnotu jeho Dock vlastnosti na Fill. Všimněte si, že má velikost stejné šířky jako první Button ovládací prvek.
Uspořádání ovládacích prvků pomocí odsazení a okrajů
Ovládací prvky v ovládacím prvku můžete také uspořádat tak, že změníte FlowLayoutPanel vlastnosti Padding a Margin vlastnosti.
Vlastnost Padding umožňuje řídit umístění ovládacích prvků v FlowLayoutPanel buňce ovládacího prvku. Určuje mezery mezi podřízenými ovládacími prvky a FlowLayoutPanel ohraničením ovládacího prvku.
Tato Margin vlastnost umožňuje řídit mezery mezi ovládacími prvky.
Uspořádání ovládacích prvků pomocí vlastností Odsazení a Okraj
Změňte hodnotu FlowLayoutPanel vlastnosti ovládacího prvku Dock na Fill. Pokud je formulář dostatečně velký, Button ovládací prvky se přesunou do prvního sloupce FlowLayoutPanel ovládacího prvku.
Změňte hodnotu FlowLayoutPanel vlastnosti ovládacího prvku Padding rozbalením Padding položky v okně Vlastnosti a nastavením All vlastnosti na hodnotu 20. Další informace naleznete v tématu Návod: Rozložení ovládacích prvků model Windows Forms s odsazením, okraji a vlastností AutoSize. Všimněte si, že podřízené ovládací prvky se přesunou do středu FlowLayoutPanel ovládacího prvku. Zvýšená hodnota vlastnosti Padding posune podřízené ovládací prvky mimo FlowLayoutPanel ohraničení ovládacího prvku.
Vyberte všechny Button ovládací prvky v FlowLayoutPanel a nastavte hodnotu Margin vlastnosti na 20. Všimněte si, že mezery mezi Button ovládacími prvky se zvětšují, takže se posunou dále od sebe. Možná budete muset změnit velikost ovládacího prvku tak FlowLayoutPanel , aby byl větší, aby se zobrazily všechny podřízené ovládací prvky.
Vložení ovládacích prvků poklikáním na ně v sadě nástrojů
Ovládací prvek můžete naplnit FlowLayoutPanel poklikáním na ovládací prvky v sadě nástrojů.
Vložení ovládacích prvků poklikáním na panel nástrojů
Poklikejte na Button ikonu ovládacího prvku v panelu nástrojů. Všimněte si, že se v ovládacím FlowLayoutPanel prvku zobrazí nový Button ovládací prvek.
Poklikejte na několik dalších ovládacích prvků na panelu nástrojů. Všimněte si, že nové ovládací prvky se v ovládacím FlowLayoutPanel prvku zobrazují postupně.
Vložení ovládacího prvku výkresem jeho obrysu
Ovládací prvek můžete vložit do FlowLayoutPanel ovládacího prvku a určit jeho velikost vykreslením obrysu v buňce.
Vložení ovládacího prvku nakreslením jeho obrysu
V panelu nástrojů klikněte na Button ikonu ovládacího prvku. Nepřetáhněte jej do formuláře.
Přesuňte ukazatel myši na FlowLayoutPanel ovládací prvek. Všimněte si, že ukazatel se změní na křížek s připojenou ikonou Button ovládacího prvku.
Klikněte a podržte tlačítko myši.
Přetažením ukazatele myši nakreslete obrys Button ovládacího prvku. Až budete s velikostí spokojeni, uvolněte tlačítko myši. Všimněte si, že ovládací Button prvek se vytvoří v dalším otevřeném umístění FlowLayoutPanel ovládacího prvku.
Vkládání ovládacích prvků pomocí panelu vložení
Ovládací prvky můžete vložit na konkrétní pozici FlowLayoutPanel ovládacího prvku. Když ovládací prvek přetáhnete do FlowLayoutPanel klientské oblasti ovládacího prvku, zobrazí se panel vložení označující, kam bude ovládací prvek vložen.
Vložení ovládacího prvku pomocí kurzoru
Button Přetáhněte ovládací prvek ze sady nástrojů do FlowLayoutPanel ovládacího prvku a přejděte na mezeru mezi dvěma Button ovládacími prvky. Všimněte si, že je nakreslený pruh vložení, který označuje, kam Button se umístí, když se umístí do FlowLayoutPanel ovládacího prvku. Před přetažením nového Button ovládacího prvku do FlowLayoutPanel ovládacího prvku pohybujte ukazatelem myši, abyste viděli, jak se kurzor přesune.
Přetáhněte nový Button ovládací prvek do FlowLayoutPanel ovládacího prvku. Všimněte si, že nový Button ovládací prvek není v souladu s ostatními, protože jeho Margin vlastnost má jinou hodnotu.
Změna přiřazení existujících ovládacích prvků k jinému nadřazení
Ovládací prvky, které existují ve formuláři, můžete přiřadit novému FlowLayoutPanel ovládacímu prvku.
Opětovné zobrazení existujících ovládacích prvků
Přetáhněte tři Button ovládací prvky ze sady nástrojů do formuláře. Umístěte je blízko sebe, ale nechte je nezarovnané.
V panelu nástrojů klikněte na FlowLayoutPanel ikonu ovládacího prvku. Nepřetáhněte jej do formuláře.
Přesuňte ukazatel myši blízko tří Button ovládacích prvků. Všimněte si, že ukazatel se změní na křížek s připojenou ikonou FlowLayoutPanel ovládacího prvku.
Klikněte a podržte tlačítko myši.
Přetažením ukazatele myši nakreslete obrys FlowLayoutPanel ovládacího prvku. Nakreslete obrys kolem tří Button ovládacích prvků.
Uvolněte tlačítko myši. Všimněte si, že tři Button ovládací prvky jsou vloženy do FlowLayoutPanel ovládacího prvku.
Další kroky
Složité rozložení můžete dosáhnout pomocí kombinace panelů rozložení a ovládacích prvků. Mezi návrhy pro další zkoumání patří:
Změňte velikost jednoho z ovládacích Button prvků na větší velikost a všimněte si efektu rozložení.
Panely rozložení můžou obsahovat další panely rozložení. Experimentujte s vyřazením TableLayoutPanel ovládacího prvku do existujícího ovládacího prvku.
Ukotvit FlowLayoutPanel ovládací prvek do nadřazeného formuláře. Změňte velikost formuláře a všimněte si efektu rozložení.
Visible Nastavte vlastnost jednoho z ovládacích prvků
false
a všimněte si, jak FlowLayoutPanel se přeformátuje v odpovědi.
Viz také
- FlowLayoutPanel
- TableLayoutPanel
- Postupy: Uspořádání ovládacích prvků na Windows Forms s použitím ovládacího prvku TableLayoutPanel
- Návod: Uspořádání ovládacích prvků ve Windows Forms pomocí zarovnávacích čar
- Přehled vlastnosti AutoSize
- Postupy: Vložení ovládacích prvků ve Windows Forms do doku
- Postupy: Ukotvení ovládacích prvků ve Windows Forms
- Návod: Rozvrhování ovládacích prvků Windows Forms s odsazením, okraji a s vlastností AutoSize
.NET Desktop feedback
Váš názor
https://aka.ms/ContentUserFeedback.
Připravujeme: V průběhu roku 2024 budeme postupně vyřazovat problémy z GitHub coby mechanismus zpětné vazby pro obsah a nahrazovat ho novým systémem zpětné vazby. Další informace naleznete v tématu:Odeslat a zobrazit názory pro