Используйте флажок в качестве переключателя в расширителе - PullRequest
Новая
       13

Используйте флажок в качестве переключателя в расширителе

2 голосов
/ 01 декабря 2010

Я новичок в wpf и должен решить следующую проблему.

Мне нужно создать список (я использую список) элементов, которые могут быть расширены (расширитель). Проблема в том, что они могут быть расширены, только если они были «выбраны». Каждый элемент списка должен иметь флажок и текст.

Итак, очень простой пример, чтобы проиллюстрировать, что я имею в виду: 

<listbox>
<item>(checkbox) John Doe</item>
<item>(checkbox) Mike Murray</item>
</listbox>

Если установлены какие-либо (допускается несколько) флажков в списке, то элемент раскрывается, показывая больше данных.

Опять пример: 

<listbox>
<item>
   (checkbox-checked) John Doe
   Some extra data shown in expanded area
</item>
<item>
   (checkbox-unchecked) Mike Murray</item>
</listbox>

Я не могу заставить расширитель использовать флажок в качестве 'togglebutton'.

Может ли кто-нибудь помочь мне? Некоторый пример кода будет очень кстати ...

Ответы [ 2 ]

2 голосов
/ 02 декабря 2010

Это должно сработать: 

<ListBox>
    <ListBox.Resources>
        <Style TargetType="Expander">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Expander">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="Auto" />
                            </Grid.RowDefinitions>

                            <CheckBox
                                IsChecked="{Binding Path=IsExpanded, RelativeSource={RelativeSource TemplatedParent}}"
                                Content="{TemplateBinding Header}"
                                />
                            <ContentControl
                                x:Name="body"
                                Grid.Row="1" Content="{TemplateBinding Content}"
                                />
                        </Grid>

                        <ControlTemplate.Triggers>
                            <Trigger Property="IsExpanded" Value="False">
                                <Setter TargetName="body" Property="Visibility" Value="Collapsed" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </ListBox.Resources>

    <Expander Header="One">
        Content one
    </Expander>

    <Expander Header="Two">
        Content two
    </Expander>
</ListBox>

Я определил здесь Style, который изменяет Template любых Expander элементов управления, к которым применяется Style. (И поскольку я поместил Style в ListBox.Resources, он автоматически будет применяться к Expander элементам управления в списке.)

Хитрость для того, чтобы заставить работать CheckBox, заключается в том, что когда вы помещаете его (или вообще любой элемент управления на основе ToggleButton) в шаблон Expander, вам необходимо использовать привязку данных, настроенную с его набором RelativeSource до TemplatedParent. Это обеспечивает двустороннюю привязку - это означает, что CheckBox не только отражает текущее состояние расширителя, но также может изменять текущее состояние.

0 голосов
/ 12 декабря 2012

Все, что вам нужно, чтобы добавить флажок в заголовке, это код: 

            <telerik:RadExpander.Header>
                <StackPanel Orientation="Horizontal">
                    <CheckBox VerticalAlignment="Center"/>
                    <TextBlock Margin="5,0,0,0">Legend</TextBlock>
                </StackPanel>
            </telerik:RadExpander.Header>

Я использую Rad Control, то же самое можно сделать с помощью стандартного расширителя

...