Group Panel styling

Group Panel styling

Posted by: egor.kachiguine on 8 May 2019, 11:30 am EST

• 

  egor.kachiguine

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 8 May 2019, 11:30 am EST

  Are there any resources on changing the appearance of the group panel? This is chiefly regarding to do with its height and how it grows as new groups are added. I can cap it with MaxHeight, but is there a way to set the “drop” in the group heading buttons that keep pushing the bottom of the bar further down?

• 

  basant.khatiyan

  

  • Post Options:
  • Link
    Copy

  Posted 9 May 2019, 5:06 am EST

  Hi Egor,

  FlexGridGroupPanel does not expose any such property that can be used to adjust the vertical offset for group buttons on the panel. However, we can manage to do this by specifying the top margin for each of these buttons as required. Group panel actually arranges these buttons on a StackPanel so, we can handle the LayoutUpdated event on this StackPanel to achieve our target as follows:

  
  private void groupPanel_Loaded(object sender, RoutedEventArgs e)
  {
   var child = VisualTreeHelper.GetChild(groupPanel, 0) as Grid;
   stackPanel = child.Children[1] as StackPanel;
   stackPanel.LayoutUpdated += StackPanel_LayoutUpdated;
  }
  
  private void StackPanel_LayoutUpdated(object sender, EventArgs e)
  {
   int count = 0;
   foreach(FrameworkElement child in stackPanel.Children)
   {
    child.Margin = new Thickness(child.Margin.Left, 2 * count, child.Margin.Right, child.Margin.Bottom);
    count++;
   }
  }
  
  

  Also, you can refer the attached sample(prj_StyleGroupPanel.zip) to verify the same.

  Thanks & Regards,
  
  Basant

  prj_StyleGroupPanel.zip

• 

  egor.kachiguine

  • Post Options:
  • Link
    Copy

  Posted 23 May 2019, 8:30 am EST

  This worked perfectly, thank you.