Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I make Groups in a Metro GridView use different Layouts?

I'm writing a Windows 8 Metro app. I'm trying to draw a GridView with three Groups. I want one of those groups to layout their items differently than the others. I've used Selectors before in WPF, so I thought that'd be a good route. So I tried the GroupStyleSelector and I found this example on MSDN :

public class ListGroupStyleSelector : GroupStyleSelector
{
  protected override GroupStyle SelectGroupStyleCore(object group, uint level)
  {
    return (GroupStyle)App.Current.Resources["listViewGroupStyle"];
  }
}

So I altered/expanded on it from something that would suit me:

CS:

public class ExampleListGroupStyleSelector : GroupStyleSelector
{
  public ExampleListGroupStyleSelector ()
  {
     OneBigItemGroupStyle = null;
     NormalGroupStyle = null;
  }

  public GroupStyle OneBigItemGroupStyle { get; set; }
  public GroupStyle NormalGroupStyle { get; set; }

  protected override GroupStyle SelectGroupStyleCore( object group, uint level )
  {
     // a method that tries to grab an enum off the bound data object
     var exampleListType= GetExampleListType( group );

     if ( exampleListType== ExampleListType.A)
     {
        return OneBigItemGroupStyle;
     }
     if ( exampleListType== ExampleListType.B|| exampleListType== ExampleListType.B)
     {
        return NormalGroupStyle;
     }

     throw new ArgumentException( "Unexpected group type" );
  }
}

XAML:

<Page.Resources>
  <ExampleListGroupStyleSelector 
     x:Key="ExampleListGroupStyleSelector"
     OneBigItemGroupStyle="{StaticResource OneBigGroupStyle}"
     NormalGroupStyle="{StaticResource NormalGroupStyle}" />
</Page.Resources>
<GridView
     ItemsSource="{Binding Source={StaticResource exampleListsViewSource}}"
     GroupStyleSelector="{StaticResource ExampleListGroupStyleSelector}">
     <GridView.ItemsPanel>
        <ItemsPanelTemplate>
           <VirtualizingStackPanel
              Orientation="Horizontal" />
        </ItemsPanelTemplate>
     </GridView.ItemsPanel>
</GridView>

But the group that I'm given in the selector is null or a DependencyObject that I can't seem to get any data off. How am I supposed to make an intelligent decision as to how to change the GroupStyle if I'm not given any information. Is there a way I can pass a property through an attached property or something along those lines?

like image 226
chrislarson Avatar asked Jul 10 '12 17:07

chrislarson


1 Answers

Based on this forum thread you can extract the object by casting it to ICollectionView and accessing the .Group property where you will get the object you bound the group to. This allows for intelligent decision on the template. However it still does not work for me (or the other people in the thread) since only one style is applied despite the fact that different styles are returned.

Edit: It turns out the GroupTemplate is not intended to produce different groups. It is intended to change the view of the group for example in snapped view or similar cases where all groups change.

like image 181
Stilgar Avatar answered Oct 07 '22 15:10

Stilgar