2009-08-22 17 views
6

Jakieś sugestie, jak uzyskać obraz wektorowy XAML jako tło okna? Jest mnóstwo kodu pokazującego to z JPG, ale wolę obraz oparty na wektorze.Używanie obrazu XAML jako tła okna WPF

Posiadanie go jako zasobu również byłoby bonusem, ale jestem pod wrażeniem najlepszego podejścia.

<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> 

Powyższy kod zasobu działa poprawnie po usunięciu Viewbox. Kod okna to: -

<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> 

Odpowiedz

5

Spróbuj

<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> 

Będziesz musiał dokonać kilku zmian, aby przenieść zasób do słownika zasobów, jeśli są abs absolutnie konieczne.

+0

Pozdrawiam Simona, prawie zrezygnowałem z tego. Twoje rozwiązanie zadziałało po raz pierwszy. Zastanawiam się teraz nad przeniesieniem go do słownika zasobów, dzięki czemu mogę wybierać tła, które można wybrać przez użytkownika. Dzięki jeszcze raz. – Mitch

1

Wiele narzędzi, w tym Illustrator, pozwala eksportować obrazy XAML w różnych formatach. Twoim idealnym celem jest ResourceDictionary, który zawiera panel Canvas lub Grid zawierający obraz wektorowy. Następnie możesz odwołać się do słownika swojego Window.Resources i po prostu dodać panel obrazu (który jest Canvas lub Grid) do panelu okna najwyższego poziomu.

Więc plik obrazu .xaml musi wyglądać następująco:

<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> 

Następnie w Window trzeba mieć coś takiego:

<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> 
+0

Cześć Charlie, ten rodzaj działa, ale rozmiar płótna jest poprawiony i potrzebuję go do zmiany rozmiaru za pomocą okna. Poprzednio umieściłem płótno w okienku Viewbox ze Stretch = "Fill", więc zmieniło się rozmiar, ale nie jestem pewien, jak to zaadaptować za pomocą twojej metody. Jakieś pomysły? – Mitch

+0

Możesz nadal owijać płótno w Viewbox. Po prostu ustaw w Viewbox główny element ResourceDictionary i nadaj mu nazwę zamiast Canvas. – Charlie

+0

Próbowałem ustawić Viewbox jako najwyższy element, ale teraz nie pokazuje się wcale. Bardzo dziwne .. – Mitch