2011-05-15 18 views
11

He creado dos botones usando el siguiente código XAML.Agregar espacios entre controles WPF

<Button x:Name="Button1" Width="100" Content="Button1" HorizontalAlignment="Left" VerticalAlignment="Top" ></Button> 
         <Button x:Name="Button2" Width="100" Content="Button2" HorizontalAlignment="Left" VerticalAlignment="Top" ></Button> 

Los dos botones se tocan entre sí. ¿Cómo poner algo de espacio entre ellos?

Nota:Los botones se encuentran dentro de un panel de distribución con orientación horizontal.

Respuesta

22

añadir un margen a los botones

<Button Margin="10" x:Name="Button1" Width="100" Content="Button1" HorizontalAlignment="Left" VerticalAlignment="Top" ></Button> 
<Button Margin="10" x:Name="Button2" Width="100" Content="Button2" HorizontalAlignment="Left" VerticalAlignment="Top" ></Button> 

El Margen se asegurará de que hay por lo menos esa cantidad de espacio entre cada botón y cualquier otro control

Algo le puede resultar útil es que se puede tienen diferentes valores de margen para arriba, izquierda, derecha e inferior así que:

Margin="10,0,10,0" 

Espaciaría los botones horizontalmente pero no haría ellos cualesquiera más pequeños verticalmente ...

+0

Esto no está funcionando para mi caso. Agregar un margen reduce el botón en cada dimensión. Tal vez debería haber agregado esto antes, el botón está dentro de un panel de distribución. –

+0

Puede agregar Relleno al StackPanel - cualquier control dentro del panel de pila se colocará alrededor. Dará un resultado similar. –

+0

Cómo agregar relleno. No parece encontrar ninguna propiedad con ese nombre? –

11

Si no usa (por alguna razón) la propiedad Margen del botón, puede poner el Separador transparente (color de fondo transparente) con el Ancho (o/y Altura) deseado entre sus controles (Botones en Tu caso).

en XAML:

<StackPanel Orientation="Horizontal"> 
    <Button x:Name="Button1" Width="100" Content="Button1"/> 
    <Separator Width="20" Background="Transparent"/> 
    <Button x:Name="Button2" Width="100" Content="Button2"/> 
</StackPanel> 
Cuestiones relacionadas