Silverlight DataGrid Issues

I was eager to see how the DataGrid has changed, as the ControlTemplates have changed for the better.

I am not sure if I am doing something wrong but, here are the things I found

Here is the source
1. Here is a screenshot of the DataGrid when we run the application

scroll up and down a few times,Here is what it looks like after

see the difference, ContactTitle column increased its width and Companyname is pushed out, Similar thing happens With Horizontal Scrolling also

2. Sometimes we want to highlight the Rows when a condition is met. I thought LoadingRow event is a good place to check my condition and change the background of the row

so I added the following code

Customer c = e.Row.DataContext as Customer;

if (c.City == “London”)           
   e.Row.Background = new SolidColorBrush(Colors.Yellow);  

it works and we can see the Rows highlighted

Scroll up and down few times and we get

How come just scrolling up and down gives me this, I see LoadingRow event is being raised

3. I thought, may be try  changing the size when the condition is met, so added following code

FrameworkElement ele = grid1.Columns[2].GetCellContent(e.Row);
(ele as TextBlock).FontSize = 20;            

After I added this code, I cannot see all the records

Here is what I have before changing size, the Id’s start with W’s at the end

After changing size, I cannot see these records, I get this, the only way to see the rest of them is to use down keys

Please leave a comment if you have any Idea on what is going on, Thanks

 

Update: looks like a bug and will be fixed by RTM

To get around these issues we have to specify fixed with for the columns, reset the color if the condition is not met.

