Getting two items to wrap automatically? RRS feed

  • Question

  • I really expect this to be simple.. but..

    I'm writing the Windows 8.1 UI for a Universal app and I just want two items to be side-by-side when the width allows and then one above the other when restricted. The only way I've got this behaviour to work is using a GridView with WrapGrid, but then the items in my grid start acting like buttons, even if I have SelectionMode="None", they react to mouseovers and stuff.

    I can't help but feel I'm over complicating this and there's a much easier way of doing this width wrap?

    Any ideas?


    Thursday, February 5, 2015 3:20 PM

All replies

  • I think you want a WrapGrid.

    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Thursday, February 5, 2015 8:13 PM
  • There is a WrapPanel in the WinRT Xaml Toolkit that does what you want.

    If you don't want to use a 3rd party control it's not hard to write a custom Panel to layout like this. You may be able to reduce the mouseover, etc. reactions with a WrapGrid in an ItemsControl instead of in a GridView, especially if you customize the ItemsControl's templates.

    Thursday, February 5, 2015 9:16 PM
  • Okay, cheers for the answers guys. Yeah, I had tried the WrapGrid as described, but ran into the problems described. I'll take a look at WrapPanel, thanks. To be honest, I can probably just code this particular instance myself, but I just wanted to know if there was a simple way of doing it that I'd missed. This stuff is pretty easy in HTML/CSS with Bootstrap, so I assumed there might be a control that would do it that I don't know about.

    I guess what I want is a StackPanel that changes Orientation when the width is less than a certain amount. I might be able to bind that with a custom ValueConvertor.

    Saturday, February 7, 2015 1:03 PM