Is it possible to have 2 or more timelines hooked up to the movement of only one zoombar?
One way to achieve this is to hide the Zoombar from the Timelines and to add a separate Zoombar. You can try:
<UserControl x:Class="SilverlightApplication1.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:igTimeline="clr-namespace:Infragistics.Silverlight.Timeline;assembly=Infragistics.Silverlight.DataVisualization.Timeline.v9.2"
xmlns:igControls="clr-namespace:Infragistics.Silverlight.Controls;assembly=Infragistics.Silverlight.DataVisualization.Controls.v9.2"
Width="700" Height="500">
<Grid x:Name="LayoutRoot" Background="White">
<Grid.Resources>
<Style x:Name="ZoombarStyle" TargetType="igControls:XamWebZoombar">
<Setter Property="Visibility" Value="Collapsed" />
</Style>
</Grid.Resources>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition Height="70" />
</Grid.RowDefinitions>
<igTimeline:XamWebTimeline x:Name="Timeline1"
ZoombarStyle="{StaticResource ZoombarStyle}">
</igTimeline:XamWebTimeline>
<igTimeline:XamWebTimeline x:Name="Timeline2"
ZoombarStyle="{StaticResource ZoombarStyle}"
Grid.Row="1">
<igControls:XamWebZoombar x:Name="Zoombar"
Grid.Row="2"
ZoomChanged="Zoombar_ZoomChanged">
</igControls:XamWebZoombar>
</Grid>
</UserControl>
…
private void Zoombar_ZoomChanged(object sender, Infragistics.Silverlight.Controls.ZoomChangedEventArgs e)
{
this.Timeline1.Axis.ScrollPosition = e.NewRange.Scroll;
this.Timeline1.Axis.ScrollScale = e.NewRange.Scale;
this.Timeline2.Axis.ScrollPosition = e.NewRange.Scroll;
this.Timeline2.Axis.ScrollScale = e.NewRange.Scale;
}
Hello. I can not access the zoombar of my Timeline ? Why ?
It used to be as easy as calling the Timeline's Zoombar property.
Please help. I would love to capture the zoom event change arguments ...
regards
Angel Bruzos
Thank you.
One last question, and I have tried many things before bugging you, but how do I hide, not the zoombar, but the top part of the Timeline. I want to be able to show a zoombar with the time intervals but not the top part, meaning the pane, thumb , event titles.
If i create just a zoombar, there is no way to make it show a line across it with the time series.
thank you,
best regards
Angel
This is interesting point. This is possible with changing the Timeline style. You can try using:
<UserControl x:Class="SilverlightApplication5.MainPage"
xmlns:igTimeline="clr-namespace:Infragistics.Silverlight.Timeline;assembly=Infragistics.Silverlight.DataVisualization.Timeline.v9.1"
xmlns:igControls="clr-namespace:Infragistics.Silverlight.Controls;assembly=Infragistics.Silverlight.DataVisualization.Controls.v9.1"
<Style x:Name="TimelineStyle" TargetType="igTimeline:XamWebTimeline">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="igTimeline:XamWebTimeline">
<Grid>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<igTimeline:Title Content="{TemplateBinding Title}"
Style="{TemplateBinding TitleStyle}" />
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<RowDefinition Height="Auto"/>
<igTimeline:Scene x:Name="SceneElement" Height="1"
Style="{TemplateBinding SceneStyle}"
Grid.Column="0" Margin="5" />
<Canvas x:Name="DetailsPaneElement" />
<igTimeline:Legend x:Name="LegendElement"
Visibility="Collapsed"
Grid.Column="1"
Margin="10,0,0,0"/>
<Grid x:Name="ZoombarPanelElement"
Height="70"
Grid.Row="1" />
<igTimeline:MessageControl x:Name="MessageControlElement"
Style="{TemplateBinding MessageControlStyle}" />
</ControlTemplate>
</Setter.Value>
</Setter>
<igTimeline:XamWebTimeline Style="{StaticResource TimelineStyle}" Height="70" >
<igTimeline:XamWebTimeline.Series>
<igTimeline:DateTimeSeries Title="Series 1" >
<igTimeline:DateTimeSeries.Entries>
<igTimeline:DateTimeEntry Title="Series1 Entry 1" Time="07:00 01/01/2000" Duration="3:00" />
<igTimeline:DateTimeEntry Title="Series1 Entry 2" Time="12:00 01/01/2000" Duration="2:00" />
</igTimeline:DateTimeSeries.Entries>
</igTimeline:DateTimeSeries>
<igTimeline:DateTimeSeries Title="Series 2" Fill="Red" Position="BottomOrRight">
<igTimeline:DateTimeEntry Title="Series2 Entry 1" Time="09:00 01/01/2000" Duration="2:00" />
<igTimeline:DateTimeEntry Title="Series1 Entry 1" Time="14:00 01/01/2000" Duration="1:00" />
</igTimeline:XamWebTimeline.Series>
Could you please send us URL link to your application when you deploy it?
Hi,
I used the above XAML(posted by you on 04-13-2009 4:19 AM ) to display my zoombar. but, i am unable to fetch the zoombar with the above specified code(this is specified by you in this post on 04-08-2009 6:23 AM ) to bind to the Zoomchanged and zoomchanging events.
I want to bind and Zoomchanged and zoomchanging events for the above XAML(posted on 04-13-2009 4:19 AM). Please let me know how to achieve this?
Thanks &Regards
Ashok
You can use the Zoombar to preview something custom with:
<igControls:XamWebZoombar Minimum="0"
Maximum="100"
ZoomChanged="XamWebZoombar_ZoomChanged" ZoomChanging="XamWebZoombar_ZoomChanging">
<igControls:XamWebZoombar.Range>
<igControls:Range Minimum="10" Maximum="20">
</igControls:Range>
</igControls:XamWebZoombar.Range>
<igControls:XamWebZoombar.HorizontalPreviewContent>
<Rectangle Fill="Red" />
</igControls:XamWebZoombar.HorizontalPreviewContent>
The Zoombar works with Minimum and Maximum values. If you want to work with Scale and Scroll, you need to set them with the code after the layout of the control is updated.
I tried above approach to create a zoombar,but the preview labels are not visible.
Do i need to set any properties to show the labels in the zoombar?
Thanks,
The Zoombar itself doesn't have labels. The Zoombar has preview area that you need to specify whatever you want to preview. The Timeline creates the labels that you are seeing in its Zoombar.