Question

VariableSizedWrapGrid和WrapGrid都有奇怪的衡量标准 - 它们会根据第一项来衡量所有孩子。

因此，以下XAML将剪切第三项。

    <VariableSizedWrapGrid Orientation="Horizontal">
        <Rectangle Width="50" Height="100" Margin="5" Fill="Blue" />
        <Rectangle Width="50" Height="50" Margin="5" Fill="Red" />
        <Rectangle Width="50" Height="150" Margin="5" Fill="Green" />
        <Rectangle Width="50" Height="50" Margin="5" Fill="Red" />
        <Rectangle Width="50" Height="100" Margin="5" Fill="Red" />
    </VariableSizedWrapGrid>

似乎VariableSizedWrapGrid测量第一个项目，然后其余的孩子用第一个项目的所需大小进行测量。

有任何解决方法吗？

Answer 1

您需要在每个Rectangle VariableSizeWrapGrid.ColumnSpan和VariableSizeWrapGrid.RowSpan上使用附加属性，并将ItemHeight和ItemWidth添加到VariableSizeWrapGrid：

<VariableSizedWrapGrid Orientation="Horizontal" ItemHeight="50" ItemWidth="50"> 
    <Rectangle 
        VariableSizedWrapGrid.ColumnSpan="1" 
        VariableSizedWrapGrid.RowSpan="2"
        Width="50" Height="100" Margin="5" Fill="Blue" /> 
</VariableSizedWrapGrid>

Answer 2

它可能不是最好的方法，但这是我在@MetroRSSReader应用程序中完成此操作的方式

<common:VariableGridView.ItemsPanel>
                <ItemsPanelTemplate>
                    <VariableSizedWrapGrid ItemWidth="225" 
                                           ItemHeight="{Binding ElementName=bounds, Path=Text}" 
                                           MaximumRowsOrColumns="5" Orientation="Vertical"
                                           />
                </ItemsPanelTemplate>
                </common:VariableGridView.ItemsPanel>
        </common:VariableGridView>

请注意，ItemHeight值绑定到TextBlock

<TextBlock x:Name="bounds" Grid.Row="1" Margin="316,8,0,33" Visibility="Collapsed"/>

在LayoutAwarePage.cs

中设置

public string Fix_item_height_for_current_screen_resolution()
    {
        var screenheight = CoreWindow.GetForCurrentThread().Bounds.Height;
        var itemHeight = screenheight < 1000 ? "100" : "140";

        return itemHeight;
    }

您可以浏览完整的源代码http://metrorssreader.codeplex.com/SourceControl/changeset/view/18233#265970

Answer 3

要使用VariableSizeWrapGrid，您应该创建自己的GridView自定义控件并覆盖PrepareContainerForItemOverride并在该方法中设置RowSpan和ColumnSpan元素。这样每个元素都有自己的高度/宽度。

这是Jerry Nixon的一个很好的教程/演练：http://dotnet.dzone.com/articles/windows-8-beauty-tip-using

Answer 4

今天管理好这个。您需要在WinRT XAML工具包（http://winrtxamltoolkit.codeplex.com）中使用VisualTreeHelperExtension.cs。对我来说，我试图调整一个将GridView作为其ItemsPanelTemplate的ListView，同样的概念应该适用于你。

1）附加到ListView的LayoutUpdated事件（这是你想要更新尺寸的时候）

_myList.LayoutUpdated += _myList_LayoutUpdated;

2）使用VisualTreeHelperExtensions.GetDescendantsOfType（）在项目的数据模板中查找公共（和唯一）元素类型（例如：宽度为动态的TextBlock）：

var items = VisualTreeHelperExtensions.GetDescendantsOfType<TextBlock>(_myList);  

if (items == null || items.Count() == 0)
  return;

3）获取找到的项目的最大宽度：

double maxWidth = items.Max(i => i.ActualWidth) + 8;

4）使用VisualTreeHelperExtensions.GetDescendantsOfType（）查找ListView的主要WrapGrid容器：

var wg = _categoryList.GetDescendantsOfType<WrapGrid>();
if (wg == null || wg.Count() != 1)
  throw new InvalidOperationException("Couldn't find main ListView container");

5）将WrapGrid的ItemWidth设置为您计算的maxWidth：

wg.First().ItemWidth = maxWidth;

VariableSizedWrapGrid和WrapGrid儿童尺寸测量

4 个答案: