How to show array inside of other object array in Collection View Xamarin Forms

huangapple go评论56阅读模式
英文:

How to show array inside of other object array in Collection View Xamarin Forms

问题

I have a JSON response

{
    "_id" : ObjectId("634b6be99237b35a9aa80dd5"),
    "updatedAt" : ISODate("2022-10-16T02:27:44.766+0000"),
    "createdAt" : ISODate("2022-10-16T02:26:49.276+0000"),
    "firstName" : "Romulo",
    "lastName" : "Calderon",
    "email" : "romuloacd@gmail.com",
    "phone" : "0962908538",
    "description" : "Hoy u",
    "user" : ObjectId("5aee09ef88b9ac4289109574"),
    "appoinmentAt" : ISODate("2022-10-17T14:00:00.000+0000"),
    "status" : [
        {
            "createdAt" : ISODate("2022-08-22T20:15:48.672+0000"),
            "value" : "DEUDA",
            "name" : "WITHOUT_PAYING"
        },
        {
            "createdAt" : ISODate("2022-08-22T20:15:48.672+0000"),
            "value" : "PAGADO",
            "name" : "PAID_OUT"
        }
    ],
    "total" : 45.36,
    "iva" : NumberInt(12),
    "value" : 40.5,
    "time" : NumberInt(30),
    "__v" : NumberInt(0)
}

from an API call, I already show the most fields in collection without any problem, but I have inside the response another array defined in this model:

namespace App1.Models
{
    public class TicketsApi
    {
        [JsonProperty("_id")]
        public string Idtickets { get; set; }
        [JsonProperty("user")]
        public string Idusuario { get; set; }
        [JsonProperty("firstName")]
        public string Nombresolicitante { get; set; }
        [JsonProperty("lastName")]
        public string Apellidosolicitante { get; set; }
        [JsonProperty("email")]
        public string CorreoSolicitante { get; set; }
        [JsonProperty("description")]
        public string Motivoconsulta { get; set; }
        [JsonProperty("phone")]
        public string CelularSolicitante { get; set; }


        [JsonProperty("value")]
        public string ValorSolicitante { get; set; }

        [JsonProperty("time")]
        public string TiempoSolicitante { get; set; }


        [JsonProperty("status")]

        public Estado[] Status { get; set; }
        [JsonProperty("appoinmentAt")]
        public DateTime CitaSolicitante { get; set; }


        [JsonProperty("createdAt")]
        public DateTime FechaCreacion { get; set; }

    }

    public class Estado
    {


        [JsonProperty("value")]
        public string EstadoPago { get; set; }


        [JsonProperty("name")]
        public string EstadoTransaccion { get; set; }

       


    }
}

In the front I have this xaml code, and all the field works good, but after many researches I don't know how load correctly the array Estado define in TicketsApi.
This is the code that runs OK, thanks to Jason and the solution of the problem

<CollectionView 
    ItemsSource="{Binding ItemsSubasta}"
    SelectionMode="Single">
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <Frame BackgroundColor="#eee"
                   BorderColor="#ddd"
                   Padding="20">
                <StackLayout x:DataType="model:TicketsApi">
                    <Label Text="{Binding Nombresolicitante, StringFormat='Nombres: {0:N}'}"
                           LineBreakMode="NoWrap"
                           FontSize="14" />
                    <Label Text="{Binding Apellidosolicitante, StringFormat='Apellidos: {0:N}'}"
                           LineBreakMode="NoWrap"
                           FontSize="14" />
                    <Label Text="{Binding CitaSolicitante, StringFormat='Fecha de consulta: {0}'}"
                           LineBreakMode="NoWrap"
                           FontSize="16" />
                    <Label Text="{Binding TiempoSolicitante, StringFormat='Tiempo: {0:N} minutos'}"
                           LineBreakMode="NoWrap"
                           FontSize="13" />
                    <Label Text="{Binding ValorSolicitante, StringFormat='Valor Consulta: {0:N} dólares (incluye IVA)'}"
                           LineBreakMode="NoWrap"
                           FontSize="13" />
                    <StackLayout  BindableLayout.ItemsSource="{Binding Status}">
                        <BindableLayout.ItemTemplate>
                            <DataTemplate  x:DataType="model:Estado">
                                <Label Text="{Binding EstadoTransaccion }" />
                            </DataTemplate>
                        </BindableLayout.ItemTemplate>
                    </StackLayout>
                </StackLayout>
            </Frame>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>