45 thoughts on “Silverlight DataGrid Issues

  1. Try turning off virtualization. Inasmuch as the problems seem to happen after scrolling it seems likely that there are problems with virtualizing the rows. Just a thought.

    -Gary

  2. Dang. Good question. I assumed that there would be a way to turn it off, but I can’t find anything either.

    I think you’ve got some interesting bugs here. I still suspect virtualization. You should probably post this on the Silverlight forum.

    -Gary

  3. Hi Lee,

    Issue #1 Seems like an intentional behavior.
    Issue #3 does seems like a Scrolling bug.

    Issue #2 is caused by the virtualzation modal in the DataGrid. You can use the “DataGrid.UnloadingRow” event to clear all custom display settings you’ve set on the row after it is no longer being shown.

  4. justin,
    1. you are right, staying away from Autogenerate columns(which wont be ideal in production application anyways) should fix the first one.

    2.Virtualization or not, I think developer should not be responsible for clearing custom settings, so I would say this is also a bug along with 3.

    Thanks

  5. #1 The column growing is not a bug. By default, columns are set to Auto, and they will auto grow based on the content.

    #2 This is not a bug either. Because of container recycling, the row gets reused for other items so the user needs to clean up any customizations from the Loading event in the UnLoading event. However, the recommended way to do this is to DataBind the customizations instead. In this example the Background could be bound to a calculated property of the item that returns a yellow brush if the City is London.

    #3 That’s a Beta2 bug where the scrollbar wasn’t updated in that case. If you navigate with the keyboard, you should be able to navigate to all of the records

  6. Hey,

    I’ve been having all sorts of issues with the DataGrid so glad to find some others that are too. My issue is that I’ve get a datagrid bound to an observable collection, I add a new item to it and then try to ScrollIntoView(myNewItem). This causes some very bizarre rendering issues – with the black column text being rendered all over the top left corner of the control.

    I need to work around this right now because it’s released tomorrow and this is the only issue left.

    Lee

  7. there is no direct way, AFAIK, there might be a way through code. I did not try it myself. will post if I find a way

    Thanks

  8. For bug #2, I think yif’s sugesstion make sense. Use DataBinding to do this instead of using loaded event.

    But I don’t think you need to add another Brush field to your data object, just bind the Background to the Data field that you want to check. Use a IValueConverter to return you a SolidColorBrush based on the data for that row. This is much cleaner way then using loaded event.

    With databinding, after you changed data for that row, the color is automatically changed accordingly. With loaded event, you do not get this effect either.

  9. I agree converter would work, if there is a DataTrigger that would work the best instead. Changing the objects to add properties(for binding) might not be possible in all the cases

  10. Hi,

    I have following code inside my datagrid

    Now if someone want to edit the employeename, they can edit by double clicking. I want to change color of column after edit.
    How can I achieve this. I guess I need to handle this inside dgEmployees_CommittingEdit, but how?

  11. Don’t know why my XAML is not appearing.
    I have used DataGridTemplateColumn.CellTemplate to display data and DataGridTemplateColumn.CellEditingTemplate for editing.
    It allows to edit on double click. I need to change background color of column after edit is complete on that column.

  12. Quite sad… but it seems that DataGrid + A good number of elements + Scroll Bar is not a very good combination…

    Dirty hacks that I have found..

    –> Insert elements at the top of the list / DataGrid.
    –> Do not trust on the Add + DataGrid + Scroll… rebind the DataGrid (quite ugly hack).
    –> If you want to rebind a grid and have problemas with the scroll bar… remove the DataGrid and create a copy dynamically (will try to recreate the popups dynamically better).

    I have several threads opened commeting this issues, waiting for Ms or a good chap to help.

    http://silverlight.net/forums/p/43791/120477.aspx#120477

    http://silverlight.net/forums/p/43792/120473.aspx#120473

  13. You’re Korean?
    Very interesting posts by you’re.
    I made the tree DataGrid have a problems Scroll Up and Down.
    Did you solve the scrolling problem?
    If the sample you have to tell me.
    Thank you.
    감사합니다 .^^

    1. Hi Kim,
      I am not korean. I am not sure what you mean by tree datagrid. can you send me a sample project. I can take a look

    1. Hi,
      Not sure what kind of issues you are having.
      Do you have a sample project with issues that you can send.
      I noticed that they are issues with virtualization, depending on what you are doing in the DataGrid and the amount of data displayed

    1. Hi,
      This was the same issue I was running into ofcourse the UI is different. I will take a look at my project and your project one more time. if not I will write a post, which might get more attention. If I do can I link it to your project?

  14. of course, you can attach my project, this was the sample project which i created before using datagrid in my website.
    the deployment of my website on production is very near. and I really dont want to go live with this behavior of datagrid.
    I shall be very thankful to You for all this.

    1. try turning off virtualization by changing the template of the datagrid
      wrap DataGridRowsPresenter in a scrollviewer, it will be a bit slower, but will work correctly

      1. lee :
        try turning off virtualization by changing the template of the datagrid
        wrap DataGridRowsPresenter in a scrollviewer, it will be a bit slower, but will work correctly

        hi, i’m using SL4 and still hit this issue when datagrid scrolling and sorting, and it’s solved after i wrapped the datagrid using scrollviewer, but sorting still giving problem. the value of combobox will go missing when i do sorting at datagrid. you can find my project here.

        https://skydrive.live.com/redir.aspx?cid=f62cd64ed49fc972&resid=F62CD64ED49FC972!498

        any solutions on this? appreciate any helps!

  15. this is what I found
    1. In age>50 condition looks like there is typo, all point to step4

    Try doing the following, after these changes seem to work correctly

    1. Instead of in the loaded event handler, move all the code to a function
    2. in the code reset all the steps before any thing
    step1_active.Visibility = Visibility.Collapsed;
    step2_active.Visibility = Visibility.Collapsed;
    step3_active.Visibility = Visibility.Collapsed;
    step4_active.Visibility = Visibility.Collapsed;

    step1_background.Visibility = Visibility.Collapsed;
    step2_background.Visibility = Visibility.Collapsed;
    step3_background.Visibility = Visibility.Collapsed;
    3.In the Dependency property changed event handler, call the function, like below (I named the function UpdateUI)

    private static void OnCurrentStatusPropertyChanged(DependencyObject depObj, DependencyPropertyChangedEventArgs e)
    {
    (depObj as PersonAgeIndicator).UpdateUI();
    }

  16. Even, i faced the similar prob: When Scroll bar is moved, ForeGround changes for all the Rows. In LoadingRow event, i need the ForeGround to be Red.

    Private Sub DG_LoadingRow(ByVal sender As System.Object, ByVal e As
    System.Windows.Controls.DataGridRowEventArgs)
    Dim c As clsreferences = New clsreferences
    c = TryCast(e.Row.DataContext, clsreferences)

    If c IsNot Nothing AndAlso c.Pointer = “0” Then
    e.Row.Foreground = New System.Windows.Media.SolidColorBrush
    (System.Windows.Media.Color.FromArgb(255, 255, 125, 125))
    e.Row.FontWeight = FontWeights.Bold
    End If
    End Sub

    But, when i scrolled, ForeGround is changing for all the Rows.
    To avoid this, i used UnloadingRow event:
    Same Code, but i changed the ForeGround colour.
    Now, it shows, the same, even when scroll bar scrolls

    Private Sub DG_UnloadingRow(ByVal sender As System.Object, ByVal e As System.Windows.Controls.DataGridRowEventArgs) Handles DG.UnloadingRow
    Dim c As clsreferences = New clsreferences
    c = TryCast(e.Row.DataContext, clsBMPreferences)

    If c IsNot Nothing AndAlso c.Pointer = “0” Then
    e.Row.Foreground = New System.Windows.Media.SolidColorBrush(Colors.Black)
    e.Row.FontWeight = FontWeights.Normal
    End If
    End Sub

  17. Saranyan :Even, i faced the similar prob: When Scroll bar is moved, ForeGround changes for all the Rows. In LoadingRow event, i need the ForeGround to be Red.
    Private Sub DG_LoadingRow(ByVal sender As System.Object, ByVal e AsSystem.Windows.Controls.DataGridRowEventArgs)Dim c As clsreferences = New clsreferencesc = TryCast(e.Row.DataContext, clsreferences)
    If c IsNot Nothing AndAlso c.Pointer = “0″ Thene.Row.Foreground = New System.Windows.Media.SolidColorBrush(System.Windows.Media.Color.FromArgb(255, 255, 125, 125))e.Row.FontWeight = FontWeights.BoldEnd IfEnd Sub
    But, when i scrolled, ForeGround is changing for all the Rows.To avoid this, i used UnloadingRow event:Same Code, but i changed the ForeGround colour for some Rows.Now, it shows, the same, even when scroll bar scrolls
    Private Sub DG_UnloadingRow(ByVal sender As System.Object, ByVal e As System.Windows.Controls.DataGridRowEventArgs) Handles DG.UnloadingRowDim c As clsreferences = New clsreferencesc = TryCast(e.Row.DataContext, clsBMPreferences)
    If c IsNot Nothing AndAlso c.Pointer = “0″ Thene.Row.Foreground = New System.Windows.Media.SolidColorBrush(Colors.Black)e.Row.FontWeight = FontWeights.NormalEnd IfEnd Sub

  18. This is my first time I have visited this site. I found a lot of interesting information in your blog. From the tons of comments on your articles, I guess I am not the only one! keep up the impressive work.

  19. Hi,
    I’ve the same problem as in second example when I scrolling
    I’ve a question to post #5; how can I use “DataGrid.UnloadingRow”; What should I set according Your example:
    if (c.City == “London”)
    e.Row.Background = new SolidColorBrush(Colors.Transparent?);

    On the other way how can I turning off virtualization of datagrid?

    JS

  20. JS,
    You could save the background in Tag property of Datagridrow in the loadingrow event and could set it back to the value in Tag property in unloading event

    try turning off virtualization by changing the template of the datagrid
    wrap DataGridRowsPresenter in a scrollviewer, it will be a bit slower, but will work correctly

Leave a reply to Zain Shaikh Cancel reply