使用WrapPanel每行项目数量指定 [英] Specifying number of items per row using a WrapPanel

问题描述

我试图如果你点击一个瓷砖我有增加的宽度和揭示了的瓷砖更多信息动画创建一个应用程序，它看起来很像用瓦片在Windows 8的Metro UI ..现在。

I'm attempting to create an application that looks much like the Windows 8 Metro UI with the tiles.. right now if you click on a tile I have an animation that increases the width and reveals more info on that tile.

我有一个WrapPanel这是很好的奠定了地砖，因为如果我调整瓷砖瓷砖等它旁边移动，并保持它的利润率非常完美。不过，我一直在研究这个一段时间，我想如果可能的话限制在画布面板项目，以两个宽数（现在它是广三），如果你选择瓷砖的一个它自身的大小和推动瓷砖旁边（或者如果它是结束瓷砖它会推动自身）的下一行，而我的动画是光滑的它看起来并不最好的表现明智的。

I have the tiles laid out in a WrapPanel which is nice because if I resize the tile the other tiles next to it move and keep it's margin perfectly. However I've been researching this for awhile, I would like to if possible limit the number of items in the wrap panel to two wide (Right now it's three wide) as if you select one of the tiles it resizes itself and pushes a tile next to it (or if it's the end tile it will push itself) to the next row, while my animations are smooth it doesn't look the best presentation-wise..

有人能指出我朝着我怎么可以指定我wrappanel只能有两个项目在整个宽度是多少？

Could someone point me towards how I might specify my wrappanel to only have a width of two items across?

任何帮助是非常赞赏。

推荐答案

试着让你的自己包裹面板从标准画布面板派生作为的这个帖子的细节。 。邮政地址，你正在试图解决同样的问题。

Try making your own wrap panel deriving from standard wrap panel as described in this post in detail. Post addresses the same issue which you are trying to solve.

public class MyWrapPanel : WrapPanel
{
    public int MaxRows
    {
      get { return (int)GetValue(MaxRowsProperty); }
      set { SetValue(MaxRowsProperty, value); }
    }

    public static readonly DependencyProperty MaxRowsProperty =
    DependencyProperty.Register("MaxRows", typeof(int), typeof(MyWrapPanel), new UIPropertyMetadata(4));

    protected override Size ArrangeOverride(Size finalSize)
    {
       Point currentPosition = new Point();
       double ItemMaxHeight = 0.0;
       int RowIndex = 0;

       foreach (UIElement child in Children)
       {
          ItemMaxHeight = ItemMaxHeight > child.DesiredSize.Height ? ItemMaxHeight : child.DesiredSize.Height;

          if (currentPosition.X + child.DesiredSize.Width > this.DesiredSize.Width)
          {
             currentPosition = new Point(0, currentPosition.Y + ItemMaxHeight);
             ItemMaxHeight = 0.0;
             RowIndex++;
          }

         if (RowIndex < MaxRows)
         {
             child.Visibility = System.Windows.Visibility.Visible;
             Rect childRect = new Rect(currentPosition, child.DesiredSize);
             child.Arrange(childRect);
         }
         else
         {
             Rect childRect = new Rect(currentPosition, new Size(0,0));
             child.Arrange(childRect);
         }

         currentPosition.Offset(child.DesiredSize.Width, 0);
      }

      return finalSize;
   }

   protected override Size MeasureOverride(Size availableSize)
   {
       return base.MeasureOverride(availableSize);
   }

}

这篇关于使用WrapPanel每行项目数量指定的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！