列表中的数据绑定列表，uwp + xaml

Question

我有以下型号：

public class TableData
{
    [JsonProperty(PropertyName = "objectsDetected")]
    public List<ObjectsDetected> ObjectsDetected { get; set; }

    [JsonProperty(PropertyName = "file_name_at_upload")]
    public int File_Name_At_Upload { get; set; }
}

public class ObjectsDetected
{
    [JsonProperty(PropertyName = "className")]
    public string className { get; set; }

    [JsonProperty(PropertyName = "score")]
    public double score { get; set; }
}

我从 api 调用中获取我的数据：

        var request = (HttpWebRequest)WebRequest.Create("http://localhost:58941/api/data");
        request.Method = "GET";
        request.ContentType = "application/json";
        WebResponse response = await request.GetResponseAsync();

        if (response != null)
        {
            string responseString = new StreamReader(response.GetResponseStream()).ReadToEnd();

            List<TableData> myDeserializedObjList = (List<TableData>)JsonConvert.DeserializeObject(responseString, typeof(List<TableData>));
            cosmosData.ItemsSource = myDeserializedObjList;

        }

这是 XAML 代码：

    <StackPanel>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="200"/>
                <ColumnDefinition Width="200"/>
            </Grid.ColumnDefinitions>

            <TextBlock Grid.Column="0" Text="Navn på billede" Foreground="Black" FontSize="20" FontWeight="Bold"/>
            <TextBlock Grid.Column="2" Text="Kategori fundet" Foreground="Black" FontSize="20" FontWeight="Bold"/>
        </Grid>
            <GridView x:Name="cosmosData"
                      ItemClick="cosmosData_ItemClick"
                      IsItemClickEnabled="True"
                      IsSwipeEnabled="true"
                      SelectionMode="Single">
                <GridView.ItemTemplate>
                <DataTemplate x:DataType="local:TableData">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="200"/>
                            <ColumnDefinition Width="200"/>
                        </Grid.ColumnDefinitions>

                        <TextBlock Grid.Column="0" Text="{x:Bind File_Name_At_Upload}" />
                        <TextBlock Grid.Column="2" Text="{x:Bind ObjectsDetected.className}"/>

                    </Grid>
                </DataTemplate>

            </GridView.ItemTemplate>
            </GridView>
    </StackPanel>

我想在同一个 table 中显示在用户界面 TableData 和 ObjectsDetected.classname，但是我无法访问 ObjectsDetected.classname？我怎样才能做到这一点？

Answer 1

由于您希望在每个 TableData 中显示多个 class 名称，因此您将需要创建所有 class 名称的复合字符串或使用 ItemsControl 来显示它们。后者的性能不佳，但也可以像这样纯粹地在 XAML 中轻松实现：

<GridView x:Name="cosmosData" ItemClick="cosmosData_ItemClick" IsItemClickEnabled="True" IsSwipeEnabled="true" SelectionMode="Single">
<GridView.ItemTemplate>
    <DataTemplate x:DataType="local:TableData">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="200"/>
                <ColumnDefinition Width="200"/>
            </Grid.ColumnDefinitions>
            <TextBlock Grid.Column="0" Text="{x:Bind File_Name_At_Upload}" />
            <ItemsControl Grid.Column="1" ItemsSource="{x:Bind ObjectsDetected}">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding className}"/>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </Grid>
    </DataTemplate>
</GridView.ItemTemplate>

作为替代选项，您可以像这样在 TableData 模型上添加另一个属性：

public class TableData
{
    [JsonProperty(PropertyName = "objectsDetected")]
    public List<ObjectsDetected> ObjectsDetected { get; set; }

    [JsonProperty(PropertyName = "file_name_at_upload")]
    public int File_Name_At_Upload { get; set; }

    [JsonIgnore]
    public string ClassNames => String.Join(",", ObjectsDetected.Select(o => o.className));
}

然后在您的原始代码中，改为绑定到 ClassNames 属性。（这将逗号连接值，但您可以使用 \n 而不是 , 将每个值放在它自己的行上）。您还需要在 TextBlock

中设置 TextWrapping

列表中的数据绑定列表，uwp + xaml

data-bind list within a list, uwp + xaml

c#

xaml

json

uwp

uwp-xaml