2012-02-09 15 views
6

Ho il seguente codice XAML:Immagine allungata e centrata?

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

ed io, visivamente, ottenuto questo:

enter image description here

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

Con Stretch="None", ho ottenuto questo:

enter image description here

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

Ora, quello che voglio è quello di centrare l'immagine verticalmente o orizzontalmente con Stretch="Uniform"! Solo il lato "più piccolo" (con Uniform) sarà centrato, a destra. Ma al momento, come si può vedere sul screenshot, l'immagine viene semplicemente messo nell'angolo in alto a sinistra, anche se ho definito HorizontalAlignment e VerticalAlignment-"Center"

Cosa devo fare?

l'intero codice è:

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

EDIT (Solution): Solo nel caso some1 ha lo stesso problema, ecco come ho risolto è:

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

Questa è esattamente la stessa comportamento come HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="Uniform" L'immagine è allungata su Uniforme (se l'immagine è più piccola o più grande della tela) ed è centrata sia verticalmente che orizzontalmente!

+0

Potete anche inviare il Xaml circostante? Forse un genitore dell'immagine non è centrato o allungato. – Botz3000

+0

aggiunto alla domanda! –

risposta

7

Se lo metti in una griglia sarà centrato automaticamente.

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

Il controllo completo con alcuni più griglie:

<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

Non funziona se arrendo l'immagine con una griglia e non voglio usare una griglia attorno alla mia tela o all'intero UserControl ... In realtà, non voglio affatto usare una griglia. Forse se dovessi arrendere l'immagine, in realtà non è il caso –

+0

Vedere la mia risposta modificata su come ottenere il layout desiderato. Non dovresti usare affatto Canvas. – Clemens

+0

questo è tipicamente il tipo di codice che non voglio usare! Al momento ho un codice XAML pulito e non voglio creare righe; colonne, modelli e questo tipo di cose:/ –

6

Tela non supporta la HorizontalAlignment dell'immagine. Se si desidera un layout dinamico come questo, Canvas è una scelta sbagliata (è utile se si desidera effettivamente ignorare il layout). Qual è la ragione esatta per cui stai usando una tela?
Basta usare un griglia:

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

Ho modificato la mia domanda con la soluzione che ho trovato! –

Problemi correlati