Utilizzo di un'immagine XAML come sfondo della finestra WPF

Question

Qualche suggerimento su come ottenere un'immagine vettoriale XAML come sfondo della finestra? C'è un sacco di codice che mostra questo con jpg ma preferirei un'immagine basata su vettori.

Avere come risorsa sarebbe anche un bonus, ma sono perplesso sull'approccio migliore.

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
    <Viewbox x:Key="Background2" Stretch="Fill"> 
     <Canvas > 
      <!-- Ebene 1/<Path> --> 
      <Path Fill="#ff000000" Data="F1 M 841.890,595.275 L 0.000,595.275 L 0.000,0.000 L 841.890,0.000 L 841.890,595.275 Z"/> 
      <!-- Ebene 1/<Path> --> 
      <Path Data="F1 M 265.910,218.277 C 265.910,169.332 223.865,129.655 172.000,129.655 C 120.135,129.655 78.090,169.332 78.090,218.277 C 78.090,267.222 120.135,306.898 172.000,306.898 C 223.865,306.898 265.910,267.222 265.910,218.277 Z"> 
       <Path.Fill> 
        <RadialGradientBrush MappingMode="Absolute" GradientOrigin="172.733,217.234" Center="172.733,217.234" RadiusX="81.912" RadiusY="81.912"> 
         <RadialGradientBrush.GradientStops> 
          <GradientStop Offset="0.00" Color="#ff0d4976"/> 
          <GradientStop Offset="0.41" Color="#ff06243b"/> 
          <GradientStop Offset="1.00" Color="#ff000000"/> 
         </RadialGradientBrush.GradientStops> 
         <RadialGradientBrush.Transform> 
          <MatrixTransform Matrix="1.146,0.000,0.000,1.082,-26.038,-16.750" /> 
         </RadialGradientBrush.Transform> 
        </RadialGradientBrush> 
       </Path.Fill> 
      </Path> 
     </Canvas> 
    </Viewbox> 
</ResourceDictionary> 

Il codice di risorsa sopra funziona correttamente se si rimuove la casella di visualizzazione. Il codice per la finestra è: -

<Window x:Class="Window2" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="Window2" Height="700" Width="800"> 
     <Window.Resources> 
      <ResourceDictionary Source="Resources/Dictionary2.xaml" /> 
     </Window.Resources> 
     <Grid> 
     <StaticResource ResourceKey="Background2"/> 
     </Grid> 
    </Window> 

Answer 1

Prova questo

<Window.Resources> 
    <Canvas x:Key="Background2"> 
     <!-- Ebene 1/<Path> --> 
     <Path Fill="#ff000000" Data="F1 M 841.890,595.275 L 0.000,595.275 L 0.000,0.000 L 841.890,0.000 L 841.890,595.275 Z"/> 
     <!-- Ebene 1/<Path> --> 
     <Path Data="F1 M 265.910,218.277 C 265.910,169.332 223.865,129.655 172.000,129.655 C 120.135,129.655 78.090,169.332 78.090,218.277 C 78.090,267.222 120.135,306.898 172.000,306.898 C 223.865,306.898 265.910,267.222 265.910,218.277 Z"> 
      <Path.Fill> 
       <RadialGradientBrush MappingMode="Absolute" 
          GradientOrigin="172.733,217.234" 
          Center="172.733,217.234" 
          RadiusX="81.912" RadiusY="81.912"> 
        <RadialGradientBrush.GradientStops> 
         <GradientStop Offset="0.00" Color="#ff0d4976"/> 
         <GradientStop Offset="0.41" Color="#ff06243b"/> 
         <GradientStop Offset="1.00" Color="#ff000000"/> 
        </RadialGradientBrush.GradientStops> 
        <RadialGradientBrush.Transform> 
         <MatrixTransform 
          Matrix="1.146,0.000,0.000,1.082,-26.038,-16.750" /> 
        </RadialGradientBrush.Transform> 
       </RadialGradientBrush> 
      </Path.Fill> 
     </Path> 
    </Canvas> 
</Window.Resources> 

<Grid > 
    <Grid.Background> 
     <VisualBrush Stretch="Fill" Visual="{StaticResource Background2}" /> 
    </Grid.Background> 
</Grid> 

Dovrai solo fare un paio di modifiche per spostare la risorsa nel tuo dizionario delle risorse, se presente assolutamente necessario

Answer 2

Un sacco di strumenti, tra cui Illustrator, consentono di esportare le immagini XAML in diversi formati. Il tuo obiettivo ideale è un ResourceDictionary che contenga un pannello Canvas o Grid, che contenga l'immagine vettoriale. Quindi puoi fare riferimento al dizionario nel tuo Window.Resources e aggiungere semplicemente il pannello immagine (che è un Canvas o Grid) al pannello Finestra di primo livello.

Quindi il file di immagine con estensione xaml ha bisogno di guardare qualcosa di simile:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
    <Canvas x:Name="MyXamlImage"> 
     ... 
    </Canvas> 
</ResourceDictionary> 

Poi, nel tuo Window si dovrebbe avere qualcosa di simile:

<Window x:Class="YourNamespace.YourWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="YourWindow" Height="300" Width="300"> 
    <Window.Resources> 
     <ResourceDictionary Source="MyResourceDictionary.xaml"> 
    </Window.Resources> 
    <Grid> 
     <StaticResource ResourceKey="MyXamlImage"/> 
     ... 
    </Grid> 
</Window>