PowerApps weather app

In this Power Apps tutorial, we will discuss how to show current Weather using connectors MSN Weather in PowerApps.

PowerApps weather app

Here we will see a small example on msn weather app power apps using powerapps weather app connector.

In Power Apps, Microsoft provides an MSN Weather connector to get the current weather status of various countries and states.

This PowerApps Weather app accepts country, city, and Zipcode to get the current weather status.

Power Apps weather app
weather app powerapps

Fetch current Weather in PowerApps using MSN Weather Connectors

First, we will create a canvas app from the PowerApps.com site.

If you are new to PowerApps Canvas App, check out the below URLs:

Here create an Power Apps app and you may choose Phone layout or Tablet layout.

Create canvas app for Power Apps weather app
create weather app powerapps

Next, go to the Data sources an create a new connection. Here you have to search for MSN Weather which will help us to get the current weather status.

PowerApps weather app
msn weather app power apps

Next, create a new screen and design your page as per your requirement. Here I have designed it in a very simple way.

If you want to continue with the same design, then drag and drop the PowerApps control to show the data.

Once you have created a new screen, go to the OnVisible property of the new screen and add the below code.

UpdateContext({LastLocation : "Doha,QATAR"})

In the above code, you can change the country and state name based on your requirement.

powerapps connectors

Here, we will add various controls into the PowerApps weather app screen.

Drag and drop the below controls in your Power Apps screen.

1: TxtLocation (TextBox)

Here you have to set the default location =LastLocation

weather app powerapps

2: Radio Button

Here you have to set the radio button Item property like below

 Items ->["Imperial", "Metric"]
msn weather app power apps

3: Search Button

You can add the search button icon from icon list and set the below property in OnSelect.

OnSelect :UpdateContext({Weather: MSNWeather.CurrentWeather(txtLocation.Text, Radio1_1.Selected.Value)})
powerapps connectors for weather app

4: Pressure (Label)

Here you have to set the Text property of the label as below.

Text-> Weather.responses.weather.current.baro & " " & Weather.units.pressure
weather app powerapps connector

5: Dew Point (Label)

Here you have to set the Text property of the label as below.

Text->Weather.responses.weather.current.dewPt & " o"
Power Apps weather app

6: Humidity (Label)

Here you have to set the Text property of the label as below.

Text->Weather.responses.weather.current.rh & " %"
powerapps weather app

7: Sky (Label)

Text ->Weather.responses.weather.current.sky
powerapps connectors

8: Last Update (Label)

Text->Weather.responses.weather.current.created
msn weather app power apps

9: Wind (Label)

Text ->Weather.responses.weather.current.windSpd & " " & Weather.units.speed
weather app powerapps

10: Temperature (Label)

Text ->Weather.responses.weather.current.temp & " " & Weather.units.temperature
create a weather app in power apps

11: Weather (Label)

 Text ->Weather.responses.weather.current.cap
create a weather app in powerapps
powerapps weather app

You may like following Power Apps tutorials:

Check out the PowerApps video tutorial, we discussed how to create a weather app in PowerApps.

>