Search code examples
c#wpfxamlgridstackpanel

Attach the last item of a stackPanel horizontal to the right


In my WPF application, i created a dockpanel with a stackpanel with orientation=horizontal.

I add some buttons on my stackpanel ( like a toolbar)

I would like to be able to set my last item on my stackpanel to be attached to the right of my window.

Some picture in order to explain.

What i have :

enter image description here

What i would to have :

enter image description here

Here is my XAML :

<DockPanel  Height="40" VerticalAlignment="Top" >
    <Border>

        <StackPanel Orientation="Horizontal" Background="{StaticResource DegradeCouleurTheme}">

            <Image  Source="ElipseGauche.png" Height="28" Margin="10,0,0,0" />

            <StackPanel  Orientation="Horizontal" Height="28">

                <StackPanel.Background>
                    <ImageBrush ImageSource="ElipseMilieu.png"></ImageBrush>
                </StackPanel.Background>

                <Button Template="{StaticResource BoutonRessourcesTpl}" Click="Button_Click_Goto_Premier">
                    <Image Source= "xRtDiva_XWPF_TBR_PREMIER.PNG_IMAGES.png" Height="16"/>
                </Button>

                <Button Template="{StaticResource BoutonRessourcesTpl}" Click="Button_Click_Goto_Precedent">
                    <Image Source= "xRtDiva_XWPF_TBR_PRECED.PNG_IMAGES.png" Height="16"/>
                </Button>

                <Button Template="{StaticResource BoutonRessourcesTpl}" Click="Button_Click_Goto_Suivant">
                    <Image Source= "xRtDiva_XWPF_TBR_SUIVANT.PNG_IMAGES.png" Height="16"/>
                </Button>

                <Button Template="{StaticResource BoutonRessourcesTpl}" Click="Button_Click_Goto_Dernier">
                    <Image Source= "xRtDiva_XWPF_TBR_DERNIER.PNG_IMAGES.png" Height="16"/>
                </Button>

            </StackPanel>

            <Image  Source="ElipseDroite.png" Height="28" Margin="0,0,0,0" />


            <Image  Source="ElipseGauche.png" Height="28" Margin="15,0,0,0" />

            <StackPanel  Orientation="Horizontal" Height="28">

                <StackPanel.Background>
                    <ImageBrush ImageSource="ElipseMilieu.png"></ImageBrush>
                </StackPanel.Background>

                <Button Template="{StaticResource BoutonRessourcesTpl}" Click="Button_Click_Creer" >
                    <Image Source= "Toolbar_Creer.png" Height="16" />
                </Button>

            </StackPanel>

            <Image  Source="ElipseDroite.png" Height="28" Margin="0,0,0,0" />

            <Image  Source="ElipseGauche.png" Height="28" Margin="15,0,0,0" />


            <StackPanel  Orientation="Horizontal" Height="28">

                <StackPanel.Background>
                    <ImageBrush ImageSource="ElipseMilieu.png"></ImageBrush>
                </StackPanel.Background>

                <Button Template="{StaticResource BoutonRessourcesTpl}" Click="Button_Click_Evenement_Supprimer">
                    <Image Source= "Toolbar_Supprimer.png" Height="16"/>
                </Button>

            </StackPanel>

            <Image  Source="ElipseDroite.png" Height="28" Margin="0,0,0,0" />

            <Image  Source="ElipseGauche.png" Height="28" Margin="15,0,0,0" />


            <StackPanel  Orientation="Horizontal" Height="28">

                <StackPanel.Background>
                    <ImageBrush ImageSource="ElipseMilieu.png"></ImageBrush>
                </StackPanel.Background>

                <Button Template="{StaticResource BoutonRessourcesTpl}" Click="Button_Click_Evenement_Joints">
                    <Image Source= "Toolbar_FicJoints.png" Height="18"/>
                </Button>

            </StackPanel>

            <Image  Source="ElipseDroite.png" Height="28" Margin="0,0,0,0" />

            <Image  Source="ElipseGauche.png" Height="28" Margin="15,0,0,0" />


            <StackPanel  Orientation="Horizontal" Height="28">

                <StackPanel.Background>
                    <ImageBrush ImageSource="ElipseMilieu.png"></ImageBrush>
                </StackPanel.Background>

                <Button Template="{StaticResource BoutonRessourcesTpl}" Click="Button_Click_Evenement_Annuler" >
                    <Image Source= "Toolbar_Annuler.png" Height="16"/>
                </Button>

                <Button Template="{StaticResource BoutonRessourcesTpl}" Click="Button_Click_Evenement_Valider">
                    <Image Source= "Toolbar_Valider.png" Height="16"/>
                </Button>

            </StackPanel>

            <Image  Source="ElipseDroite.png" Height="28" Margin="0,0,0,0" />



            <Image  Source="ElipseGauche.png" Height="28" Margin="15,0,0,0" />


            <StackPanel  Orientation="Horizontal" Height="28">

                <StackPanel.Background>
                    <ImageBrush ImageSource="ElipseMilieu.png"></ImageBrush>
                </StackPanel.Background>

                <Button Template="{StaticResource BoutonRessourcesTpl}" Click="Button_Click_App_Parametrer" >
                    <Image Source= "Toolbar_Parametrer.png" Height="16"/>
                </Button>

            </StackPanel>

            <Image  Source="ElipseDroite.png" Height="28" Margin="0,0,0,0" />

            <Grid HorizontalAlignment="Right">
                <StackPanel Orientation="Horizontal" Height="28" >
                    <Image  Source="ElipseGauche.png" Height="28" Margin="15,0,0,0" />


                    <StackPanel  Orientation="Horizontal" Height="28">

                        <StackPanel.Background>
                            <ImageBrush ImageSource="ElipseMilieu.png"></ImageBrush>
                        </StackPanel.Background>

                        <Button Template="{StaticResource BoutonRessourcesTpl}" Click="Button_Click_About" >
                            <Label Margin="0,0,0,1" Foreground="White" Content="About" Height="16"  VerticalAlignment="Center" HorizontalAlignment="Center" Padding="0,0,0,0"/>
                        </Button>

                    </StackPanel>

                    <Image  Source="ElipseDroite.png" Height="28" Margin="0,0,0,0" />
                </StackPanel>
            </Grid>


        </StackPanel>

    </Border>
</DockPanel>

I tried to use a grid with horizontalaligneemnt = right on the last item of my stackpanel but it has no effect ( and it's logic !)

Anyone could help me please ?

Thanks a lot :)


Solution

  • You can not do this with a StackPanel. You will need to use a DockPanel or Grid instead.