2012-02-09 11 views
6

tengo el siguiente código XAML:¿Imagen estirada y centrada?

<Image Source="a.jpg" HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="Uniform"/> 

y, visualmente, conseguido esto:

enter image description here

(http://img810.imageshack.us/img810/2401/imagestretchuniform.png)

Con Stretch="None", tengo esto:

enter image description here

(http://img28.imageshack.us/img28/1783/imagestretchnone.png)

Ahora, lo que quiero es para centrar la imagen vertical u horizontalmente con Stretch="Uniform"! Solo el lado "más pequeño" (con Uniform) estará centrado, a la derecha. Pero en este momento, como se puede ver en las imágenes, la imagen es simplemente poner en la esquina superior izquierda, incluso si he definido HorizontalAlignment y VerticalAlignment-"Center"

¿Qué debo hacer?

el conjunto de código es:

<UserControl [...]> 
    <Canvas Width="640" Height="480" Background="#FF881607"> 
     <Image Source="a.jpg" HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="Uniform"/> 
    </Canvas> 
</UserControl> 

EDITAR (Solución): Sólo en caso de some1 tiene el mismo problema, aquí es cómo lo resolví:

<Canvas Width="640" Height="480" Background="#FFAA00FF" > 
    <Image Source="z.jpg" Height="480" Width="640"/> 
</Canvas> 

Ésta es exactamente la misma comportamiento como HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="Uniform" La imagen se estira a uniforme (si la imagen es más pequeña o más grande que el lienzo) y se centra tanto vertical como horizontalmente.

+0

Puede también publicar la Xaml rodea? Tal vez un padre de la imagen no está centrado o estirado. – Botz3000

+0

lo ha agregado a la pregunta! –

Respuesta

7

Si lo coloca en una cuadrícula, se centrará automáticamente.

<Grid> 
    <Image Source="a.jpg"/> 
</Grid> 

El control completo con algunos más cuadrículas:

<UserControl> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition/> 
      <RowDefinition Height="Auto"/> 
     </Grid.RowDefinitions> 
     <Grid Grid.Row="0"> 
      <Image Source="a.jpg" Stretch="Uniform"/> 
     </Grid> 
     <Grid Grid.Row="1" Margin="10"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="Auto"/> 
       <ColumnDefinition/> 
       <ColumnDefinition Width="Auto"/> 
      </Grid.ColumnDefinitions> 
      <Button Grid.Column="0" Content="Start"/> 
      <Button Grid.Column="2" Content="Stop"/> 
     </Grid> 
    </Grid> 
</UserControl> 
+0

No funciona si solo entrego la imagen con una cuadrícula y no quiero usar una rejilla alrededor de mi lienzo o mi UserControl completo ... De hecho, no quiero usar una rejilla en absoluto. Tal vez si tengo que renunciar a la imagen, pero ese no es el caso en realidad –

+0

Ver mi respuesta editada de cómo se puede obtener el diseño deseado. No deberías usar Canvas en absoluto. – Clemens

+0

¡este es típicamente el tipo de código que no quiero usar! Tengo un código XAML limpio en este momento y no quiero crear filas; columnas, plantillas y este tipo de cosas:/ –

6

lienzo no soporta HorizontalAlignment de la imagen. Si desea un diseño dinámico como este, Canvas es una mala opción (es útil si realmente desea ignorar el diseño). ¿Cuál es la razón exacta por la que estás usando un lienzo?
sólo tiene que utilizar una cuadrícula:

<Grid Background="#FF881607"> 
    <Image Source="a.jpg" HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="Uniform"/> 
</Grid> 
+0

¡Edité mi pregunta con la solución que encontré! –

Cuestiones relacionadas