I try though to show the correctly the fields inside "Estado" array which is inside TicketsApi model

英文:

I have a JSON response

{
    &quot;_id&quot; : ObjectId(&quot;634b6be99237b35a9aa80dd5&quot;),
    &quot;updatedAt&quot; : ISODate(&quot;2022-10-16T02:27:44.766+0000&quot;),
    &quot;createdAt&quot; : ISODate(&quot;2022-10-16T02:26:49.276+0000&quot;),
    &quot;firstName&quot; : &quot;Romulo&quot;,
    &quot;lastName&quot; : &quot;Calderon&quot;,
    &quot;email&quot; : &quot;romuloacd@gmail.com&quot;,
    &quot;phone&quot; : &quot;0962908538&quot;,
    &quot;description&quot; : &quot;Hoy u&quot;,
    &quot;user&quot; : ObjectId(&quot;5aee09ef88b9ac4289109574&quot;),
    &quot;appoinmentAt&quot; : ISODate(&quot;2022-10-17T14:00:00.000+0000&quot;),
    &quot;status&quot; : [
        {
            &quot;createdAt&quot; : ISODate(&quot;2022-08-22T20:15:48.672+0000&quot;),
            &quot;value&quot; : &quot;DEUDA&quot;,
            &quot;name&quot; : &quot;WITHOUT_PAYING&quot;
        },
        {
            &quot;createdAt&quot; : ISODate(&quot;2022-08-22T20:15:48.672+0000&quot;),
            &quot;value&quot; : &quot;PAGADO&quot;,
            &quot;name&quot; : &quot;PAID_OUT&quot;
        }
    ],
    &quot;total&quot; : 45.36,
    &quot;iva&quot; : NumberInt(12),
    &quot;value&quot; : 40.5,
    &quot;time&quot; : NumberInt(30),
    &quot;__v&quot; : NumberInt(0)
}

from an API call, I already show the most fields in collection without any problem, but I have inside the response another array defined in this model:

namespace App1.Models
{
    public class TicketsApi
    {
        [JsonProperty(&quot;_id&quot;)]
        public string Idtickets { get; set; }
        [JsonProperty(&quot;user&quot;)]
        public string Idusuario { get; set; }
        [JsonProperty(&quot;firstName&quot;)]
        public string Nombresolicitante { get; set; }
        [JsonProperty(&quot;lastName&quot;)]
        public string Apellidosolicitante { get; set; }
        [JsonProperty(&quot;email&quot;)]
        public string CorreoSolicitante { get; set; }
        [JsonProperty(&quot;description&quot;)]
        public string Motivoconsulta { get; set; }
        [JsonProperty(&quot;phone&quot;)]
        public string CelularSolicitante { get; set; }


        [JsonProperty(&quot;value&quot;)]
        public string ValorSolicitante { get; set; }

        [JsonProperty(&quot;time&quot;)]
        public string TiempoSolicitante { get; set; }


        [JsonProperty(&quot;status&quot;)]

        public Estado[] Status { get; set; }
        [JsonProperty(&quot;appoinmentAt&quot;)]
        public DateTime CitaSolicitante { get; set; }


        [JsonProperty(&quot;createdAt&quot;)]
        public DateTime FechaCreacion { get; set; }

    }

    public class Estado
    {


        [JsonProperty(&quot;value&quot;)]
        public string EstadoPago { get; set; }


