WPF: align the last two controls in the StackPanel / DockPanel on the right side

Question

This code still does not work:

<DockPanel > <Button Content="Start" Command="{Binding Path=FirstDateCommand}" /> <Button Content="Back" Command="{Binding Path=PreviousDateCommand}" /> <DatePicker Width="150" SelectedDate="{Binding Path=SelectedDate}" DisplayDateStart="{Binding Path=MinDate}" DisplayDateEnd="{Binding Path=MaxDate}" SelectedDateFormat="Long" /> <Button Content="Forward" Command="{Binding Path=NextDateCommand}" /> <Button Content="End" Command="{Binding Path=LastDateCommand}" /> <Button Command="{Binding PrintCommand}" Content="Print Planner" /> <Button Command="{Binding ToggleDocumentsCommand}" Content="Show Docs" /> <Button Command="{Binding MaterialExplorerShowCommand}" Content="Browse Docs" /> <Button Command="{Binding LessonPlannerCommand}" Content="Edit Planner" /> <TextBox Text="{Binding SearchText,Mode=TwoWay}" Width="50" /> <Button Command="{Binding FindAllCommand}" Content="Search" /> <DockPanel DockPanel.Dock="Right" HorizontalAlignment="Right"> <TextBlock Text="class code:" VerticalAlignment="Center" /> <ComboBox ItemsSource="{Binding GroupViewModelList}" Style="{StaticResource GroupViewModelStyle}" ItemTemplate="{StaticResource GroupViewModelItemTemplate}" Width="100"/> </DockPanel> </DockPanel> 

How to install the last two controls on the image on the right side?

UPDATE

 <Grid Name="MainGrid"> <Grid.RowDefinitions> <RowDefinition Height="40" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <Grid Margin="10,10,10,0" Grid.Row="0" Name="ButtonBar"> <StackPanel FocusManager.IsFocusScope="True" Orientation="Horizontal"> <ComboBox AlternationCount="2" FontSize="16" VerticalContentAlignment="Center" Width="100" ItemContainerStyle="{StaticResource alternateColor}" ItemsSource="{Binding Source={x:Static Member=Fonts.SystemFontFamilies}}" x:Name="fontComboFast"> <ComboBox.ItemsPanel> <ItemsPanelTemplate> <VirtualizingStackPanel VirtualizingStackPanel.VirtualizationMode="Recycling" /> </ItemsPanelTemplate> </ComboBox.ItemsPanel> <ComboBox.ItemTemplate> <DataTemplate> <TextBlock Width="100" Text="{Binding}" FontFamily="{Binding }" /> </DataTemplate> </ComboBox.ItemTemplate> </ComboBox> <!--<View:FormatButtonBar />--> <View:DateNavigatorView /> <View:LessonPlannerView /> <!--<View:TextFormatBarUC />--> </StackPanel> </Grid> 

Two controls are in the utility LessonPlannerView (UserControl)

Inside LessonPlannerView you will find this code:

 ... <Grid > <DockPanel> <Button Command="{Binding PrintCommand}" Content="Print Planner" /> <Button Command="{Binding ToggleDocumentsCommand}" Content="Show Docs" /> <Button Command="{Binding MaterialExplorerShowCommand}" Content="Browse Docs" /> <Button Command="{Binding LessonPlannerCommand}" Content="Edit Planner" /> <TextBox Text="{Binding SearchText,Mode=TwoWay}" Width="50" /> <Button Command="{Binding FindAllCommand}" Content="Search" /> <StackPanel x:Name="ClassCodeChooser" Orientation="Horizontal" DockPanel.Dock="Right" HorizontalAlignment="Right"> <TextBlock Text="class code:" VerticalAlignment="Center" /> <ComboBox ItemsSource="{Binding SchoolclassCodeList}" /> </StackPanel> </DockPanel> </Grid> </UserControl> 

Answer 1

This should be fine, but you really don't need a nested DockPanel. You can change the internal DockPanel to a horizontal StackPanel.

But the real problem is that your external DockPanel does not seem to expand to the full width of its container. Set the background on the DockPanel's outer panel to give you a visual idea of ​​why it doesn't fill its container.

In response to the explanation below, adding the following example

 <Grid Name="ButtonBar"> <Grid.RowDefinitions> <RowDefinition Height="40" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <DockPanel Grid.Row="0"> <View:FormatButtonBar /> <!-- this will dock left --> <View:DateNavigatorView /> <!-- this will dock left --> <View:LessonPlannerView /> <!-- this will dock left --> <View:TextFormatBarUC /> <!-- this will fill --> </DockPanel> </Grid>