How to Deserialize the Nested List in or Xamarin

Question

I want to consume the weather api in .Net MAUI and I have used this code to get the weather data.

 public class Weather
    {

        public int Id { get; set; }

        public string Main { get; set; }

        public string Icon{ get; set; }
    }


 public class Daily
    {

        public int Dt{ get; set; }

        public string Temp{ get; set; }

        public List<Weather> Weather { get; set; }
    }

 public class WeatherRoot
    {

       public double Lat { get; set; }

       public double Lon { get; set; }

        public List<Daily> Daily { get; set; }

    }

  public async Task<WeatherRoot> GetTemperatureDetails()
        {
            var httpClient = new HttpClient();
            var response = await httpClient.GetStringAsync("MyApiEndpointURL");
            return JsonConvert.DeserializeObject<WeatherRoot>(response);
        }

Now I want to creat the List of Daily Weather conditions where I need to display the information and also to get the Icon which is present in the Weather Class.
But I don't know how to achieve this functionality because I'm new in JSON and it's somehow hard for me to understand the nested JSON deserialization.

Answer 1

First of all you need an ObservableCollection<Daily>
Then you need to iterate using foreach loop and the last step is to add the Data Binding.
Let me share the code with you.

 public ObservableCollection<Daily> DailyCollection { get; set; }

 public MainPage()
        {
            InitializeComponent();
            DailyCollection = new ObservableCollection<Daily>();
        }

 public async Task<WeatherRoot> GetTemperatureDetails()
        {
            var httpClient = new HttpClient();
            var response = await httpClient.GetStringAsync("MyApiEndpointURL");
            return JsonConvert.DeserializeObject<WeatherRoot>(response);
        }


 protected override async void OnAppearing()
        {
            base.OnAppearing();

            var tempDetails = await GetTemperatureDetails();

           foreach (var item in tempDetails.Daily)
            {
              DailyCollection.Add(item);
            }
        }

Now you can bind the Model class properties inside your XAML Page.
To bind the Temp property of Daily Class with your Label you need to write the following code.

<Label Text="{Binding Temp}"/>

But remember to bind the Icon property of Weather Class with your image control you need to use

<Image Source="{Binding Weather[0].Icon}" />