Android Question Help in Parsing Weather Json and showing it on label

R

RushilD

Member
Licensed User
Hello,

I need a small help or an example. I have a small section in my App where I want to show the live Weather plus weather conditions for the next 3 days. I am using accuweather for this.

I am getting the following json data response.

B4X: 
{
    "Headline": {
        "EffectiveDate": "2022-08-15T08:00:00+02:00",
        "EffectiveEpochDate": 1660543200,
        "Severity": 5,
        "Text": "A thunderstorm Monday",
        "Category": "thunderstorm",
        "EndDate": "2022-08-15T20:00:00+02:00",
        "EndEpochDate": 1660586400,
        "MobileLink": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?unit=c&lang=en-us",
        "Link": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?unit=c&lang=en-us"
    },
    "DailyForecasts": [
        {
            "Date": "2022-08-11T07:00:00+02:00",
            "EpochDate": 1660194000,
            "Temperature": {
                "Minimum": {
                    "Value": 16.1,
                    "Unit": "C",
                    "UnitType": 17
                },
                "Maximum": {
                    "Value": 28.1,
                    "Unit": "C",
                    "UnitType": 17
                }
            },
            "Day": {
                "Icon": 2,
                "IconPhrase": "Mostly sunny",
                "HasPrecipitation": false
            },
            "Night": {
                "Icon": 33,
                "IconPhrase": "Clear",
                "HasPrecipitation": false
            },
            "Sources": [
                "AccuWeather"
            ],
            "MobileLink": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=1&unit=c&lang=en-us",
            "Link": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=1&unit=c&lang=en-us"
        },
        {
            "Date": "2022-08-12T07:00:00+02:00",
            "EpochDate": 1660280400,
            "Temperature": {
                "Minimum": {
                    "Value": 17.5,
                    "Unit": "C",
                    "UnitType": 17
                },
                "Maximum": {
                    "Value": 28.3,
                    "Unit": "C",
                    "UnitType": 17
                }
            },
            "Day": {
                "Icon": 1,
                "IconPhrase": "Sunny",
                "HasPrecipitation": false
            },
            "Night": {
                "Icon": 33,
                "IconPhrase": "Clear",
                "HasPrecipitation": false
            },
            "Sources": [
                "AccuWeather"
            ],
            "MobileLink": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=2&unit=c&lang=en-us",
            "Link": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=2&unit=c&lang=en-us"
        },
        {
            "Date": "2022-08-13T07:00:00+02:00",
            "EpochDate": 1660366800,
            "Temperature": {
                "Minimum": {
                    "Value": 18.3,
                    "Unit": "C",
                    "UnitType": 17
                },
                "Maximum": {
                    "Value": 28.1,
                    "Unit": "C",
                    "UnitType": 17
                }
            },
            "Day": {
                "Icon": 2,
                "IconPhrase": "Mostly sunny",
                "HasPrecipitation": false
            },
            "Night": {
                "Icon": 33,
                "IconPhrase": "Clear",
                "HasPrecipitation": false
            },
            "Sources": [
                "AccuWeather"
            ],
            "MobileLink": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=3&unit=c&lang=en-us",
            "Link": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=3&unit=c&lang=en-us"
        },
        {
            "Date": "2022-08-14T07:00:00+02:00",
            "EpochDate": 1660453200,
            "Temperature": {
                "Minimum": {
                    "Value": 19.9,
                    "Unit": "C",
                    "UnitType": 17
                },
                "Maximum": {
                    "Value": 29.3,
                    "Unit": "C",
                    "UnitType": 17
                }
            },
            "Day": {
                "Icon": 3,
                "IconPhrase": "Partly sunny",
                "HasPrecipitation": false
            },
            "Night": {
                "Icon": 36,
                "IconPhrase": "Intermittent clouds",
                "HasPrecipitation": false
            },
            "Sources": [
                "AccuWeather"
            ],
            "MobileLink": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=4&unit=c&lang=en-us",
            "Link": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=4&unit=c&lang=en-us"
        },
        {
            "Date": "2022-08-15T07:00:00+02:00",
            "EpochDate": 1660539600,
            "Temperature": {
                "Minimum": {
                    "Value": 16.6,
                    "Unit": "C",
                    "UnitType": 17
                },
                "Maximum": {
                    "Value": 23.9,
                    "Unit": "C",
                    "UnitType": 17
                }
            },
            "Day": {
                "Icon": 4,
                "IconPhrase": "Intermittent clouds",
                "HasPrecipitation": true,
                "PrecipitationType": "Rain",
                "PrecipitationIntensity": "Moderate"
            },
            "Night": {
                "Icon": 35,
                "IconPhrase": "Partly cloudy",
                "HasPrecipitation": false
            },
            "Sources": [
                "AccuWeather"
            ],
            "MobileLink": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=5&unit=c&lang=en-us",
            "Link": "http://www.accuweather.com/en/de/hemer/58675/daily-weather-forecast/174476?day=5&unit=c&lang=en-us"
        }
    ]
}


