ionWeather

ionWeather

weather display for ionic

$9.00

Dao Duy Thanh

Dao Duy Thanh

Member since 2015

Details

Version:
1.0
Ionic:
4.x, 5.x  
Platforms:
iOS, Android  
Released:
5 years ago
Updated:
1 year ago
Category:
Plugins
Tags:
ionic, ionicframework, wather, weatherforcast,

If you have any payment problem or cannot pay via paypal, please pay via https://sellfy.com/p/ifqh/ or contact me: **[email protected]**

This plugin supports you to display weather data with beauty styles. I can display Temp, humidity, wind, cities It's easy to plug your api to the model and customize this plugin.

How to buy

Click on Purchase externally button and go to gumroad.com, you can buy this app there.

Features

  • Include 3 templates with difference style
  • Including Weather font
  • Standard json struct from Open Weather
  • Display date, current temp, current, humidity, wind speed, wind direction, next 5 days weather
  • Weather in difference location
  • Easy customize with sass

Demo

Download the zip file containing the entire demo app and unzip Go inside the extracted folder

Run $ npm install

Run $ bower install

Try: $ ionic serve

The browser should automatically open the app

Install

Read this document for ionic 4 version

Ionic 1:

Download and extract the source code.

Copy scss/*ion-weather.scss to your project scss directory and include to your main scss file: @import "*ion-weather.scss";

Copy www/img/weather to your www/img

Copy www/templates/weather to your www/templates

Copy www/lib/weather-icons to your www/lib/

Include weather css files in your index.html

<!-- weather font --> <link href="lib/weather-icons/css/weather-icons.min.css" rel="stylesheet"> <link href="lib/weather-icons/css/weather-icons-wind.min.css" rel="stylesheet">

Copy weather routes from www/js/app.js to your app.js

``` // weather view

// style 1 .state('weather1', { url: '/weather-1', templateUrl: 'templates/weather/weather-1.html', controller: 'WeatherCtrl' }) // style 2 .state('weather2', { url: '/weather-2', templateUrl: 'templates/weather/weather-2.html', controller: 'WeatherCtrl' }) // style 3 .state('weather_3', { url: '/weather-3', templateUrl: 'templates/weather/weather-3.html', controller: 'WeatherCtrl' }); ```

Copy WeatherCtrl from www/js/controllers.js to your controllers.js

// controller for weather pages .controller('WeatherCtrl', function($scope, Cities) { ... });

Copy Cities server from www/js/services.js to your services.js

.factory('Cities', function() { ... });

Done

Libraries

  1. weather-icons font

Test before you buy

You can test the app using Ionic View (ID: 323c136d) (Please note that when testing on Ionic View some Cordova plugins will not work) Download it here http://view.ionic.io/

Support

If you need technical support or have any questions, please send me a message via: successdt@hotmail.com