0

我真的很喜欢 Avalonia 框架!但是在我的一个项目上遇到了一些死胡同。

我试图在 WrapPanel 内的堆栈面板中显示数据组。这样我就可以填充屏幕的宽度,然后让它们移动到新的一行。允许用户界面动态“构建”屏幕,而无需我静态声明面板。

这是我需要显示的数据。(输出组列表):

public class OutputGroup
{ 
    public string? GroupName { get; set; }
    public ObservableCollection<OutputValuePair> OutputValues { get; set; }
}


public class OutputValuePair
{
    public string? Name { get; set; }
    public string? Value { get; set; }
    public int ArrayPosition { get; set; }

    public string Test {
        get => this.Name + ": " + this.Value;
    }
}

最终目标是每个组有一个框,在每个框中,组名将位于顶部,然后是名称 + 值对的垂直方向,并且无论我的 OutputGroup 列表的大小如何,都将以一种“正常工作”的动态方式进行操作。

这是我尝试过的experimental.asaml 代码:

        <!-- Pannel Left to Right, wraps to next line-->
    <WrapPanel>

        <Panel Height="300" Width="300">
            <TextBlock Name="hgfghf" Text="ONE" FontWeight="Bold" TextDecorations="Underline" Background="Blue"/>
        </Panel>

        <Panel Height="300" Width="300">
            <TextBlock Name="fsf" Text="TWO" FontWeight="Bold" TextDecorations="Underline" Background="Blue"/>
        </Panel>

        <!-- Iterate over the object list -->
        <!-- This seems to not follow the wrap pannel left to right... ??-->
        <ItemsRepeater Items="{Binding OutputGroups}">
            <ItemsRepeater.ItemTemplate>
                
                <DataTemplate>

                    <Panel Height="300" Width="300">
                        <TextBlock Text="TEST" FontWeight="Bold" TextDecorations="Underline" Background="Blue"/>
                    </Panel>
                
                </DataTemplate>
                
            </ItemsRepeater.ItemTemplate>
        </ItemsRepeater>
    
    </WrapPanel>

然而,在这段代码中,我看到的是两个面板按预期显示,从左到右。但是项目重复面板仅在屏幕垂直下方显示 1,就好像它们忽略了我不想要的包装面板一样。

谁能解释为什么这不起作用,或者就如何实现我的最终目标提供替代建议?

4

0 回答 0