如何扩展RadPanelBar自定义控件ItemContainerStyle?

时间:2011-12-28 16:39:17

标签: wpf xaml telerik custom-controls radpanelbar

我正在使用Telerik的RadPanelBar并通过从RadPanelbar派生类来自定义它。但是,当我启动项目时,将正常的黑色主题应用于控件。如何覆盖这一点。如果我在本地应用程序的xaml中尝试此设置(我的意思是不在customcontrol库中),那么它的工作原理与我想要的完全相同)

这是一个示例

<Style TargetType="{x:Type local:CISAccordion}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:CISAccordion}">
                <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}">
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="ItemContainerStyle" Value="{StaticResource TopLevelStyle}"/>
    <Setter Property="FontFamily" Value="Microsoft Sans Serif"/>
    <Setter Property="FontSize" Value="11"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled"/>

</Style>
<Style x:Key="TopLevelStyle"  x:Name="RadPanelBarItemStyle"  TargetType="{x:Type telerik:RadPanelBarItem}">
    <Setter Property="Background">
        <Setter.Value>
            <SolidColorBrush Color="{DynamicResource {x:Static SystemColors.GradientInactiveCaptionColorKey}}"/>
        </Setter.Value>
    </Setter>
    <Setter Property="BorderBrush">
        <Setter.Value>
            <SolidColorBrush Color="{DynamicResource {x:Static SystemColors.GradientInactiveCaptionColorKey}}"/>
        </Setter.Value>
    </Setter>
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    <Setter Property="VerticalContentAlignment" Value="Stretch"/>
    <Setter Property="ChildItemsTemplate">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type telerik:RadPanelBarItem}">
                <Grid x:Name="RootElement">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid x:Name="HeaderRow" Background="Transparent">
                        <!--<Border x:Name="MouseOverVisual" BorderBrush="#FFFFC92B" BorderThickness="1" CornerRadius="1" Opacity="0">
                                <Border BorderBrush="White" BorderThickness="1" CornerRadius="0">
                                    <Border.Background>
                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                            <GradientStop Color="#FFFFFBA3" Offset="1"/>
                                            <GradientStop Color="#FFFFFBDA" Offset="0"/>
                                        </LinearGradientBrush>
                                    </Border.Background>
                                </Border>
                            </Border>
                            <Border x:Name="SelectionVisual" BorderBrush="#FFFFC92B" BorderThickness="1" CornerRadius="1" Opacity="0">
                                <Border BorderBrush="White" BorderThickness="1" CornerRadius="0">
                                    <Border.Background>
                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                            <GradientStop Color="#FFFCE79F" Offset="1"/>
                                            <GradientStop Color="#FFFDD3A8"/>
                                        </LinearGradientBrush>
                                    </Border.Background>
                                </Border>
                            </Border>-->
                        <Border x:Name="DisabledVisual" BorderBrush="#FF989898" BorderThickness="1" CornerRadius="1" Opacity="0">
                            <Border BorderBrush="Transparent" BorderThickness="1" Background="#FFE0E0E0" CornerRadius="0"/>
                        </Border>
                        <ContentControl x:Name="Header" ContentTemplate="{TemplateBinding HeaderTemplate}" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        <Rectangle x:Name="FocusVisual" IsHitTestVisible="False" RadiusY="2" RadiusX="2" Stroke="Black" StrokeThickness="1" StrokeDashArray="1 2" Visibility="Collapsed"/>
                    </Grid>
                    <Grid x:Name="ItemsContainer" Grid.Row="1" Visibility="Collapsed">
                        <ItemsPresenter/>
                    </Grid>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsSelected" Value="True">
                        <!--<Setter Property="Opacity" TargetName="SelectionVisual" Value="1"/>-->
                    </Trigger>
                    <Trigger Property="IsFocused" Value="True">
                        <Setter Property="Visibility" TargetName="FocusVisual" Value="Visible"/>
                    </Trigger>
                    <Trigger Property="IsExpanded" Value="True">
                        <Setter Property="Visibility" TargetName="ItemsContainer" Value="Visible"/>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Opacity" TargetName="DisabledVisual" Value="1"/>
                    </Trigger>
                    <!--<EventTrigger RoutedEvent="Mouse.MouseEnter" SourceName="HeaderRow">
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Duration="0:0:0.2" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="MouseOverVisual"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>
                        <EventTrigger RoutedEvent="Mouse.MouseLeave" SourceName="HeaderRow">
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Duration="0:0:0.2" To="0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="MouseOverVisual"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>-->
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="Level" Value="1">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type telerik:RadPanelBarItem}">
                        <Grid x:Name="RootElement" SnapsToDevicePixels="True">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <Grid x:Name="HeaderRow">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto"/>
                                    <ColumnDefinition Width="Auto"/>
                                    <ColumnDefinition Width="Auto"/>
                                    <ColumnDefinition Width="*"/>
                                    <ColumnDefinition Width="Auto"/>
                                </Grid.ColumnDefinitions>
                                <Border x:Name="NormalVisual" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="5">
                                    <Border BorderBrush="White" BorderThickness="1" Background="{TemplateBinding Background}"/>
                                </Border>
                                <Border x:Name="SelectVisual" BorderThickness="1" Grid.ColumnSpan="5" Opacity="0" BorderBrush="{x:Null}">
                                    <Border BorderThickness="1" Background="{x:Null}" BorderBrush="{x:Null}"/>
                                </Border>
                                <Border x:Name="DisabledVisual" BorderBrush="#FF989898" BorderThickness="1" Grid.ColumnSpan="5" Opacity="0">
                                    <Border BorderBrush="Transparent" BorderThickness="1" Background="{x:Null}"/>
                                </Border>
                                <Path x:Name="arrow" Grid.Column="5" Visibility="{Binding ArrowVisible}" Data="M1,1.5L4.5,5 8,1.5" HorizontalAlignment="Right" Margin="7,0" Opacity="1" RenderTransformOrigin="0.5,0.5" Stretch="None" Stroke="Black" StrokeThickness="2" VerticalAlignment="Center">
                                    <Path.RenderTransform>
                                        <RotateTransform Angle="0"/>
                                    </Path.RenderTransform>
                                </Path>
                                <ContentControl x:Name="Header" Grid.ColumnSpan="4" ContentTemplate="{TemplateBinding HeaderTemplate}" Foreground="{TemplateBinding Foreground}" FontSize="{TemplateBinding FontSize}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                <Rectangle x:Name="FocusVisual" Grid.ColumnSpan="5" Grid.Column="0" IsHitTestVisible="False" Stroke="Black" StrokeThickness="1" StrokeDashArray="1 2" Visibility="Collapsed"/>
                            </Grid>
                            <Grid x:Name="ItemsContainer" Grid.Row="1" Visibility="Collapsed">
                                <telerik:LayoutTransformControl x:Name="transformationRoot" IsTabStop="False">
                                    <ItemsPresenter/>
                                </telerik:LayoutTransformControl>
                            </Grid>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter Property="Opacity" TargetName="SelectVisual" Value="1"/>
                            </Trigger>
                            <Trigger Property="IsFocused" Value="True">
                                <Setter Property="Visibility" TargetName="FocusVisual" Value="Visible"/>
                            </Trigger>
                            <Trigger Property="IsExpanded" Value="True">
                                <Setter Property="LayoutTransform" TargetName="arrow">
                                    <Setter.Value>
                                        <TransformGroup>
                                            <RotateTransform Angle="180"/>
                                        </TransformGroup>
                                    </Setter.Value>
                                </Setter>
                                <Setter Property="Visibility" TargetName="ItemsContainer" Value="Visible"/>
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter Property="Opacity" TargetName="DisabledVisual" Value="1"/>
                                <Setter Property="Opacity" TargetName="NormalVisual" Value="0"/>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="True"/>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Trigger>
    </Style.Triggers>

</Style>

如果我将这个TopLevelStyle放在App.xaml中并将其作为itemContainerStyle提供,那么它将正常工作意味着控件将具有我想要的颜色和动画。

1 个答案:

答案 0 :(得分:1)

我发现了另一种方法,使用UserControl然后应用样式。从Generic.xaml应用主题时它不起作用。如果有任何其他方式我会非常感谢帮助