3

I have an Ellipse in my WPF application. I want to change the colour of its outline whenever it is double clicked. I found this (old) tutorial about making this work by using the available MouseDown event and checking for a ClickCount of two in the event handler. This is the simplest solution to my problem and I'd like to try and get this to work before creating an empty button Control Template.
However, I'm unable to find the clicked ellipse in my code behind file. Supposedly this works in the tutorial, but I'm wondering if I'm missing anything.
Here's the code that contains the ellipse. It is the 3rd column of a grid:

<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" Grid.Column="3">
     <StackPanel Orientation="Vertical" Margin="3,1" Background="GhostWhite">
        <ItemsControl Name="FlowLinkItems" ItemsSource="{Binding FlowLinkList}">
           <ItemsControl.ItemTemplate>
              <DataTemplate>
                 <Grid Height="40">
                    <Ellipse Name="FlowLinkEllipse" Stroke="BlueViolet" Height="38" VerticalAlignment="Center" MouseDown="Ellipse_MouseDown"/>
                    <TextBlock TextAlignment="Center" HorizontalAlignment="Center" VerticalAlignment="Center" Text="{Binding Message}"></TextBlock>
                 </Grid>
              </DataTemplate>
           </ItemsControl.ItemTemplate>
        </ItemsControl>
     </StackPanel>
  </ScrollViewer>

In the tutorial, the code behind method worked like this:

private void Ellipse_MouseDown(object sender, MouseButtonEventArgs e)
  {
     if (e.ClickCount == 2)
     {
        FlowLinkEllipse.Stroke = "Red";
     }
  }

And the error I'm seeing is:

The name 'FlowLinkEllipse' does not exist in the current context

If this method is not possible I'm open to suggestions that are as simple as possible (I'm still new to WPF and the only thing my app will handle is this double click).
Note: I do have this line in my code behind and it works fine.
FlowLinkItems.MouseLeftButtonUp += FlowLinkItems_MouseLeftButtonUp;

Community
  • 1
  • 1
valsidalv
  • 761
  • 2
  • 19
  • 33
  • Maybe try x:Name="FlowLinkEllipse" ? – Mike Schwartz Dec 10 '13 at 18:33
  • 5
    The code-behind doesn't have access to template member names. – Magus Dec 10 '13 at 18:34
  • Use `DataTemplate.Triggers` instead. – Federico Berasategui Dec 10 '13 at 18:37
  • @HighCore like in this answer? http://stackoverflow.com/questions/6260571/how-to-apply-style-trigger-to-datatemplate-in-wpf If I need to access both my Ellipse and Textblock with a single click on the ItemsControl would this be the way to go? – valsidalv Dec 10 '13 at 20:47
  • @valsidalv yes, an `ItemsControl` with a bound `ItemsSource` is a visual representation of some data that is *stored somewhere else*. the Data is responsible for keeping it's own state, the UI is not responsible for keeping the state of data, therefore all properties of any UI elements inside the `ItemTemplate` should be **bound** to relevant properties in the Data Item rather than manipulated thru procedural code. – Federico Berasategui Dec 10 '13 at 20:49

1 Answers1

2

As @Magus noted, you can't reference an item from code-behind, that is inside a DataTemplate. That should be no problem here, though: sender will contain a reference to the ellipse:

private void Ellipse_MouseDown(object sender, MouseButtonEventArgs e)
{
   if (ellipse as sender == null || e.ClickCount < 2)
      return;

   var ellipse = (Ellipse)sender;
   ellipse.Stroke = System.Windows.Media.Brushes.Red;
}
McGarnagle
  • 101,349
  • 31
  • 229
  • 260
  • 1
    Of course... I tried `(Ellipse)sender` at one point but it didn't work. For future readers, the correct way of setting the Stroke colour is `ellipse.Stroke = new BrushConverter().ConvertFromString("Red") as SolidColorBrush;`. – valsidalv Dec 10 '13 at 18:58
  • 3
    @Valsidalv you don't need any `BrushConverter` stuff. Just use `System.Windows.Media.Brushes.Red` instead of magic string based stuff. – Federico Berasategui Dec 10 '13 at 20:51