jeudi 15 juillet 2021

Problem to use png in grayscale and keep transparency

I have to create a toggle button with two pictures when it's checked or not. When the toggle button isn't enabled the pictures must be gray. I base my control on a Checkbox and create a new style.

It's working but a have problem with transparency around the pictures. Transparency become white in the gray pictures. picture in gray

Have you an elegante solution? (I found a lot of code behind but this means a lot for such a small problem)

Here my style:

<Style x:Key="OnOffToggle" TargetType="{x:Type local:ToggleButton}">
    <Setter Property="Width" Value="60"/>
    <Setter Property="Height" Value="60"/>
    <Setter Property="Margin" Value="5"/>
    <Setter Property="Cursor" Value="Hand"/>
    <Setter Property="IsChecked" Value="{Binding IsChecked}"/>
    <Setter Property="IsEnabled" Value="{Binding IsEnable}"/>
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:ToggleButton}">
                <Grid>
                    <Image Visibility="{Binding IsEnable, Converter={converters:BoolToVisibilityConverter VisibilityWhenDisable=Hidden}}"
                        x:Name="checkboxImage" Source="OnOffs_Down.png"/>
                    <Image Visibility="{Binding IsEnable, Converter={converters:BoolToVisibilityConverter VisibilityWhenDisable=Hidden, IsVisibleWhenEqual=False}}"
                        Width="{Binding ActualWidth, ElementName=checkboxImage}" Height="{Binding ActualHeight, ElementName=checkboxImage}">
                        <Image.Source>
                            <FormatConvertedBitmap Source="{Binding Source, ElementName=checkboxImage}" DestinationFormat="Gray8" />
                        </Image.Source>
                    </Image>
                    <ContentPresenter/>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter TargetName="checkboxImage" Property="Source" Value="OnOffs_Up.png"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>



Aucun commentaire:

Enregistrer un commentaire