        [JsonProperty(&quot;name&quot;)]
        public string EstadoTransaccion { get; set; }

       


    }
}

In the front I have this xaml code, and all the field works good, but after many researches I don't know how load correctly the array Estado define in TicketsAPi.
This is the code that runs OK, thanks to Jason and the solution of the problem

                 &lt;CollectionView 
                            ItemsSource=&quot;{Binding ItemsSubasta}&quot;
                            SelectionMode=&quot;Single&quot;&gt;
                &lt;CollectionView.ItemTemplate&gt;
                    &lt;DataTemplate&gt;
                        &lt;Frame BackgroundColor=&quot;#eee&quot;
                               BorderColor=&quot;#ddd&quot;
                               Padding=&quot;20&quot;&gt;
                            &lt;StackLayout x:DataType=&quot;model:TicketsApi&quot;&gt;
                                &lt;Label Text=&quot;{Binding Nombresolicitante, StringFormat=&#39;Nombres: {0:N}&#39;}&quot;
                                       LineBreakMode=&quot;NoWrap&quot;
                                       FontSize=&quot;14&quot; /&gt;
                                &lt;Label Text=&quot;{Binding Apellidosolicitante, StringFormat=&#39;Apellidos: {0:N}&#39;}&quot;
                                       LineBreakMode=&quot;NoWrap&quot;
                                       FontSize=&quot;14&quot; /&gt;
                                &lt;Label Text=&quot;{Binding CitaSolicitante, StringFormat=&#39;Fecha de consulta: {0}&#39;}&quot;
                                       LineBreakMode=&quot;NoWrap&quot;
                                       FontSize=&quot;16&quot; /&gt;
                                &lt;Label Text=&quot;{Binding TiempoSolicitante, StringFormat=&#39;Tiempo: {0:N} minutos&#39;}&quot;
                                       LineBreakMode=&quot;NoWrap&quot;
                                       FontSize=&quot;13&quot; /&gt;
                                &lt;Label Text=&quot;{Binding ValorSolicitante, StringFormat=&#39;Valor Consulta: {0:N} d&#243;lares (incluye IVA)&#39;}&quot;
                                       LineBreakMode=&quot;NoWrap&quot;
                                       FontSize=&quot;13&quot; /&gt;
                                &lt;StackLayout  BindableLayout.ItemsSource=&quot;{Binding Status}&quot;
                                             
                                              &gt;
                                    &lt;BindableLayout.ItemTemplate&gt;
                                        &lt;DataTemplate  x:DataType=&quot;model:Estado&quot; &gt;
                                            &lt;Label Text=&quot;{Binding EstadoTransaccion }&quot; /&gt;
                                        &lt;/DataTemplate&gt;
                                    &lt;/BindableLayout.ItemTemplate&gt;
                                &lt;/StackLayout&gt;
                            &lt;/StackLayout&gt;
                        &lt;/Frame&gt;
                    &lt;/DataTemplate&gt;
                &lt;/CollectionView.ItemTemplate&gt;
            &lt;/CollectionView&gt;

I try though to show the correctly the fields inside "Estado" array which is inside TicketsApi model

答案1

得分: 0

您可以使用BindableLayout来显示一个项目集合,而不需要将其包装在CollectionView中。

请参考以下代码:

<CollectionView 
    ItemsSource="{Binding ItemsSubasta}"
    SelectionMode="Single">
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <Frame BackgroundColor="#eee"
                   BorderColor="#ddd"
                   Padding="20">
                <StackLayout x:DataType="model:TicketsApi">
                    <Label Text="{Binding Nombresolicitante, StringFormat='Nombres: {0:N}'}"
                           LineBreakMode="NoWrap"
                           FontSize="14" />
                    <Label Text="{Binding Apellidosolicitante, StringFormat='Apellidos: {0:N}'}"
                           LineBreakMode="NoWrap"
                           FontSize="14" />
                    <Label Text="{Binding CitaSolicitante, StringFormat='Fecha de consulta: {0}'}"
                           LineBreakMode="NoWrap"
                           FontSize="16" />
                    <Label Text="{Binding TiempoSolicitante, StringFormat='Tiempo: {0:N} minutos'}"
                           LineBreakMode="NoWrap"
                           FontSize="13" />
                    <Label Text="{Binding ValorSolicitante, StringFormat='Valor Consulta: {0:N} dólares (incluye IVA)'}"
                           LineBreakMode="NoWrap"
                           FontSize="13" />

                    <!-- 在此添加代码 -->

                    <StackLayout BindableLayout.ItemsSource="{Binding Status}">
                        <BindableLayout.ItemTemplate>
                            <DataTemplate>
                                <Label Text="{Binding EstadoTransaccion}" />
                            </DataTemplate>
                        </BindableLayout.ItemTemplate>
                    </StackLayout>
                </StackLayout>
            </Frame>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>
英文:

You can use BindableLayout to display a collection of items without wrapping it in CollectionView.

Please refer to the following code:

   &lt;CollectionView 
                        ItemsSource=&quot;{Binding ItemsSubasta}&quot;
                        SelectionMode=&quot;Single&quot;&gt;
            &lt;CollectionView.ItemTemplate&gt;
                &lt;DataTemplate&gt;
                    &lt;Frame BackgroundColor=&quot;#eee&quot;
                           BorderColor=&quot;#ddd&quot;
                           Padding=&quot;20&quot;&gt;
                        &lt;StackLayout x:DataType=&quot;model:TicketsApi&quot;&gt;
                            &lt;Label Text=&quot;{Binding Nombresolicitante, StringFormat=&#39;Nombres: {0:N}&#39;}&quot;
                                   LineBreakMode=&quot;NoWrap&quot;
                                   FontSize=&quot;14&quot; /&gt;
                            &lt;Label Text=&quot;{Binding Apellidosolicitante, StringFormat=&#39;Apellidos: {0:N}&#39;}&quot;
                                   LineBreakMode=&quot;NoWrap&quot;
                                   FontSize=&quot;14&quot; /&gt;
                            &lt;Label Text=&quot;{Binding CitaSolicitante, StringFormat=&#39;Fecha de consulta: {0}&#39;}&quot;
                                   LineBreakMode=&quot;NoWrap&quot;
                                   FontSize=&quot;16&quot; /&gt;
                            &lt;Label Text=&quot;{Binding TiempoSolicitante, StringFormat=&#39;Tiempo: {0:N} minutos&#39;}&quot;
                                   LineBreakMode=&quot;NoWrap&quot;
                                   FontSize=&quot;13&quot; /&gt;
                            &lt;Label Text=&quot;{Binding ValorSolicitante, StringFormat=&#39;Valor Consulta: {0:N} d&#243;lares (incluye IVA)&#39;}&quot;
                                   LineBreakMode=&quot;NoWrap&quot;
                                   FontSize=&quot;13&quot; /&gt;
                           
                    &lt;!-- add code here --&gt;

                &lt;StackLayout  BindableLayout.ItemsSource=&quot;{Binding Status}&quot;&gt;
                    &lt;BindableLayout.ItemTemplate&gt;
                        &lt;DataTemplate&gt;
                            &lt;Label Text=&quot;{Binding EstadoTransaccion}&quot;/&gt;
                        &lt;/DataTemplate&gt;
                    &lt;/BindableLayout.ItemTemplate&gt;
                &lt;/StackLayout&gt;
                        &lt;/StackLayout&gt;
                    &lt;/Frame&gt;
                &lt;/DataTemplate&gt;
            &lt;/CollectionView.ItemTemplate&gt;
        &lt;/CollectionView&gt;

huangapple
  • 本文由 发表于 2023年5月28日 07:04:41
  • 转载请务必保留本文链接:https://go.coder-hub.com/76349357.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定