Home Forums WPF controls Xceed DataGrid for WPF Vertical CardView

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • bigwheelturn
    Participant
    Post count: 2
    #44123 |

    Hi,

    Several forum posts have asked for a way to use the CardView with a vertical orientation. Generally the response has been:

    • To do this, you need to retemplate the DataGridControl’s Template when using the CardView
    • However, this scenario isn’t fully supported

    I have tried retemplating the CardView and changing the Orientation property of the CardViewItemsHost to Vertical, but this causes an odd scrolling problem. When the vertical scroll is used, it looks like it is scrolling normally, with a ScrollUnit of Item. However, when scrolling reaches the bottom, the items are rearranged, so that the very last row is arranged incorrectly. It is best described by an example. Suppose I have 14 items in cards represented by letters of the alphabet:

    ABCDEFGHIJKLMN

    Let’s say, given my card width and viewport width, my viewport is only wide enough for 4 columns of cards. A vertical wrapped layout would show:

    ABCD
    EFGH
    IJKL
    MN

    Now let’s say, given my card height and viewport height, my viewport is only tall enough for 2 rows of cards. Scrolling is enabled, and now in my viewport, I see the following with a scrollbar as my first page:

    ABCD
    EFGH

    I would expect that when I scroll to the bottom, I would see:

    IJKL
    MN

    But instead, when I scroll to the bottom, I see:

    GHIJ
    KLMN

    Which is confusing for users of our software.

    I am happy to provide an example if needed, but I believe it is easy enough to reproduce — just change the orientation of the CardViewItemsHost as recommended, and add enough cards to enable veritcal scrolling and observe the behavior.

    Is there any solution to this problem? Additionally, is official support for vertical CardViews on the roadmap anytime soon?

    Thanks,
    Alan

    Previous posts on this subject:
    CardView with single column
    Vertical Scrolling in Compact Card View
    Vertical navigation for Cardview

    Fawzi [Xceed]
    Member
    Post count: 722

    Hi,

    The DataGridControl now relies on classes derived from DataGridItemsHost to do the layout of its items. To display the cards in rows with a vertical scroll, you need to redo the template for the cardViewDataGridControlTemplate.

    You can copy/paste the template found in the CardView.GridElementTemplate.xaml file and replace the CardViewItemsHost by a TableViewItemsHost.

    bigwheelturn
    Participant
    Post count: 2

    Thanks for the response.

    Unfortunately, when I use a TableViewItemsHost as you suggest, I only get one column of items. Using my example with letters above, I get the single-column layout:

    A
    B
    C
    D
    E
    F

    …etc.

    Is there a way to use a wrapped CardView in the manner I described above, but fix the scrolling problem?

    Thanks,
    Alan

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.