Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to stretch checkbox item the full width of the combobox

I have a multiply combobox with checkbox items

<ComboBox  x:Name="cmb" IsEditable="True"  IsReadOnly="True" DropDownClosed="cmb_DropDownClosed">
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
            <CheckBox Content="{Binding NmColumn }"  HorizontalAlignment="Stretch"
                      IsChecked="{Binding Path=bChecked, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" 
                      Tag="{Binding IdColumn}"
                      />
            </StackPanel>
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

When I click on checkbox all is well. But if the checkbox width less than the width of combobox, when I click to the right of the checkbox, the combobox closes. how to override this behavior?

like image 710
EvgenOrel Avatar asked Jan 04 '23 12:01

EvgenOrel


2 Answers

Set HorizontalContentAlignment to Stretch in ComboBox.ItemContainerStyle:

<ComboBox  x:Name="cmb" IsEditable="True"  IsReadOnly="True" DropDownClosed="cmb_DropDownClosed">
        <ComboBox.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Vertical">
                    <CheckBox Content="{Binding NmColumn }"  HorizontalAlignment="Stretch"
                  IsChecked="{Binding Path=bChecked, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" 
                  Tag="{Binding IdColumn}"
                  />
                </StackPanel>
            </DataTemplate> 
        </ComboBox.ItemTemplate>
        <ComboBox.ItemContainerStyle>
            <Style TargetType="{x:Type ComboBoxItem}">
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            </Style>
        </ComboBox.ItemContainerStyle>
    </ComboBox>
like image 81
Ron Avatar answered Jan 10 '23 12:01

Ron


The answer by Ramin is partially good. You aslo have to remove the <StackPanel Orientation="Horizontal"> from your data template.It's him that is restricting your checkbox from expanding on all ComboboxItem width.

<ComboBox  x:Name="cmb" IsEditable="True"  IsReadOnly="True" DropDownClosed="cmb_DropDownClosed">
    <ComboBox.ItemTemplate>
        <DataTemplate>

                <CheckBox Content="{Binding NmColumn }"  HorizontalAlignment="Stretch"
              IsChecked="{Binding Path=bChecked, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" 
              Tag="{Binding IdColumn}"
              />

        </DataTemplate> 
    </ComboBox.ItemTemplate>
    <ComboBox.ItemContainerStyle>
        <Style TargetType="{x:Type ComboBoxItem}">
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        </Style>
    </ComboBox.ItemContainerStyle>
</ComboBox>
like image 22
Bruno Avatar answered Jan 10 '23 12:01

Bruno