Discussion :

[waspy59]

Bonjour à tous,

Je suis en train de decouvrir WPF et je souhaiterai créer un bouton invisible. En fait mon bouton contient une image et un texte de couleur blanche, et je souhaiterai que la structure du bouton soit invisible (pas de bordure visible, font transparent).

Est-ce faisable?

Pour l'instant j'ai testé cela... (très basique):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
<StackPanel Grid.Column="0" Grid.Row="1" Orientation="Vertical">
            <Button  Margin=" 5,5,5,5" Height="50" Background="Transparent" BorderBrush="Transparent">
                <StackPanel Orientation="horizontal">
                    <Image Source="/Image/Printer.png"/>
                    <TextBlock Text="Printer" FontSize="20" VerticalAlignment="Center" Foreground="White"/>
                </StackPanel>
            </Button>

Le fond du bouton est bien transparent, mais on distingue encore le contour du bouton sur le fond uni de ma Window.

merci pour votre aide

[MABROUKI]

bonjour

Visibilty.Hidden est ton ami...!!!

[waspy59]

hello

malheureusement non, car si je mets visibility sur hidden, tout le bouton disparait....

Ce que je souhaite s'est que seuls l'image et le texte soient visibles... mais que tout le reste (bordure ect) soient invisible

[Noxen]

Tu peux créer un ControlTemplate spécifique pour ton bouton, dans lequel tu ne mettra que ce dont tu as besoin, afin d'en redéfinir complètement l'apparence visuelle.

[MABROUKI]

bonjour
Question mal formulée....!!!
En voici un désespérément "inerte" sans focus avec un "ellipse" mais tu peut mettre un control image ....
Désespérément "inerte" mais "bouttonneux...
le "Set to true to not get any properties from the themes" evacue les couleurs du border, du borderbrush et ses couleurs de frétillements(triggers) -->

code XAML exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
 
<Window x:Class="WpfButtons.Window2"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window2" Height="300" Width="300">
    <Window.Resources>
        <Style TargetType="Button">
            <!--Set to true to not get any properties from the themes.-->
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <Ellipse Fill="{TemplateBinding Background}"/>
                            <ContentPresenter HorizontalAlignment="Center"
                            VerticalAlignment="Center"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <Grid>
        <Button 
            Width="120" Height="65" Background="AliceBlue" 
            x:Name="monbouton" Content="unbouton">
        </Button>
    </Grid>
</Window>

bon code...

[waspy59]

Hello

merci pour votre aide et l'exemple. Je vais tester cela.

Par contre, y a t-il un endroit ou je pourrai trouver des modèles de template pour des boutons et autres contrôles?

merci

[MABROUKI]

bonjour
Ici un lien MSDN intitulé "Button ControlTemplate Example - MSDN - Microsoft"

https://www.google.fr/url?sa=t&rct=j...9dUMpdYMyDPRzP

cet exemple figure egalement dans la MSDN Help Libraire -Fr....

[waspy59]

Merci MABROUKI, ton lien m'a bien aidé.

J'ai réussi à faire ce que je voulais ou presque ;-)

Pour ceux que cela interesse:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
 <Style TargetType="Button" x:Key="ElipseButton">
            <Setter Property="Width" Value="70"/>
            <Setter Property="Height" Value="70"/>
            <Setter Property="Margin" Value="5"/>
            <Setter Property="HorizontalContentAlignment" Value="Center"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="Template">
 
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
 
                            <Ellipse Fill="{TemplateBinding Background}"/>
 
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Grid>
 
 
                        <ControlTemplate.Triggers>
 
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" Value="{StaticResource GradientRed}" />
                            </Trigger>
 
                            <Trigger Property="IsFocused" Value="True">
                                <Setter Property="Background" Value="{StaticResource GradientBlue}" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<RadialGradientBrush x:Key="GradientBlue" GradientOrigin="0.5,0.5" Center="0.5,0.5" RadiusX="0.5" RadiusY="0.5">
            <RadialGradientBrush.GradientStops>
                <GradientStop Color="#005DAA" Offset="0" />
                <GradientStop Color="Transparent" Offset="1.0" />
            </RadialGradientBrush.GradientStops>
        </RadialGradientBrush>
 
        <RadialGradientBrush x:Key="GradientRed" GradientOrigin="0.5,0.5" Center="0.5,0.5" RadiusX="0.5" RadiusY="0.5">
            <RadialGradientBrush.GradientStops>
                <GradientStop Color="#FF0000" Offset="0" />
                <GradientStop Color="Transparent" Offset="1.0" />
            </RadialGradientBrush.GradientStops>
        </RadialGradientBrush>

[micka132]

Pour le coup, pourquoi tu as une ellipse si tu ne souhaitais pas de bord?