How to change RadDiagramShape background color with VisualStateManager in xaml

2 posts, 0 answers
  1. Nurzed
    Nurzed avatar
    1 posts
    Member since:
    Jul 2012

    Posted 18 Feb 2013 Link to this post

    Hi Telerik team'

    I want to change Background/Border color of RadDiagramShape when it selected. And I have tried VisualStateManager in the xaml coding but not works VisualState Events (MouseOver, Selected ...).

    How to solve it? Please help me.

    <DataTemplate x:Key="ClassTemplate">
        <Grid x:Name="Root">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal"/>
                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <ColorAnimation Duration="0" To="#FFF0FFE4" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ShapeBorder"/>
                            <ColorAnimation Duration="0" To="#FFA5CA91" Storyboard.TargetProperty="(BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="ShapeBorder"/>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Pressed">
                        <Storyboard>
                            <ColorAnimation Duration="0" To="#FFF0FFE4" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ShapeBorder"/>
                            <ColorAnimation Duration="0" To="#FFA5CA91" Storyboard.TargetProperty="(BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="ShapeBorder"/>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Disabled" />
                </VisualStateGroup>
                <VisualStateGroup x:Name="FocusStates">
                    <VisualStateGroup.Transitions>
                        <VisualTransition GeneratedDuration="0" />
                    </VisualStateGroup.Transitions>
                    <VisualState x:Name="Unfocused">
                        <Storyboard>
                            <ColorAnimation Duration="0" To="#FFF0FFE4" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ShapeBorder"/>
                            <ColorAnimation Duration="0" To="#FFA5CA91" Storyboard.TargetProperty="(BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="ShapeBorder"/>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Focused">
                        <Storyboard>
                            <ColorAnimation Duration="0" To="#FFF0FFE4" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ShapeBorder"/>
                            <ColorAnimation Duration="0" To="#FFA5CA91" Storyboard.TargetProperty="(BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="ShapeBorder"/>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="SelectionStates">
                    <VisualState x:Name="Unselected" />
                    <VisualState x:Name="Selected">
                        <Storyboard>
                            <ColorAnimation Duration="0" To="#FFF0FFE4" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ShapeBorder"/>
                            <ColorAnimation Duration="0" To="#FFA5CA91" Storyboard.TargetProperty="(BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="ShapeBorder"/>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="SelectedUnfocused">
                        <Storyboard>
                            <ColorAnimation Duration="0" To="#FFF0FFE4" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ShapeBorder"/>
                            <ColorAnimation Duration="0" To="#FFA5CA91" Storyboard.TargetProperty="(BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="ShapeBorder"/>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Border BorderBrush="#FF87ACBE" BorderThickness="2" VerticalAlignment="Top" Grid.RowSpan="2"
                CornerRadius="5" Background="#FFF1FAFF" x:Name="ShapeBorder">

    <!-- ... -->

            </Border>
        </Grid>
    </DataTemplate>
  2. Pavel R. Pavlov
    Admin
    Pavel R. Pavlov avatar
    1182 posts

    Posted 20 Feb 2013 Link to this post

    Hello Nurzed,

    I have answered a similar question in this forum thread. Please take a look at the attached project in that post and let me know if it works for you.

    Regards,
    Pavel R. Pavlov
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. DevCraft banner
Back to Top