Databases
StackOverflow2013
Postsdbo
POMahApps.Metro TabControl Laggy with filled GridView
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POMahApps.Metro TabControl Laggy with filled GridView
    text
    copied!<p>I have a TabControl with 4 TabItems. Inside each TabItem I have a GridView and a Toolbar. I use MahApps.Metro (for Window and TabControl) and telerik RadControls (for GridView and Toolbar). I use MahApps.Metro TabControl with AnimatedSingleRowTabControl, so each time I switch the tab there is a tab changing animation.</p> <p>When the GridView is empty, the animation is smooth, but when the GridView filled with data, it's lag. Each time I switch tab, It's always lag about 1-2 second(s). My tables only has max 73 rows. So, I don't think it is too much to load.</p> <p>I don't know if this is because of I don't use the correct way to bind the GridView with Table or another reason.</p> <p>I want to smooth the animation, so my solution either:</p> <ul> <li><p>Let the GridView empty when switched tab and fill it after the slide animation.</p></li> <li><p>Somehow make the animation smooth (change the binding way).</p></li> </ul> <p>But, I don't know how to accomplish the above option :P Anyone can help me? Another solution is welcome.</p> <p>This is my code:</p> <pre><code> &lt;TabControl SelectionChanged="TabControl_SelectionChanged"&gt; &lt;TabItem Name="Tab_Collection" Header="Collection" Style="{StaticResource MetroTabItem}"&gt; &lt;StackPanel Margin="20,10"&gt; &lt;telerik:RadToolBar telerik:StyleManager.Theme="Metro" Margin="0,0,0,5" Width="338" GripVisibility="Collapsed" OverflowButtonVisibility="Collapsed" HorizontalAlignment="Right"&gt; &lt;Button Name="Btn_CollectionAdd" Width="80" Height="25" Content="Add"/&gt; &lt;Button Name="Btn_CollectionEdit" Width="80" Height="25" Content="Edit"/&gt; &lt;Button Name="Btn_CollectionDelete" Width="80" Height="25" Content="Delete"/&gt; &lt;telerik:RadToolBarSeparator/&gt; &lt;Button Name="Btn_CollectionSearch" Width="80" Height="25" Content="Search" Click="Btn_Search_Click"/&gt; &lt;/telerik:RadToolBar&gt; &lt;telerik:RadGridView Name="Dgv_Collection" telerik:StyleManager.Theme="Metro" Margin="0,0,0,10" Height="505" BorderBrush="#25A0DA" BorderThickness="1" SelectionUnit="FullRow" AutoGenerateColumns="False" CanUserInsertRows="False" CanUserDeleteRows="False" CanUserResizeRows="False" CanUserFreezeColumns="False" CanUserSortColumns="False" CanUserResizeColumns="False" CanUserReorderColumns="False" ShowGroupPanel="False" RowIndicatorVisibility="Collapsed" EditTriggers="None"&gt; &lt;telerik:RadGridView.Columns&gt; &lt;telerik:GridViewDataColumn Width="30" Header="#" IsFilterable="False" DataMemberBinding="{Binding id}"/&gt; &lt;telerik:GridViewDataColumn Width="*" Header="Title" IsFilterable="False" DataMemberBinding="{Binding title}"/&gt; &lt;/telerik:RadGridView.Columns&gt; &lt;/telerik:RadGridView&gt; &lt;/StackPanel&gt; &lt;/TabItem&gt; //I do the same for the rest 3 TabItems &lt;/TabControl&gt; </code></pre> <p>I bind the GridView this way:</p> <pre><code> private void loadCollection() { String conn = connection_string; String sql = null; try { sql = "SELECT * FROM Tbl_Information"; SqlCeDataAdapter dataAdapter = new SqlCeDataAdapter(sql, conn); SqlCeCommandBuilder commandBuilder = new SqlCeCommandBuilder(dataAdapter); DataTable table = new DataTable(); dataAdapter.Fill(table); Dgv_Collection.ItemsSource = table; } catch (SqlCeException ex) { MessageBox.Show(ex.Message); } } //load the rest 3 table the same way public MainPage() { InitializeComponent(); loadCollection(); //call the rest } </code></pre> <p>NOTE: I'm still very new to WPF :)</p> <p>EDIT: I found out it's only lag on first access to the TabItem. If I click a TabItem then switched to another Tab it's lag. But, when I switch back to the previous Tab, it's animated smoothly.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload