I've been playing with the timeline demo and wanted to stack points above/below the line like in the pictured in the documentation (describing the timeline features). I'm hoping to place them at separate y-values. Is this possible? Seems like it would be from the picture.
Can someone give me a short example or point me to the right place as to how to do this?
Thanks!
Thanks - that seems to work as advertised!
Best,
Matt
Sorry, I didn't see that it is in WPF. Just change x:Name to x:Key in the resource styles.
<Style x:Name="EventPointTopStyle" …
<Style x:Name="EventPointBottomStyle" …
to
<Style x:Key="EventPointTopStyle" …
<Style x:Key="EventPointBottomStyle" …
Yeah - if I comment out that resource section, I don't get the error. Hmm... again, I'm new to this so it's probably me.
Hmm... OK, so I'm probably doing something wrong - this is new to me.
I am getting a System.Windows.Markup.XamlParseException
"Set property 'System.Windows.ResourceDictionary.DeferrableContent' threw and exception.'Line number '6' and line position '7'."
That's the xmlns line:
xmlns:igtl="clr-namespace:Infragistics.Controls.Timelines;assembly=InfragisticsWPF4.Controls.Timelines.XamTimeline.v10.2
InnerException is "Item has already been added. Key in dictionary: 'Infragistics.Controls.Timelines.EventPoint' Key being added: 'Infragistics.Controls.Timelines.EventPoint'"
I'm sure this is my being new to WPF and also to these controls.
Any help you can give?
You can do this with re-styling the event points. Try using this code:
<Grid x:Name="LayoutRoot">
<Grid.Resources>
<LinearGradientBrush x:Key="BaseBorderBrush" StartPoint="0,0" EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Color="#FFa3aeb9" Offset="0"/>
<GradientStop Color="#FF8399a9" Offset="0.3700000047683716"/>
<GradientStop Color="#FF718597" Offset="0.3709999918937683"/>
<GradientStop Color="#FF617584" Offset="1"/>
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
<Style x:Name="EventPointTopStyle" TargetType="ig:EventPoint">
<Setter Property="Width" Value="10" />
<Setter Property="Stroke" Value="{StaticResource BaseBorderBrush}"/>
<Setter Property="Fill" Value="{StaticResource BaseBorderBrush}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ig:EventPoint">
<Grid Width="{TemplateBinding Width}"
VerticalAlignment="Top"
Height="{TemplateBinding Width}">
<Ellipse Fill="{TemplateBinding Fill}"
Stroke="{TemplateBinding Stroke}"
StrokeThickness="1"/>
<Ellipse Stroke="#66FFFFFF" Margin="1,1,1,1"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Name="EventPointBottomStyle" TargetType="ig:EventPoint">
Height="{TemplateBinding Width}"
VerticalAlignment="Bottom">
</Grid.Resources>
<ig:XamTimeline>
<ig:XamTimeline.Series>
<ig:NumericTimeSeries EventPointStyle="{StaticResource EventPointTopStyle}">
<ig:NumericTimeSeries.Entries>
<ig:NumericTimeEntry Time="10" Title="Battle" />
<ig:NumericTimeEntry Time="20" Title="Battle" />
<ig:NumericTimeEntry Time="30" Title="Battle" />
<ig:NumericTimeEntry Time="70" Title="Battle" />
</ig:NumericTimeSeries.Entries>
</ig:NumericTimeSeries>
<ig:NumericTimeSeries Position="BottomOrRight"
EventPointStyle="{StaticResource EventPointBottomStyle}">
</ig:XamTimeline.Series>
</ig:XamTimeline>