Hi,
We are using a listbox with a datatemplate with SciChart inside.
This worked fine with SciChart v2.x (see attachment)
We’ve implemented SciChart v3.0 and now the charts are being displayed differently. (see attachment)
How is this possible?
We are using the following xaml code:
<UserControl x:Class="Fluke.FV2.Subsystems.DataPresentation.UserInterface.Mvvm.Views.DetailsView" xmlns=" http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x=" http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d=" http://schemas.microsoft.com/expression/blend/2008" xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" xmlns:cmd="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras.WPF4" xmlns:mc=" http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:vc="clr-namespace:Fluke.FV2.Subsystems.DataPresentation.UserInterface.Mvvm.Components" xmlns:vm="clr-namespace:Fluke.FV2.Subsystems.DataPresentation.UserInterface.Mvvm.ViewModel" xmlns:SciChart=" http://schemas.abtsoftware.co.uk/scichart" mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480" DataContext="{Binding Source={x:Static vm:ViewModelLocator.DetailsStatic}}" Visibility="{Binding Path=DetailsVisibility}" xmlns:c1=" http://schemas.componentone.com/winfx/2006/xaml"> <UserControl.Resources> <vc:ImageConverter x:Key="ImageConverter"></vc:ImageConverter> <vc:DateTimeConverter x:Key="DateTimeConverter"></vc:DateTimeConverter> <vc:DateConverter x:Key="DateConverter"></vc:DateConverter> <vc:TimeConverter x:Key="TimeConverter"></vc:TimeConverter> <Style TargetType="{x:Type ListBox}" x:Key="ListBoxStyle"> </Style> <DataTemplate x:Key="ItemTemplate"> <Grid> <Border BorderBrush="#FFC20E" BorderThickness="3" Margin="10" Background="{StaticResource SnapshotBackgroundBrush}" CornerRadius="5"> <Grid> <Grid.RowDefinitions> <RowDefinition /> <RowDefinition /> <RowDefinition /> </Grid.RowDefinitions> <Grid Grid.Row="0"> <Grid.ColumnDefinitions> <ColumnDefinition Width="auto"/> <ColumnDefinition Width="*" /> <ColumnDefinition Width="auto" /> </Grid.ColumnDefinitions> <GroupBox Grid.Column="0" Margin="5" Header="{Binding Path=Snapshot.TimeStamp, Converter={StaticResource DateTimeConverter}}" Visibility="{Binding Path=DataContext.ScreenVisibility, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"> <Image Margin="2" Source="{Binding Path=Snapshot.Screen}" MaxHeight="240" MaxWidth="320" /> </GroupBox> <SciChart:SciChartSurface Grid.Column="1" x:Name="sciChartSurface" RenderableSeries="{Binding Path=RenderableSeries}" SciChart:ThemeManager.Theme="BrightSpark" XAxis="{Binding Path=XAxis}" YAxes="{Binding Path=YAxes}" Annotations="{Binding Path=Annotations}" ChartModifier="{Binding Path=ChartModifier}" Visibility="{Binding Path=DataContext.WaveformVisibility, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}" Margin="0,3,0,3" Height="280"> </SciChart:SciChartSurface> <Canvas Grid.Column="1" Background="Transparent"></Canvas> <GroupBox x:Name="setupItem" Grid.Column="2" Margin="5" Width="200" Visibility="{Binding Path=DataContext.SetupVisibility, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"> <GroupBox.Header> <StackPanel Orientation="Horizontal"> <Label Content="Setup" /> <Label Content=" " /> <Label Content="{Binding Path=SetupDateTime, Converter={StaticResource DateTimeConverter}}"/> </StackPanel> </GroupBox.Header> <Grid> <Grid.RowDefinitions> <RowDefinition Height="20" /> <RowDefinition Height="20" /> <RowDefinition Height="20" /> <RowDefinition Height="23" /> <RowDefinition Height="20" /> <RowDefinition Height="20" /> <RowDefinition Height="20" /> <RowDefinition Height="20" /> </Grid.RowDefinitions> <Label Grid.Row="0" Content="Instrument" FontStyle="Italic"></Label> <StackPanel Grid.Row="1" Margin="5,0,0,0" Orientation="Horizontal"> <Label Content="{Binding Path=SetupInstrument}"></Label> </StackPanel> <Label Grid.Row="2" Content="Description" FontStyle="Italic"></Label> <StackPanel Grid.Row="3" Margin="5,0,0,0" Orientation="Horizontal"> <TextBox Text="{Binding Path=SetupDescription}" MaxLength="11" Name="TextBoxSetupDescription" TextChanged="TextBoxSetupDescription_TextChanged"></TextBox> </StackPanel> <Label Grid.Row="4" Content="Datablock" FontStyle="Italic"/> <StackPanel Grid.Row="5" Margin="5,0,0,0" Name="SetupName" Orientation="Horizontal"> <Label Content="Name"/> <Label Content=" = "/> <Label Content="{Binding Path=SetupName}"></Label> </StackPanel> <StackPanel Grid.Row="6" Margin="5,0,0,0" Name="SetupDate" Orientation="Horizontal"> <Label Content="Date"/> <Label Content=" = "/> <Label Content="{Binding Path=SetupDateTime, Converter={StaticResource DateConverter}}"/> </StackPanel> <StackPanel Grid.Row="7" Margin="5,0,0,0" Name="SetupTime" Orientation="Horizontal"> <Label Content="Time"/> <Label Content=" = "/> <Label Content="{Binding Path=SetupDateTime, Converter={StaticResource TimeConverter}}"/> </StackPanel> <Grid Background="Transparent" Grid.ColumnSpan="3"></Grid> </Grid> </GroupBox> </Grid> <c1:C1Expander Grid.Row="2" Margin="5" Name="c1ExpanderDescription" CornerRadius="2" Header="{Binding Path=DataContext.Description, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}" HeaderFontSize="14" HeaderFontFamily="Segoe UI"> <!--<TextBlock Text="{Binding Path=Snapshot.Comments}" MouseEnter="ExtraInfo_MouseEnter" MouseLeave="ExtraInfo_MouseLeave" Tag="7" />--> <!--<vc:AutoCompleteTextBox AutoText="{Binding Path=Snapshot.Comments}" Height="23" x:Name="acTextBoxComments" DelayTime="400" Threshold="2" MouseEnter="ExtraInfo_MouseEnter" MouseLeave="ExtraInfo_MouseLeave" Tag="7" />--> <TextBox Text="{Binding Path=Snapshot.Comments}" MouseLeave="ExtraInfo_MouseLeaveDescription" Tag="7" AcceptsReturn="True" TextWrapping="Wrap" VerticalScrollBarVisibility="Auto"></TextBox> </c1:C1Expander> <c1:C1Expander Grid.Row="1" Margin="5,0,5,5" Name="c1ExpanderExtraInfo" CornerRadius="2" Header="{Binding Path=DataContext.ExtraInfo, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}" HeaderFontSize="14" HeaderFontFamily="Segoe UI"> <Grid> <Grid.RowDefinitions> <RowDefinition /> <RowDefinition /> <RowDefinition /> <RowDefinition /> <RowDefinition /> <RowDefinition /> <RowDefinition /> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="100" /> <ColumnDefinition /> </Grid.ColumnDefinitions> <Label Margin="2" Grid.Column="0" Grid.Row="0" Content="{Binding Path=DataContext.ExtraInfoTitle, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"></Label> <vc:AutoCompleteTextBox Grid.Column="1" Grid.Row="0" AutoText="{Binding Path=Snapshot.Title}" Height="23" x:Name="acTextBoxTitle" DelayTime="400" Threshold="2" MouseEnter="ExtraInfo_MouseEnter" MouseLeave="ExtraInfo_MouseLeave" Tag="0"/> <!--<TextBox Grid.Column="1" Grid.Row="0" Text="{Binding Path=Snapshot.Title}"></TextBox>--> <Label Margin="2" Grid.Column="0" Grid.Row="1" Content="{Binding Path=DataContext.ExtraInfoSubTitle, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"></Label> <vc:AutoCompleteTextBox Grid.Column="1" Grid.Row="1" AutoText="{Binding Path=Snapshot.SubTitle}" Height="23" x:Name="acTextBoxSubTitle" DelayTime="400" Threshold="2" MouseEnter="ExtraInfo_MouseEnter" MouseLeave="ExtraInfo_MouseLeave" Tag="1"/> <!--<TextBox Grid.Column="1" Grid.Row="1" Text="{Binding Path=Snapshot.SubTitle}"></TextBox>--> <Label Margin="2" Grid.Column="0" Grid.Row="2" Content="{Binding Path=DataContext.ExtraInfoCompanyName, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"></Label> <vc:AutoCompleteTextBox Grid.Column="1" Grid.Row="2" AutoText="{Binding Path=Snapshot.CompanyName}" Height="23" x:Name="acTextBoxCompanyName" DelayTime="400" Threshold="2" MouseEnter="ExtraInfo_MouseEnter" MouseLeave="ExtraInfo_MouseLeave" Tag="2"/> <!--<TextBox Grid.Column="1" Grid.Row="2" Text="{Binding Path=Snapshot.CompanyName}"></TextBox>--> <Label Margin="2" Grid.Column="0" Grid.Row="3" Content="{Binding Path=DataContext.ExtraInfoCompanyInfo, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"></Label> <vc:AutoCompleteTextBox Grid.Column="1" Grid.Row="3" AutoText="{Binding Path=Snapshot.CompanyInfo}" Height="23" x:Name="acTextBoxCompanyInfo" DelayTime="400" Threshold="2" MouseEnter="ExtraInfo_MouseEnter" MouseLeave="ExtraInfo_MouseLeave" Tag="3"/> <!--<TextBox Grid.Column="1" Grid.Row="3" Text="{Binding Path=Snapshot.CompanyInfo}"></TextBox>--> <Label Margin="2" Grid.Column="0" Grid.Row="4" Content="{Binding Path=DataContext.ExtraInfoContactPerson, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"></Label> <vc:AutoCompleteTextBox Grid.Column="1" Grid.Row="4" AutoText="{Binding Path=Snapshot.ContactPerson}" Height="23" x:Name="acTextBoxContactPerson" DelayTime="400" Threshold="2" MouseEnter="ExtraInfo_MouseEnter" MouseLeave="ExtraInfo_MouseLeave" Tag="4"/> <!--<TextBox Grid.Column="1" Grid.Row="4" Text="{Binding Path=Snapshot.ContactPerson}"></TextBox>--> <Label Margin="2" Grid.Column="0" Grid.Row="5" Content="{Binding Path=DataContext.ExtraInfoContactInfo, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"></Label> <vc:AutoCompleteTextBox Grid.Column="1" Grid.Row="5" AutoText="{Binding Path=Snapshot.ContactInfo}" Height="23" x:Name="acTextBoxContactInfo" DelayTime="400" Threshold="2" MouseEnter="ExtraInfo_MouseEnter" MouseLeave="ExtraInfo_MouseLeave" Tag="5"/> <!--<TextBox Grid.Column="1" Grid.Row="5" Text="{Binding Path=Snapshot.ContactInfo}"></TextBox>--> <Label Margin="2" Grid.Column="0" Grid.Row="6" Content="{Binding Path=DataContext.ExtraInfoTestDevice, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"></Label> <vc:AutoCompleteTextBox Grid.Column="1" Grid.Row="6" AutoText="{Binding Path=Snapshot.TestDevice}" Height="23" x:Name="acTextBoxTestDevice" DelayTime="400" Threshold="2" MouseEnter="ExtraInfo_MouseEnter" MouseLeave="ExtraInfo_MouseLeave" Tag="6"/> <!--<TextBox Grid.Column="1" Grid.Row="6" Text="{Binding Path=Snapshot.TestDevice}"></TextBox>--> </Grid> </c1:C1Expander> </Grid> </Border> </Grid> </DataTemplate> <DataTemplate x:Key="SelectedTemplate"> <Border BorderBrush="Yellow" BorderThickness="1" Margin="10" Background="{StaticResource SnapshotBackgroundBrush}" CornerRadius="5"> <StackPanel Margin="5"> <Image Margin="2" Source="{Binding Path=Snapshot.Screen}" /> <TextBlock Margin="2" Text="{Binding Path=Snapshot.TimeStamp, Converter={StaticResource DateTimeConverter}}" Foreground="White" /> <TextBlock Margin="2" Text="{Binding Path=Snapshot.Location}" Foreground="White" /> </StackPanel> </Border> </DataTemplate> <Style TargetType="{x:Type ListBoxItem}" x:Key="ContainerStyle"> <Setter Property="ContentTemplate" Value="{StaticResource ItemTemplate}" /> <Style.Triggers> <Trigger Property="IsSelected" Value="True"> <Setter Property="ContentTemplate" Value="{StaticResource ItemTemplate}" /> </Trigger> </Style.Triggers> <Style.Resources> <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent" /> <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Transparent" /> <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Transparent" /> </Style.Resources> </Style> </UserControl.Resources> <!--**********************************************************--> <!--***** Here starts the 'real' drawing of the controls *****--> <!--**********************************************************--> <Grid Name="mainGrid" Style="{StaticResource FlukeStyle}" HorizontalAlignment="Stretch" SizeChanged="MainGrid_SizeChanged"> <Grid.RowDefinitions> <RowDefinition Height="*" /> <RowDefinition Height="63" /> </Grid.RowDefinitions> <Image Grid.Row="0" Visibility="{Binding ImageVisibility}" Source="{Binding Path=ScreenImage, Converter={StaticResource ImageConverter} }" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="5"></Image> <ListBox Style="{StaticResource ListBoxStyle}" Grid.Row="0" Name="listBoxSnapshots" HorizontalContentAlignment="Stretch" ItemContainerStyle="{StaticResource ContainerStyle}" ItemsSource="{Binding Snapshots}" SelectedItem="{Binding SelectedItem}" BorderThickness="0" Background="Transparent" SelectionMode="Extended" MouseDoubleClick="ListBoxSnapshots_MouseDoubleClick" Visibility="{Binding ListboxVisibility}"> <i:Interaction.Triggers> <i:EventTrigger EventName="SelectionChanged"> <cmd:EventToCommand Command="{Binding SelectionChangedCommand}" CommandParameter="{Binding SelectedItems, ElementName=listBoxSnapshots}" /> </i:EventTrigger> <i:EventTrigger EventName="MouseDoubleClick"> <i:InvokeCommandAction Command="{Binding DoubleClickCommand}"/> </i:EventTrigger> </i:Interaction.Triggers> <ListBox.ItemsPanel> <ItemsPanelTemplate> <WrapPanel Name="wrapPanelListBox" Orientation="Horizontal" IsItemsHost="True" Width="{Binding Path=DataContext.WrapPanelWidth, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}" /> </ItemsPanelTemplate> </ListBox.ItemsPanel> </ListBox> <Border BorderBrush="Black" BorderThickness="1" Margin="2,1,2,2" HorizontalAlignment="Stretch" Grid.Row="1"> <Grid> <StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" Visibility="{Binding CheckboxesVisibility}"> <CheckBox Style="{StaticResource styleCustomCheckBox}" Content="Screen" IsChecked="{Binding ScreenChecked}"/> <CheckBox Style="{StaticResource styleCustomCheckBox}" Content="Waveform" IsChecked="{Binding WaveformChecked}"/> <CheckBox Style="{StaticResource styleCustomCheckBox}" Content="Setup" IsChecked="{Binding SetupChecked}"/> </StackPanel> <Button HorizontalAlignment="Center" Content="Close" Height="32" Width="75" Visibility="{Binding ImageVisibility}" Command="{Binding CloseImageCommand}"></Button> </Grid> </Border> </Grid> </UserControl>
Thanks and best regards,
Egbert
- EJansen asked 10 years ago
- You must login to post comments
Hi,
Please, try replacing the WrapPanel with StackPanel:
<ListBox.ItemsPanel> <ItemsPanelTemplate> <StackPanel Name="wrapPanelListBox" Orientation="Horizontal" IsItemsHost="True" Width="{Binding Path=DataContext.WrapPanelWidth, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}" /> </ItemsPanelTemplate> </ListBox.ItemsPanel>
I think this should work as expected, except the case you really need WrapPanel’s behavior.
Please, let us know.
Best regards,
Yuriy
- Yuriy Zadereckiy answered 10 years ago
-
Hi, I'm sorry, but this does not work.
-
Thank you Egbert! We need to look deeper into the issue. I'll get back to you after the investigation. Best regards, Yuriy
-
Hi there, The issue has been fixed and we are going to include it in the update, which is out on the weekend. Best regards, Yuriy
- You must login to post comments
Please login first to submit.