Genomgång: Lägga ut kontroller med utfyllnad, marginaler och egenskapen AutoSize

Exakt placering av kontroller i formuläret är en hög prioritet för många program. Windows Forms Designer i Visual Studio ger dig många layoutverktyg för att åstadkomma detta. Tre av de viktigaste är Marginegenskaperna , Paddingoch AutoSize som finns i alla Windows Forms-kontroller.

Egenskapen Margin definierar utrymmet runt kontrollen som håller andra kontroller ett angivet avstånd från kontrollens kantlinjer.

Egenskapen Padding definierar utrymmet i det inre av en kontroll som behåller kontrollens innehåll (till exempel värdet för dess Text egenskap) ett angivet avstånd från kontrollens kantlinjer.

Följande bild visar egenskaperna Padding och Margin på en kontroll.

Utfyllnad och marginal för Windows Forms-kontroller

Egenskapen AutoSize instruerar en kontroll att automatiskt storleksanpassa sig till innehållet. Den ändrar inte storlek på sig själv så att den blir mindre än värdet för den ursprungliga Size egenskapen, och den tar hänsyn till värdet för dess Padding egenskap.

Förutsättningar

Du behöver Visual Studio för att slutföra den här genomgången.

Skapa projektet

  1. I Visual Studio skapar du ett Windows-programprojekt med namnet LayoutExample.

  2. Välj formuläret i Windows Forms Designer.

Ange marginaler för kontroller

Du kan ange standardavståndet mellan dina kontroller med hjälp av Margin egenskapen . När du flyttar en kontroll tillräckligt nära en annan kontroll visas en snapline som visar marginalerna för de två kontrollerna. Kontrollen du flyttar fäster också på det avstånd som definieras av marginalerna.

Ordna kontroller i formuläret med egenskapen Margin

  1. Dra två Button-kontroller från Verktygslåda till ditt formulär.

  2. Välj en av de Button kontrollerna och flytta den nära den andra tills de nästan rör vid varandra.

    Observera den snapline som visas mellan dem. Det här avståndet är summan av de två kontrollernas Margin värden. Den kontroll du flyttar justeras automatiskt till det här avståndet. Mer information finns i Genomgång: Ordna kontroller i Windows-formulär med hjälp av snaplines.

  3. Ändra Margin-egenskapen för en av kontrollerna genom att expandera Margin-posten i fönstret Egenskaper och ange All-egenskapen till 20.

  4. Välj en av Button kontrollerna och flytta den nära den andra.

    Den snapline som definierar summan av marginalvärdena är längre, och kontrollen fästs på ett större avstånd från den andra kontrollen.

  5. Ändra Margin-egenskapen för den valda kontrollen genom att expandera Margin-posten i Egenskaper-fönstret och ställa in Top-egenskapen till 5.

  6. Flytta den markerade kontrollen under den andra kontrollen och observera att snaplinen är kortare. Flytta den markerade kontrollen till vänster om den andra kontrollen och observera att snaplinen behåller det värde som observerades i steg 4.

  7. Du kan ange var och en av aspekterna av Margin egenskapen, Left, Top, Right, Bottom, till olika värden, eller så kan du ange dem alla till samma värde med All egenskapen.

Ange marginal för kontrollelement

För att uppnå den korrekta layout som krävs för ditt program innehåller dina kontroller ofta barnkontroller. När du vill ange hur nära den underordnade kontrollens kantlinje ligger den överordnade kontrollens kantlinje, använder du den överordnade kontrollens Padding-egenskap tillsammans med den underordnade kontrollens Margin-egenskap. Egenskapen Padding används också för att styra närheten till en kontrolls innehåll (till exempel en Button kontrolls Text egenskap) till dess kantlinjer.

Ordna kontroller på din form med hjälp av marginal

  1. Dra ett Button-kontrollelement från -verktygslådan till ditt formulär.

  2. Ändra värdet för Button kontrollens AutoSize egenskap till true.

  3. Ändra Padding egenskapen genom att expandera Padding posten i fönstret Egenskaper och ange egenskapen All till 5.

    Kontrollen utökas för att ge utrymme för den nya utfyllnaden.

  4. Dra ett GroupBox-kontrollelement från -verktygslådan till ditt formulär. Dra en Button-kontroll från -verktygslådan till GroupBox-kontrollen. Placera Button-kontrollen så att den är i nivå med det nedre högra hörnet av GroupBox-kontrollen.

    Observera de fästlinjer som visas när Button-kontrollen närmar sig botten och högerkant på GroupBox-kontrollen. Dessa snaplines motsvarar Margin egenskapen för Button.

  5. GroupBox Ändra kontrollens Padding egenskap genom att Padding expandera posten i fönstret Egenskaper och ange All egenskapen till 20.

  6. Välj kontrollen Button i GroupBox kontrollen och flytta den mot mitten av GroupBox.

    Fästlinjerna visas på ett större avstånd från kontrollens GroupBox kantlinjer. Det här avståndet är summan av Button kontrollens Margin egenskap och GroupBox kontrollens Padding egenskap.

