我需要一个WPF 4的手风琴控制器

时间:2011-05-12 11:07:56

标签: .net wpf controls accordion

我正在为WPF .NET 4寻找一个Accordion控件。

我知道Codeplex上的WPF工具包有一个手风琴控件,但声明它与.NET 3.5兼容。它会在第4版中运行吗?

3 个答案:

答案 0 :(得分:4)

是的,工具包中的Accordion与.NET 4完全兼容

答案 1 :(得分:1)

是的,Accordion控件适用于.NET 4.以下是一篇解释如何使用它的文章:

http://www.c-sharpcorner.com/uploadfile/dpatra/538/

答案 2 :(得分:1)

我们为ListBox创建了一个自定义样式,其中包含扩展器。这使我们可以通过简单地设置扩展器的样式(即摘要按钮,无效时为红色等)来自定义菜单项的外观。下面是一个代码片段,可以作为起点,您可以自定义它以适合您的需要。注意:使用IsSelected绑定IsExpanded会使一次只打开一个扩展器,如果您希望一次打开多个扩展器,则将其删除。

        <Style x:Key="VerticalListBoxWithAutoScroll" TargetType="{x:Type ListBox}">
        <Setter Property="SnapsToDevicePixels" Value="true"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate>
                    <Grid>
                        <ScrollViewer x:Name="scrollviewer">
                            <ScrollViewer.Template>
                                <ControlTemplate TargetType="{x:Type ScrollViewer}" >
                                    <Grid >

                                        <ScrollBar x:Name="PART_VerticalScrollBar" Orientation="Vertical" 
                                                           Value="{TemplateBinding VerticalOffset}"
                                                           Maximum="{TemplateBinding ScrollableHeight}"
                                                           ViewportSize="{TemplateBinding ViewportHeight}"
                                                           Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
                                                           Width="{Binding Width, ElementName=Panel}">
                                            <ScrollBar.Template>
                                                <ControlTemplate>
                                                    <Track x:Name="PART_Track">
                                                        <Track.DecreaseRepeatButton>
                                                            <RepeatButton Command="ScrollBar.PageUpCommand" 
                                                                          Background="White" BorderBrush="Transparent"/>
                                                        </Track.DecreaseRepeatButton>
                                                        <Track.IncreaseRepeatButton>
                                                            <RepeatButton Command="ScrollBar.PageDownCommand" 
                                                                          Background="White" BorderBrush="Transparent"/>
                                                        </Track.IncreaseRepeatButton>
                                                        <Track.Thumb>
                                                            <Thumb BorderBrush="Transparent" 
                                                                   Background="White" Opacity="0.8" />
                                                        </Track.Thumb>
                                                    </Track>
                                                </ControlTemplate>
                                            </ScrollBar.Template>
                                        </ScrollBar>
                                        <ScrollContentPresenter Height="Auto" VerticalAlignment="Center"/>
                                    </Grid>
                                </ControlTemplate>
                            </ScrollViewer.Template>
                            <ItemsPresenter/>
                        </ScrollViewer>
                        <Grid x:Name="Panel">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="*" />
                                <RowDefinition Height="Auto" />
                            </Grid.RowDefinitions>
                            <RepeatButton Grid.Row="0" x:Name="LineUpButton" Height="30" Width="80" HorizontalAlignment="Center" Opacity="0" Visibility="Collapsed"
                                  Style="{StaticResource ScrollBarLineButton}"
                                  Content="M 0 8 L 8 8 L 4 0 Z"       
                                  Command="{x:Static ScrollBar.LineUpCommand}"       
                                  CommandTarget="{Binding ElementName=scrollviewer}"
                                  ClickMode="Hover" />
                            <RepeatButton Grid.Row="2" x:Name="LineDownButton" Height="30" Width="80" HorizontalAlignment="Center" Opacity="0" Visibility="Collapsed"
                                  Style="{StaticResource ScrollBarLineButton}"
                                  Content="M 0 0 L 4 8 L 8 0 Z" 
                                  Command="{x:Static ScrollBar.LineDownCommand}"       
                                  CommandTarget="{Binding ElementName=scrollviewer}"
                                  ClickMode="Hover"/>
                        </Grid>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="IsMouseOver" Value="True"/>
                                <Condition Property="ComputedVerticalScrollBarVisibility" SourceName="scrollviewer" Value="Visible"/>
                            </MultiTrigger.Conditions>
                            <MultiTrigger.EnterActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <DoubleAnimation Storyboard.TargetName="LineUpButton" 
                                                         Storyboard.TargetProperty="Opacity" To="0.8" Duration="0:0:0.25"/>
                                        <DoubleAnimation Storyboard.TargetName="LineDownButton" 
                                                         Storyboard.TargetProperty="Opacity" To="0.8" Duration="0:0:0.25"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </MultiTrigger.EnterActions>
                            <MultiTrigger.ExitActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <DoubleAnimation Storyboard.TargetName="LineUpButton" 
                                                         Storyboard.TargetProperty="Opacity" To="0" Duration="0:0:0.25"/>
                                        <DoubleAnimation Storyboard.TargetName="LineDownButton" 
                                                         Storyboard.TargetProperty="Opacity" To="0" Duration="0:0:0.25"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </MultiTrigger.ExitActions>
                            <Setter TargetName="LineUpButton" Property="Visibility" Value="Visible" />
                            <Setter TargetName="LineDownButton" Property="Visibility" Value="Visible" />
                        </MultiTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="ItemTemplate">
            <Setter.Value >
                <DataTemplate>
                    <StackPanel Background="White">
                        <Expander Content="{Binding}"  Width="Auto" Header="{Binding DisplayName}"
                              IsExpanded="{Binding IsSelected, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}}}" >
                        </Expander>
                    </StackPanel>
                </DataTemplate>
            </Setter.Value>
        </Setter>
    </Style>