Using the https://b4x.com:51041/json/index.html

I get the following output:

B4X: 
Dim parser As JSONParser
parser.Initialize(<text>)
Dim jRoot As Map = parser.NextObject
Dim Headline As Map = jRoot.Get("Headline")
Dim Category As String = Headline.Get("Category")
Dim EndEpochDate As Int = Headline.Get("EndEpochDate")
Dim EffectiveEpochDate As Int = Headline.Get("EffectiveEpochDate")
Dim Severity As Int = Headline.Get("Severity")
Dim Text As String = Headline.Get("Text")
Dim EndDate As String = Headline.Get("EndDate")
Dim Link As String = Headline.Get("Link")
Dim EffectiveDate As String = Headline.Get("EffectiveDate")
Dim MobileLink As String = Headline.Get("MobileLink")
Dim DailyForecasts As List = jRoot.Get("DailyForecasts")
For Each colDailyForecasts As Map In DailyForecasts
 Dim Temperature As Map = colDailyForecasts.Get("Temperature")
 Dim Minimum As Map = Temperature.Get("Minimum")
 Dim UnitType As Int = Minimum.Get("UnitType")
 Dim Value As Double = Minimum.Get("Value")
 Dim Unit As String = Minimum.Get("Unit")
 Dim Maximum As Map = Temperature.Get("Maximum")
 Dim UnitType As Int = Maximum.Get("UnitType")
 Dim Value As Double = Maximum.Get("Value")
 Dim Unit As String = Maximum.Get("Unit")
 Dim Night As Map = colDailyForecasts.Get("Night")
 Dim HasPrecipitation As String = Night.Get("HasPrecipitation")
 Dim IconPhrase As String = Night.Get("IconPhrase")
 Dim Icon As Int = Night.Get("Icon")
 Dim EpochDate As Int = colDailyForecasts.Get("EpochDate")
 Dim Day As Map = colDailyForecasts.Get("Day")
 Dim HasPrecipitation As String = Day.Get("HasPrecipitation")
 Dim IconPhrase As String = Day.Get("IconPhrase")
 Dim Icon As Int = Day.Get("Icon")
 Dim Sources As List = colDailyForecasts.Get("Sources")
 For Each colSources As String In Sources
 Next
 Dim Date As String = colDailyForecasts.Get("Date")
 Dim Link As String = colDailyForecasts.Get("Link")
 Dim MobileLink As String = colDailyForecasts.Get("MobileLink")
Next


I am not sure how to use the above as I would like to parse the data separately and then show them on labels as Day 1, Day 2 and Day 3 etc as shown in the below image


1660222691961.png
 
Sort by date Sort by votes
DonManfred

DonManfred

Expert
Licensed User
Longtime User
RushilD said:
as I would like to parse the data separately
Click to expand...
you have to extract the data whereever you need them.

RushilD said:
For Each colDailyForecasts As Map In DailyForecasts
Click to expand...
you need to use the data in that loop to create the daily forecasts...

