Column Width synchronization between two GrdiView's

4 posts, 1 answers
  1. sergito
    sergito avatar
    2 posts
    Member since:
    Dec 2010

    Posted 04 Jan 2013 Link to this post

    Hello,

    My scenario:

    I have two grids and splitter between them.

    First grid (at the top) has varied count of rows - depends on inserted entries (rows) by user.
    Second grid (at the bottom) is responsible for display summary in reference to the first grid.
    I can't do this in First grid footer because I have 6 rows with summary in second grid (always 6 rows).

    First grid and second grid has the same columns with the same UniqueNames.

    I need synchronize width of thes columns in two grids.
    for ex. If first column of the first grid has content which expands this column to ActualWidth = 77, first column from the second grid should has also the same width even if content is smaller then in the first column of the first grid. 

    And vice versa:

    case 1:

    First column in first grid has content which expands this column to ActualWidth = 77
    First column in second grid has content which expands this column to ActualWidth = 66

    Expected: First column in second grid should expands to the same Width like in first column in first grid.

    case 2:

    First column in first grid has content which expands this column to ActualWidth = 55
    First column in second grid has content which expands this column to ActualWidth = 88

    Expected: First column in first grid should expands to the same Width like in first column in second grid.

    Above these two grids I have DataPicker which allows me to change range of data and Button which is responsible for loading new data to these grids.

    I tried to handle with this using GridView.DataLoaded event but unfortunatelly I think that refreshing layout of columns going happen after this event so I can't find a good place where I can intercept info about "the real display width" of every column in these grids.




  2. Answer
    Yoan
    Admin
    Yoan avatar
    1070 posts

    Posted 08 Jan 2013 Link to this post

    Hi,

    The closest solution that meets your requirements is to bind the Column's Width property to a property in your ViewModel. Please check the attached project for a reference.

    You can find this forum thread helpful as well.


    Regards,
    Yoan
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. DevCraft banner
  4. sergito
    sergito avatar
    2 posts
    Member since:
    Dec 2010

    Posted 09 Jan 2013 Link to this post

    Thank you,

    Works great :)

    I have resolved this issue attaching to SizeChanged event in column headers and it is work but your solution imho is better.

    I can't resize my columns by mouse. They have IsResizable = false so theirs width resizes only in reference to content.
    Using your solution or my solution, width only grows. 
    Is there a way to shirnk column width ?

    For example:

    Content in first column of first grid gives me width = 100 px.
    Content in first column of second grid gives me width = 60 px but using your solution this column resizes to width = 100 px. OK :)

    After reload data:

    Content in first column of first grid gives me width = 75 px but earlier this column has width = 100 px so width is still the same (100 px)
    Content in first column of second grid gives me width = 60 px but using your solution this column resizes to width = 100 px. OK :)

    Base on content in these columns (no matter in which grid) I can shrink column to width = 75 px, but I can't because before reloading data they have width = 100.
    How I can shrink them ?

    Regards,
    Lukas Szumylo
  5. Yoan
    Admin
    Yoan avatar
    1070 posts

    Posted 14 Jan 2013 Link to this post

    Hi Lukas,

    I have modified the sample project in order to meet your requirements. Please give it a try and let me know if it fits in your scenario.

    All the best,
    Yoan
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Back to Top