Storlekskontroller automatiskt

I vissa program är storleken på en kontroll inte samma vid körningstid som vid designtillfället. Texten i en Button kontroll kan till exempel tas från en databas och dess längd är inte känd i förväg.

När egenskapen AutoSize är inställd till true kommer kontrollen att anpassa sin storlek efter dess innehåll. För mer information, se AutoSize-egenskapsöversikt.

Ordna kontroller i formuläret med egenskapen AutoSize

  1. Dra ett Button-kontrollelement från -verktygslådan till ditt formulär.

  2. Ändra värdet för Button kontrollens AutoSize egenskap till true.

  3. Button Ändra kontrollens Text egenskap till Den här knappen har en lång sträng för egenskapen Text.

    När du genomför ändringen Button ändrar kontrollen storlek så att den passar den nya texten.

  4. Dra ett annat Button-kontrollelement från Toolbox till ditt formulär.

  5. Ändra kontrollens ButtonText egenskap till "Den här knappen har en lång sträng för egenskapen Text.".

    När du checkar in ändringen Button ändrar kontrollen inte storlek på sig själv och texten klipps av av kontrollens högra kant.

  6. Ändra Padding egenskapen genom att expandera Padding posten i fönstret Egenskaper och ange egenskapen All till 5.

    Texten i kontrollens inre är klippt på alla fyra sidorna.

  7. Ändra kontrollens ButtonAutoSize egenskap till true.

    Kontrollen Button ändrar storlek på sig själv så att den omfattar hela strängen. Dessutom har polstring lagts till runt texten, vilket gör att kontrollen Button expanderas i alla fyra riktningarna.

  8. Dra ett Button-kontrollelement från -verktygslådan till ditt formulär. Placera den nära formulärets nedre högra hörn.

  9. Ändra värdet för Button kontrollens AutoSize egenskap till true.

  10. Button Ange kontrollens Anchor egenskap till Right, Bottom.

  11. Ändra kontrollens ButtonText egenskap till "Den här knappen har en lång sträng för egenskapen Text.".

När du genomför ändringen Button ändrar kontrollen storlek på sig själv till vänster. Vanligtvis ändras storleken på en kontroll automatiskt i motsatt riktning mot dess Anchor egenskapsinställning.

Egenskaper för AutoSize och AutoSizeMode

Vissa kontroller stöder egenskapen AutoSizeMode , vilket ger dig mer detaljerad kontroll över kontrollens automatiska storleksbeteende.

Använda egenskapen AutoSizeMode

  1. Dra ett Panel-kontrollelement från -verktygslådan till ditt formulär.

  2. Ange värdet för Panel kontrollens AutoSize egenskap till true.

  3. Dra en Button-kontroll från -verktygslådan till Panel-kontrollen.

  4. Button Placera kontrollen nära kontrollens nedre högra hörnPanel.

  5. Välj kontrollen Panel och ta tag i storlekshandtaget längst ned till höger. Ändra storlek på Panel-kontrollen till större och mindre storlek.

    Anmärkning

    Du kan ändra storleken på Panel kontrollen fritt, men du kan inte storleksändra den till mindre än positionen för den Button kontrollens nedre högra hörn. Det här beteendet anges som standardvärdet för AutoSizeMode egenskapen, som är GrowOnly.

  6. Ange värdet för Panel-kontrollens egenskap AutoSizeMode till GrowAndShrink.

    Kontrollen Panel storleksanpassar sig för att omge Button kontrollen. Du kan inte ändra storlek på Panel kontrollen.

  7. Dra Button-kontrollen mot Panel-kontrollens övre vänstra hörn.

    Kontrollen Panel ändrar storlek till kontrollens Button nya position.

Nästa steg

Det finns många andra layoutfunktioner för att ordna kontroller i dina Windows Forms-program. Här följer några kombinationer som du kan prova:

Se även