B4X: 
or Each colDailyForecasts As Map In DailyForecasts
 Dim Temperature As Map = colDailyForecasts.Get("Temperature")
 Dim Minimum As Map = Temperature.Get("Minimum")
 Dim UnitType As Int = Minimum.Get("UnitType")
 Dim Value As Double = Minimum.Get("Value")
 Dim Unit As String = Minimum.Get("Unit")
 Dim Maximum As Map = Temperature.Get("Maximum")
 Dim UnitType As Int = Maximum.Get("UnitType")
 Dim Value As Double = Maximum.Get("Value")
 Dim Unit As String = Maximum.Get("Unit")
 Dim Night As Map = colDailyForecasts.Get("Night")
 Dim HasPrecipitation As String = Night.Get("HasPrecipitation")
 Dim IconPhrase As String = Night.Get("IconPhrase")
 Dim Icon As Int = Night.Get("Icon")
 Dim EpochDate As Int = colDailyForecasts.Get("EpochDate")
 Dim Day As Map = colDailyForecasts.Get("Day")
 Dim HasPrecipitation As String = Day.Get("HasPrecipitation")
 Dim IconPhrase As String = Day.Get("IconPhrase")
 Dim Icon As Int = Day.Get("Icon")
 Dim Sources As List = colDailyForecasts.Get("Sources")
 For Each colSources As String In Sources
 Next
 Dim Date As String = colDailyForecasts.Get("Date")
 Dim Link As String = colDailyForecasts.Get("Link")
 Dim MobileLink As String = colDailyForecasts.Get("MobileLink")
  ' Work with the data from this day.....
Next
 
Upvote 0
DonManfred

DonManfred

Expert
Licensed User
Longtime User
RushilD said:
Do you have any small example ?
Click to expand...
i already posted it. Do not expect me writing your code.
You get the correct code already from the jsontool. I highlighted just the correct line (added a comment) for you to add your code there. It is up to you to understand how the code is working and what you get (add log to see the values in the loop)

All you need is to understand the code and use the variables you get in the loop to fill your label(s).
 
Upvote 0
Alexander Stolte

Alexander Stolte

Expert
Licensed User
Longtime User
Instead of using the date, use the "EpochDate", this can be more easily converted to ticks and made into the day name of the week.
B4X: 
    Dim jRoot As Map = parser.NextObject
    Dim DailyForecasts As List = jRoot.Get("DailyForecasts")
    For Each colDailyForecasts As Map In DailyForecasts

        Dim Date As Long = DateUtils.UnixTimeToTicks(colDailyForecasts.Get("EpochDate")) 'The Date in Ticks

        Log(DateUtils.TicksToString(Date)) 'Ticks to string
        Log(DateUtils.GetDayOfWeekName(Date)) 'Weekday Name

    Next
 
Upvote 0
aeric

aeric

Expert
Licensed User
Longtime User
You need to look for interesting "keywords"
I think it is more easier to visualize the JSON using the right panel with treeview.
Look inside the "DailyForecasts". It shows data starting from Day index = 0 to index = 4.

As mentioned by Alexander above, you can make use of "EpochDate" for the date.
For Temperature, I think the Maximum value is more interesting for Day time. Minimum value is for Night time.
For the icons number, check their documentation: https://developer.accuweather.com/weather-icons
You can use your own icons or load the image from the image source. You can also use the Text map to that icon number.
 
Upvote 0
R

RushilD

Member
Licensed User
Thank you for the replies and input. I am actually struggling to understand how to parse the FOR EACH LOOP in the json parser ? and store and update the day, temperature labels one by one.
 
Upvote 0
aeric

aeric

Expert
Licensed User
Longtime User
RushilD said:
I am able to update only 1 label. Not sure how to parse and load the other two labels
Click to expand...
You need to understand the basic how For loop works.
If you don’t understand, please go through B4X guide


You also need to understand how to use If-Then-Else to control the flow.


The pseudocode will look like this:
B4X: 
Dim Index As Int
For Each item in Items
    Index = Index + 1
    If Index = 1 Then
        Label1.Text = Temperature
    Else If Index = 2 Then
        Label2.Text = Temperature
    Else If Index = 3 Then
        Label3.Text = Temperature
    End If
Next
 
Last edited:
Upvote 0
rwblinn

rwblinn

Well-Known Member
Licensed User
Longtime User
Scribbled an example B4XPages project - tested with B4J (only) - see attached.
The JSON test data provided in post #1 is parsed to show the 5 day forecast.
Each day is created with views and added to a pane.
The icons are downloaded from AccuWeather via resumable sub.

Give a go and test with B4A ... Good Luck.

1660552954180.png
 

Attachments

  • accuweather.zip
    4.7 KB · Views: 216
Last edited:
Upvote 0
You must log in or register to reply here.
Top