Having trouble with custom panel coding -- can't figure out how to access properties of children

Question

I'm working on a timeline that marks regions of audio signals when the user clicks the start and stop button. The user may click start and stop multiple times during a sampling session, and the time between presses should appear in the timeline as highlighted sections.

The overall design is an ItemsControl whose ItemsPanelTemplate is a custom panel. Each panel represents an audio track. The panel has a StartTime and EndTime dependency property, which is databound to the UserControl's Start and End properties, so that I can control the amount of time viewed by all of the tracks from a single pair of properties. The ItemsControl is databound to an ObservableCollection, and Track is an ObservableCollection. The intent here is that when I add a new highlight, this updates the Track, and then I add / overwrite the Track in the ObservableCollection, which should auto-update my GUI.

Highlight looks like this:

public class Highlight
{
    public DateTime Start { get; set; }
    public DateTime End { get; set; }
    public string Description { get; set; }

    public Highlight() {}

    public Highlight(DateTime start, DateTime end, string description)
    {
        Start = start;
        End = end;
        Description = description;
    }
}

I believe I have the usercontrol and panel coded properly except for one small detail (the most important one, actually). When I click Start and Stop, I add a new Highlight instance to the OC, and set the plain-old C# properties Description, Start, and End.

When the user clicks End and all of the objects get updated, eventually ArrangeOverride for my Panel gets called, and I need to get the Highlight's Start and End properties. This allows me to calculate the offset from the Track's Start time and draw the highlight in the right spot. The problem is that I only have UIElements to work with (Children of the Panel). I can't cast this to my Highlight object, so I assume I need to set up databinding for the Highlight in XAML somewhere, so that it pulls the proper C# property value automatically.

Sorry for the long-winded description, but I think my problem boils down to this single question -- how do I set up the XAML or code behind so that the UIElements of my Panel are correctly databound to the underlying Highlight instances?

Thanks so much for the help in advance. I've learned a ton from everyone here on SO, but clearly have a long way to go before I master these topics.

EDIT -- I was wrong, my databinding for Start and End for each Track wasn't working. I had a DependencyProperty in my UserControl for each, and I thought I could databind to them from the XAML to force the Track panel's sizing, as follows:

<ItemsControl.ItemContainerStyle>
    <Style>
        <Setter Property="local:Track.StartTime" Value="{Binding Path=Start}"/>
        <Setter Property="local:Track.EndTime" Value="{Binding Path=End}"/>
    </Style>
</ItemsControl.ItemContainerStyle>

but that didn't work. I guess I need to figure this out first, because if StartTime and EndTime don't get set properly, the ArrangeOverride call will fail due to an infinite size request.

Answer 1

Ok, I finally got it working. The correct way to implement this feature was to use attached properties on my Track panel. Then I just had to databind the Start and End attached properties to the Start and End properties in my Highlight class. At one point, I had issues compiling because the Start and End attached properties apparently weren't found in my Track class, but fortunately after re-reading the MSDN article on them, I realized that I had changed the names of the properties without changing the names of the setter / accessor methods!!!