Discussion :

[Nixeus]

Bonjour à tous,

Je voudrais réaliser une Form en WPF dans ce style :



Ce qui m'intéresse c'est le fait de pouvoir avoir une form avec des angles arrondis, et que cette form possède les bouton réduire et fermer en gris ( comme présent sur la capture).

J'ai déjà forcé la propriété WindowStyle à None.

Il me reste à afficher le petit bouton agrandir, réduire, et a ce que les bords soit arrondis.

Avez vous des infos à ce sujet ?

Merci beaucoup

Cordialement,

Nixeus

[Cecile5]

Salut,

Au préalable, il te faut deux images :
- une pour le bouton de réduction (reduce.png)
- une pour le bouton de fermeture (close.png)

Côté xaml :

Code xml :

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
<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        WindowStyle="None"
        AllowsTransparency="True"
        Background="Transparent"
        Height="350" Width="525">
    <Border CornerRadius="10" Background="White">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition />
            </Grid.RowDefinitions>
 
            <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Margin="5">
                <Button x:Name="btReduce" Click="btReduce_Click" Margin="0,0,5,0">
                    <Button.Template>
                        <ControlTemplate>
                            <Image Source="reduce.png" Width="16" Height="17" />
                        </ControlTemplate>
                    </Button.Template>
                </Button>
                <Button x:Name="btClose" Click="btClose_Click">
                    <Button.Template>
                        <ControlTemplate>
                            <Image Source="close.png" Width="16" Height="17" />
                        </ControlTemplate>
                    </Button.Template>
                </Button>
            </StackPanel>
        </Grid>
    </Border>
</Window>

Code behind :

Code c# :

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

1
2
3
4
5
6
7
8
9
private void btClose_Click(object sender, RoutedEventArgs e)
        {
            Close();
        }
 
        private void btReduce_Click(object sender, RoutedEventArgs e)
        {
            WindowState = System.Windows.WindowState.Minimized;
        }

Bon code.

[Nixeus]

Humm

Merci beaucoup de ta rapide aide, je vais tester cela dés que je rentre chez moi !

En revanche, je ne comprend pas pourquoi on passe en mode transparence, je pensais qu'un windowstyle à None suffisait !

En tout cas, WPF à l'air sacrémment puissant ! Je galère un peu pour le moment, mais j'ai hate de sortir la tête de l'eau et faire de belles IHM

[Cecile5]

Si tu ne mets pas Background="Transparent" sur ta fenêtre, celle-ci a un fond blanc par défaut.
Du coup ton border blanc ne se voit plus et il n'y a pas de bords arrondis.
Pour mieux comprendre teste en mettant Background="Red" sur ta fenêtre et tu verras

[Nixeus]

Me reste a faire des boutons y ressemblant et en 17px par 16px alors.

[Nixeus]

Je viens de faire ma form grâce à ton aide
Je vais faire des boutons un peu plus petit par contre.

Deux petites questions :

* J'ai bien mes angles arrondis mais je vois légerement l'effet de transparence, est-ce normal ?

* Comment autorisé le déplacement de ma fenêtre quand je clique dans le haut de ma form ?

Merci encore

Edit : Si je met la couleur de ma grid à blanc, je ne vois plus aucun arrondis, j'ai du mal à comprendre.