Saltar al contenido

¿La mejor manera de usar una imagen vectorial en WPF?

Solución:

Personalmente, si está hablando de usarlo en varios lugares sin tener que reutilizar / volver a dibujar sus rutas xaml cada vez. Luego simplemente los coloco en un ContentControl como;

<!-- Plop this in your resource dictionary or your resource declaration -->
    <Style x:Key="TheAwesomeXAMLimage" TargetType="ContentControl">
            <!-- Add additional Setters Here -->
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ContentControl">

                                <!-- Just Paste your XAML here -->

                </ControlTemplate>
            </Setter.Value>
        </Setter>                      
    </Style>

<!-- Now actually place it on your view -->
    <ContentControl Style="{StaticResource TheAwesomeXAMLimage}"/>

Utilice un DrawingImage, como su envase que está diseñado para ser una envoltura de este tipo:

<MyWindow.Resources>
     <DrawingImage x:Key="diUndo">
         <DrawingImage.Drawing>
             <DrawingGroup>
                 <GeometryDrawing Brush="#FF22BAFD" Geometry="..."/>
             </DrawingGroup>
         </DrawingImage.Drawing>
     </DrawingImage> 
</MyWindow.Resources>

Luego reutilícelo como tal:

<Image Source="{DynamicResource diUndo}" />

pero siempre será de ese color …..


O especifique un color

Convierta el vector en un estilo y luego cámbielo dinámicamente en el objetivo (es un vector y no una imagen estática, ¿verdad?), Luego especifique un color de relleno cuando se use:

 <MyWindow.Resources>
        <Path x:Key="vRedo"
              Data="F1M14.4401,25.5039C15.5755,22.9375 17.1667,20.5703 19.2162,18.5239 23.5781,14.1587 29.3828,11.7539 35.5573,11.7539 41.7344,11.7539 47.5365,14.1587 51.8984,18.5239 56.263,22.8879 58.6667,28.6899 58.6667,34.8645 58.6667,41.0391 56.263,46.8411 51.8984,51.2056 51.2031,51.8997 50.2917,52.2461 49.3828,52.2461 48.474,52.2461 47.5599,51.8997 46.8646,51.2056 45.4818,49.8164 45.4818,47.5664 46.8698,46.177 49.8932,43.1563 51.5573,39.1392 51.5573,34.8645 51.5573,30.5911 49.8932,26.5728 46.8646,23.552 43.849,20.5273 39.8307,18.8645 35.5573,18.8645 31.2813,18.8645 27.2656,20.5273 24.2448,23.552 22.0052,25.7915 20.5182,28.5845 19.8932,31.6184L27.5573,40.1992 5.33334,40.1992 7.10938,17.2969 14.4401,25.5039z" />
        <Style x:Key="ModifiablePathStyle"
               TargetType="{x:Type Path}">
            <Setter Property="Stretch"
                    Value="Uniform" />
            <Setter Property="Data"
                    Value="{Binding Data, Source={StaticResource vRedo}}" />
        </Style>
 </MyWindow.Resources>

Aquí está su uso:

<Path Style="{StaticResource ModifiablePathStyle}" Fill="Blue"/>
<Path Style="{StaticResource ModifiablePathStyle}" Fill="Red"/>
<Path Style="{StaticResource ModifiablePathStyle}" Fill="Green"/>

Aquí está el resultado de los tres:

ingrese la descripción de la imagen aquí


He descubierto que una buena fuente de iconos vectoriales (con versiones Xaml de cortar / pegar para descargar) se puede encontrar en Material Design Icons

Si no está en contra del uso de herramientas de terceros, considere echar un vistazo a SharpVectors. Está haciendo un gran trabajo con SVG: análisis, conversión XAML, visualización, etc.

Editar: es posible que no haya entendido su pregunta, puede que sea mejor con la respuesta de Chris W.;)

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *