Tablet Scrolling in UI for WPF

This is a migrated thread and some comments may be shown as answers.

Tablet Scrolling

5 Answers 9 Views

GridView

This is a migrated thread and some comments may be shown as answers.

Nils asked on 24 Jun 2014, 12:19 PM

Hi,

we (our company and I) are using your RadGridView in our application. It works fine with an desktop pc (input by mouse), but if we are using a tablet pc (input by touchscreen) we have some problems with the performance.
Because of these issus we develop a small WPF application with the MS DataGrid and your RadGridView. The DataGrid scroll-performance is perfectly but your RadGridView is stuttering.

Code:

<DataGrid
            TextElement.FontSize="15"
            Width="1260"
            Height="325"
            DockPanel.Dock="Top"
            AutoGenerateColumns="False"
            CanUserAddRows="False"
            SelectionMode="Single"
            VirtualizingPanel.IsVirtualizing="False"
            VirtualizingPanel.VirtualizationMode="Recycling"
            VirtualizingPanel.ScrollUnit="Pixel"
            ScrollViewer.IsDeferredScrollingEnabled="True"
            EnableColumnVirtualization="False"
            EnableRowVirtualization="False"
            IsReadOnly="True"
            ItemsSource="{Binding Path=CachedListe}">
            <DataGrid.Columns>
                <DataGridTemplateColumn
                    Width="80">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <StackPanel
                                Orientation="Horizontal">
                                <Button
                                    Margin="1"
                                    Command="{Binding Path=Open.Command}"
                                    Content="WPF"></Button>
                                <telerik:RadButton
                                    Margin="1"
                                    Command="{Binding Path=Open.Command}"
                                    Content="Telerik"></telerik:RadButton>
                            </StackPanel>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
                <DataGridTextColumn
                    Width="81"
                    Binding="{Binding Path=Id}"
                    Header="Nummer"></DataGridTextColumn>

                <DataGridTextColumn
                    Width="150"
                    Binding="{Binding Path=Bezeichnung}"
                    Header="Geschäft"></DataGridTextColumn>

                <DataGridTextColumn
                    Width="140"
                    Binding="{Binding Path=AnsprechpartnerName}"
                    Header="Ansprechpartner"></DataGridTextColumn>

                <DataGridTextColumn
                    Width="120"
                    Binding="{Binding Path=Strasse}"
                    Header="Strasse"></DataGridTextColumn>

                <DataGridTextColumn
                    Width="66"
                    Binding="{Binding Path=PLZ}"
                    Header="PLZ"></DataGridTextColumn>

                <DataGridTextColumn
                    Width="140"
                    Binding="{Binding Path=Ort}"
                    Header="Ort"></DataGridTextColumn>

                <DataGridTextColumn
                    Width="100"
                    Binding="{Binding Path=Gebiet.Bezeichnung}"
                    Header="Gebiet"></DataGridTextColumn>
            </DataGrid.Columns>
        </DataGrid>



        <telerik:RadGridView
            Width="1260"
            Height="325"
            DockPanel.Dock="Top"
            ScrollMode="Deferred"
            Visibility="Visible"
            telerik:GridViewVirtualizingPanel.IsVirtualizing="False"
            IsReadOnly="True"
            AutoGenerateColumns="False"
            x:Name="StandorteGrid"
            RowHeight="25"
            GroupRenderMode="Flat"
            ItemsSource="{Binding Path=Liste}"
            CanUserDeleteRows="False"
            CanUserInsertRows="False"
            CanUserReorderColumns="False"
            CanUserFreezeColumns="False"
            EnableColumnVirtualization="False"
            EnableRowVirtualization="False">
            
            <telerik:RadGridView.Columns>
                
                <telerik:GridViewDataColumn
                    x:Name="ColNummer"
                    Width="81"
                    DataMemberBinding="{Binding Path=Id}">
                    <telerik:GridViewDataColumn.Header>
                        <TextBlock
                            Text="Nummer" />
                    </telerik:GridViewDataColumn.Header>
                </telerik:GridViewDataColumn>
                <telerik:GridViewDataColumn
                    x:Name="ColGeschaeft"
                    DataMemberBinding="{Binding Path=Bezeichnung}"
                    Width="150"
                    TextWrapping="Wrap">
                    <telerik:GridViewDataColumn.Header>
                        <TextBlock
                            Text="Geschäft" />
                    </telerik:GridViewDataColumn.Header>
                </telerik:GridViewDataColumn>
                <telerik:GridViewDataColumn
                    x:Name="ColAnsprech"
                    DataMemberBinding="{Binding Path=AnsprechpartnerName}"
                    Width="140"
                    TextWrapping="Wrap">
                    <telerik:GridViewDataColumn.Header>
                        <TextBlock
                            Text="Ansprechpartner" />
                    </telerik:GridViewDataColumn.Header>
                </telerik:GridViewDataColumn>
                <telerik:GridViewDataColumn
                    x:Name="ColStrasse"
                    DataMemberBinding="{Binding Path=Strasse}"
                    Width="120"
                    TextWrapping="Wrap">
                    <telerik:GridViewDataColumn.Header>
                        <TextBlock
                            Text="Strasse" />
                    </telerik:GridViewDataColumn.Header>
                </telerik:GridViewDataColumn>
                <telerik:GridViewDataColumn
                    x:Name="ColPlz"
                    DataMemberBinding="{Binding Path=PLZ}"
                    Width="66">
                    <telerik:GridViewDataColumn.Header>
                        <TextBlock
                            Text="PLZ" />
                    </telerik:GridViewDataColumn.Header>
                </telerik:GridViewDataColumn>
                <telerik:GridViewDataColumn
                    x:Name="ColOrt"
                    DataMemberBinding="{Binding Path=Ort}"
                    Width="140"
                    TextWrapping="Wrap">
                    <telerik:GridViewDataColumn.Header>
                        <TextBlock
                            Text="Ort" />
                    </telerik:GridViewDataColumn.Header>
                </telerik:GridViewDataColumn>
                <telerik:GridViewDataColumn
                    x:Name="ColGebiet"
                    DataMemberBinding="{Binding Path=Gebiet.Bezeichnung}"
                    Width="100"
                    TextWrapping="Wrap">
                    <telerik:GridViewDataColumn.Header>
                        <TextBlock
                            Text="Gebiet" />
                    </telerik:GridViewDataColumn.Header>
                </telerik:GridViewDataColumn>

                <telerik:GridViewDataColumn
                    x:Name="ColLetzterBesuch"
                    DataMemberBinding="{Binding Path=Besuch.DatumCheckIn}"
                    DataFormatString="{}{0:dd.MM.yyyy}"
                    Width="100">
                    <telerik:GridViewDataColumn.Header>
                        <TextBlock>
<Run
                                Text="letzter" />
<LineBreak />
<Run
                                Text="Besuch" />
                        </TextBlock>
                    </telerik:GridViewDataColumn.Header>
                </telerik:GridViewDataColumn>
            </telerik:RadGridView.Columns>
        </telerik:RadGridView>

Now my question, how can we improve our code?

Greatings and thanks in advance
Nils

5 Answers, 1 is accepted

answered on 26 Jun 2014, 08:05 AM

Hello Nils,

I noticed you have set the EnableRow/ColumnVirtualization properties to false. Is there a specific reason for disabling the Vitualization mechanism? This will introduce major performance issues, especially on machines with lower system specs.

Furthermore, depending on your version of our controls, you may be experiencing an additional performance hit on tablet pc's, due to the fact that there is a service running that triggers the build of the AutomationTree of RadGridView. You can check if this is the case, by disabling the TabletInputService from TaskManager, and test the performance again after that.

Let me know how it goes.

Regards,
Nik
Telerik

Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.

answered on 30 Jun 2014, 07:15 AM

Hello,

You can open a support thread and attach the project there.

If your company has purchased a license from another account, please ask the purchaser to add your email to the list of licensed developers so that we can provide you with all services suggest. In that way, you can get access to the support services (24-hour support tickets), the latest hotfixes and downloads from within your account.

In general I would also suggest you going through the Degraded Performance help article suggesting on how you could improve the performance of RadGridView.

Regards,
Didie
Telerik