none
Изменение цвета столбцов на графике (WPF) RRS feed

  • Вопрос

  • Добрый день! Подскажите пожалуйста как изменить подсветку столбца при нажатии на другой столбец?

    ПОДРОБНОСТИ:

    СкринШот

    На скриншоте видно, что были нажаты 2 столбца (черным выделены), а Нужно чтобы при нажатии на второй столбец, первый возвращался в исходное состояние.

    XAML:

    ControlTemplate:

    <ControlTemplate x:Key="BarSeriesTemplate" x:Name="Temp" TargetType="{x:Type dxc:CustomModelControl}">
          <Grid Name="zae">
            <Border x:Name="border" Style="{DynamicResource BorderStyle}" Opacity="0.25" CornerRadius="5,5,0,0" Margin="0,-4,0,0" RenderTransformOrigin="0.5,0.5">
              <Border.RenderTransform>
                <ScaleTransform/>
              </Border.RenderTransform>
            </Border>
            <Border x:Name="border11" Style="{DynamicResource BorderStyle}" CornerRadius="3,3,0,0" Margin="4,0,4,0">
              <Border CornerRadius="2,2,0,0" Margin="1,1,1,0">
                <Border.Background>
                  <Binding Path="PointColor" Converter="{StaticResource brushOverlayConverter}">
                    <Binding.ConverterParameter>
                      <LinearGradientBrush EndPoint="0,0.5" StartPoint="1,0.5">
                        <GradientStop Color="#FFB2B2B2" Offset="0"/>
                        <GradientStop Color="#FFC2C2C2" Offset="1"/>
                      </LinearGradientBrush>
                    </Binding.ConverterParameter>
                  </Binding>
                </Border.Background>
              </Border>
    
            </Border>
            <Grid.Triggers>
              <EventTrigger RoutedEvent="MouseEnter">
                <BeginStoryboard>
                  <Storyboard TargetName="border">
                    <DoubleAnimation Duration="0:0:0.25" To="1.1" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)">
                      <DoubleAnimation.EasingFunction>
                        <BackEase Amplitude="2" EasingMode="EaseOut"/>
                      </DoubleAnimation.EasingFunction>
                    </DoubleAnimation>
                    <DoubleAnimation Duration="0:0:0.25" To="1.05" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)">
                      <DoubleAnimation.EasingFunction>
                        <BackEase Amplitude="2" EasingMode="EaseOut"/>
                      </DoubleAnimation.EasingFunction>
                    </DoubleAnimation>
                    <DoubleAnimation Duration="0:0:0.25" To="0.5" Storyboard.TargetProperty="(UIElement.Opacity)">
                      <DoubleAnimation.EasingFunction>
                        <BackEase Amplitude="2" EasingMode="EaseOut"/>
                      </DoubleAnimation.EasingFunction>
                    </DoubleAnimation>
                  </Storyboard>
                </BeginStoryboard>
              </EventTrigger>
              <EventTrigger RoutedEvent="MouseLeave">
                <BeginStoryboard>
                  <Storyboard TargetName="border">
                    <DoubleAnimation Duration="0:0:0.5" To="0.25" Storyboard.TargetProperty="(UIElement.Opacity)">
                      <DoubleAnimation.EasingFunction>
                        <CircleEase EasingMode="EaseOut"/>
                      </DoubleAnimation.EasingFunction>
                    </DoubleAnimation>
                    <DoubleAnimation Duration="0:0:0.5" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)">
                      <DoubleAnimation.EasingFunction>
                        <CircleEase EasingMode="EaseOut"/>
                      </DoubleAnimation.EasingFunction>
                    </DoubleAnimation>
                    <DoubleAnimation Duration="0:0:0.5" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)">
                      <DoubleAnimation.EasingFunction>
                        <CircleEase EasingMode="EaseOut"/>
                      </DoubleAnimation.EasingFunction>
                    </DoubleAnimation>
                  </Storyboard>
                </BeginStoryboard>
              </EventTrigger>
    
            </Grid.Triggers>
          </Grid>
        </ControlTemplate>
    


    Style:

    <Style x:Key="BorderStyle" TargetType="Border">
          <Setter Property="Background" Value="{Binding Path=PointColor, ConverterParameter=Gray, Converter={StaticResource brushOverlayConverter}}" />
          <Style.Triggers>
            <EventTrigger RoutedEvent="MouseLeftButtonDown">
              <BeginStoryboard>
                <Storyboard >              
                  <ColorAnimation Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)"
                   From="White" To="Black"
                   Duration="0:0:0.4"
                   AutoReverse="False"/>
                </Storyboard>
              </BeginStoryboard>
            </EventTrigger>
          </Style.Triggers>
        </Style>
    

    Как это можно реализовать????


    10 августа 2011 г. 9:23

Ответы

  • Думаю тут придется ставить обработчик события при выделении объекта на картинке. При выделении сохранять в какое-либо свойство выбранный объект(столбец на графике) и сохранять так же его стиль и после этого уже преобразовывать его.

    Делать это надо для того, чтобы дальше дописать в методе, что при выделении столбца, у сохраненном в свойстве столбце ставить обратно старый стиль и после этого уже производить описанные выше операции. Другого способа (с использованием тока xaml) я пока не вижу.


    [My blog] [My E-mail]
    • Помечено в качестве ответа Abolmasov Dmitry 29 августа 2011 г. 11:50
    14 августа 2011 г. 17:56

Все ответы

  • Может попробовать определить событие PreviewMouseLeftButtonDown для контейнера ваших столбцов, в котором для TargetType = ТипСтолбца сбрасывать стиль выделенного столбца. А после в событии MouseLeftButtonDown будет назначатся стиль выделенного столбца. Попробуйте, может сработать.


    Для связи [mail]
    11 августа 2011 г. 9:01
  • Собственно в том то и загвоздка, что выделение столбца это фикция, для изменения цвета используется Storyboard +ColorAnimation при событии MouseLeftButtonDown, а как сделать Storyboard.Reverse()  не совсем понимаю((

    12 августа 2011 г. 1:37
  • Думаю тут придется ставить обработчик события при выделении объекта на картинке. При выделении сохранять в какое-либо свойство выбранный объект(столбец на графике) и сохранять так же его стиль и после этого уже преобразовывать его.

    Делать это надо для того, чтобы дальше дописать в методе, что при выделении столбца, у сохраненном в свойстве столбце ставить обратно старый стиль и после этого уже производить описанные выше операции. Другого способа (с использованием тока xaml) я пока не вижу.


    [My blog] [My E-mail]
    • Помечено в качестве ответа Abolmasov Dmitry 29 августа 2011 г. 11:50
    14 августа 2011 г. 17:56