Weather app using API | Android | Java
In this tutorial, we are going to create a weather app using https://openweathermap.org/ API.
Before going to create the app using API, first see what an API is and how it works.
What is an API?
API stands for Application Programming Interface. A tool that allows for the automatic transfer of data from one program to one or more applications or programs.
Why use an API?
Create automatic transfers of your valuable GO Smart data into your favorite programs.
Working of API
Part 1: Create your API using https://openweathermap.org/
go to the https://openweathermap.org/ and signup using your Google account, then go to the API and create your API.
Part 2: Set the dependency
add JitPack repository to your build file
allprojects {
repositories {
…………….
maven { url ‘https://jitpack.io' }
}
}
add the dependency
dependencies {
……………….
implementation ‘com.github.androdocs:Simple-HTTP-Request:v1.0’
}
Part 3: define the XML file
here in the XML file, we define our layout for the weather app. Here we display Temperature, Last updated time, Forcast, City name, Country name, Humidity, Min Temperature, Maximum Temperature, Time of Sunrise, and Time of Sunset. Here we add searching functionality, which means we search the temperature by city names. Before design, the main XML file first designs other drawable files also copy and paste the other drawable files, now it’s time to design our main XML file
activity_main.xml
<?xml version=”1.0" encoding=”utf-8"?>
<androidx.core.widget.NestedScrollView
xmlns:android=”http://schemas.android.com/apk/res/android"
xmlns:tools=”http://schemas.android.com/tools"
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:background=”@drawable/weather_app_background”
tools:context=”.MainActivity”
android:padding=”10dp”>
<LinearLayout
android:orientation=”vertical”
android:layout_width=”match_parent”
android:layout_height=”match_parent”>
<RelativeLayout
android:id=”@+id/first”
android:layout_width=”match_parent”
android:layout_height=”40dp”
android:layout_marginStart=”20dp”
android:layout_marginTop=”30dp”
android:layout_marginEnd=”20dp”
android:padding=”2dp”
android:background=”@drawable/rounded_border”
android:gravity=”center_horizontal”>
<EditText
android:id=”@+id/Your_city”
android:layout_width=”wrap_content”
android:layout_height=”match_parent”
android:layout_alignParentStart=”true”
android:layout_marginStart=”10dp”
android:background=”@drawable/rounded_border”
android:ems=”10"
android:hint=”@string/enter_your_city_name”
android:inputType=”text”
android:textColor=”#ffffff”
android:textColorHint=”#939393"
android:textSize=”15sp”
android:layout_centerVertical=”true”/>
<ImageView
android:id=”@+id/search”
android:layout_width=”35dp”
android:layout_height=”35dp”
android:background=”?android:attr/selectableItemBackground”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:src=”@drawable/search_icon”/>
</RelativeLayout>
<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”20dp”
android:orientation=”vertical”>
<TextView
android:id=”@+id/forecast”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:textAllCaps=”true”
android:layout_gravity=”center_horizontal”
android:textColor=”@color/text2"
android:textSize=”16sp”
android:includeFontPadding=”false” />
<TextView
android:id=”@+id/temp”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”
android:textColor=”@color/text2"
android:textSize=”40sp”
android:includeFontPadding=”false”
android:layout_gravity=”center_horizontal”
android:textStyle=”bold” />
<TextView
android:id=”@+id/time”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:textColor=”@color/text2"
android:layout_marginTop=”40dp”
android:textSize=”13sp”
android:layout_gravity=”center_horizontal”
android:includeFontPadding=”false”/>
</LinearLayout>
<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”210dp”
android:orientation=”vertical”
android:gravity=”center_horizontal”>
<TextView
android:id=”@+id/city”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:textColor=”@color/text3"
android:textSize=”18sp”
android:includeFontPadding=”false”
android:textStyle=”bold” />
<TextView
android:id=”@+id/country”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:textColor=”@color/text1"
android:textSize=”16sp”
android:layout_marginTop=”8dp”
android:includeFontPadding=”false” />
</LinearLayout>
<View
android:layout_width=”150dp”
android:layout_height=”1dp”
android:background=”@color/colorPrimaryDark”
android:layout_marginTop=”15dp”
android:layout_gravity=”center_horizontal”/>
<LinearLayout
android:orientation=”vertical”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”5dp”>
<LinearLayout
android:orientation=”horizontal”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”>
<TextView
android:layout_width=”120dp”
android:layout_height=”wrap_content”
android:gravity=”start”
android:text=”Humidity”
android:textAllCaps=”false”
android:layout_gravity=”center_vertical”
android:textColor=”@color/text1"
android:textSize=”16sp”
android:layout_marginStart=”5dp”
android:textStyle=”bold” />
<ImageView
android:layout_width=”20dp”
android:layout_height=”20dp”
android:src=”@drawable/hum”
android:layout_gravity=”center_vertical”
android:layout_marginStart=”38dp” />
<TextView
android:id=”@+id/humidity”
android:layout_width=”80dp”
android:layout_height=”wrap_content”
android:layout_gravity=”end”
android:gravity=”center”
android:padding=”5dp”
android:text=” — “
android:layout_marginStart=”80dp”
android:textColor=”@color/text1"
android:textSize=”16sp” />
</LinearLayout>
<LinearLayout
android:orientation=”horizontal”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”>
<TextView
android:layout_width=”120dp”
android:layout_height=”wrap_content”
android:gravity=”start”
android:text=”Min Temperature”
android:textColor=”@color/text1"
android:textSize=”15sp”
android:layout_marginStart=”5dp”
android:layout_gravity=”center_vertical”
android:textStyle=”bold” />
<ImageView
android:layout_width=”20dp”
android:layout_height=”20dp”
android:src=”@drawable/tem_down”
android:layout_gravity=”center_vertical”
android:layout_marginStart=”38dp” />
<TextView
android:id=”@+id/min_temp”
android:layout_width=”80dp”
android:layout_height=”wrap_content”
android:layout_gravity=”center_vertical”
android:gravity=”center”
android:padding=”5dp”
android:text=” — “
android:layout_marginStart=”80dp”
android:textColor=”@color/text1"
android:textSize=”16sp” />
</LinearLayout>
<LinearLayout
android:orientation=”horizontal”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:gravity=”start”
android:text=”Max Temperature”
android:textColor=”@color/text1"
android:textSize=”15sp”
android:layout_gravity=”center_vertical”
android:layout_marginStart=”5dp”
android:textStyle=”bold” />
<ImageView
android:layout_width=”20dp”
android:layout_height=”20dp”
android:src=”@drawable/tem_up”
android:layout_gravity=”center_vertical”
android:layout_marginStart=”38dp” />
<TextView
android:id=”@+id/max_temp”
android:layout_width=”80dp”
android:layout_height=”wrap_content”
android:layout_gravity=”center_vertical”
android:gravity=”center”
android:padding=”5dp”
android:text=” — “
android:layout_marginStart=”80dp”
android:textColor=”@color/text1"
android:textSize=”16sp”/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginLeft=”20dp”
android:layout_marginTop=”15dp”
android:layout_marginRight=”20dp”
android:orientation=”horizontal”
android:layout_gravity=”center_vertical”
android:weightSum=”2">
<LinearLayout
android:layout_width=”0dp”
android:layout_height=”wrap_content”
android:layout_margin=”5dp”
android:layout_weight=”1"
android:gravity=”center”
android:orientation=”vertical”>
<ImageView
android:layout_width=”40dp”
android:layout_height=”wrap_content”
android:src=”@drawable/sunrise”/>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”Sunrise”
android:includeFontPadding=”false”
android:textColor=”@color/text3"/>
<TextView
android:id=”@+id/sunrises”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginTop=”5dp”
android:text=” — “
android:includeFontPadding=”false”
android:gravity=”center”
android:padding=”5dp”
android:textColor=”@color/text1"
android:textSize=”14sp” />
</LinearLayout>
<LinearLayout
android:layout_width=”0dp”
android:layout_height=”wrap_content”
android:layout_margin=”5dp”
android:layout_weight=”1"
android:gravity=”center”
android:orientation=”vertical”>
<ImageView
android:layout_width=”40dp”
android:layout_height=”wrap_content”
android:src=”@drawable/sunset”/>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”Sunset”
android:includeFontPadding=”false”
android:textColor=”@color/text3"/>
<TextView
android:id=”@+id/sunsets”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginTop=”5dp”
android:text=” — “
android:gravity=”center”
android:padding=”5dp”
android:textColor=”@color/text1"
android:textSize=”14sp” />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
the output of the above code:
Part 4: Define our main Java file
first, call the elements in the onCreate() method, also store your API key in a String.
public class MainActivity extends AppCompatActivity {
String CITY;
String API = “Your API Key”;
ImageView search;
EditText etCity;
TextView city,country,time,temp,forecast,humidity,min_temp,max_temp,sunrises,sunsets;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
{
etCity = (EditText) findViewById(R.id.Your_city);
search = (ImageView) findViewById(R.id.search);
// CALL ALL ANSWERS :
city = (TextView) findViewById(R.id.city);
country = (TextView) findViewById(R.id.country);
time = (TextView) findViewById(R.id.time);
temp = (TextView) findViewById(R.id.temp);
forecast = (TextView) findViewById(R.id.forecast);
humidity = (TextView) findViewById(R.id.humidity);
min_temp = (TextView) findViewById(R.id.min_temp);
max_temp = (TextView) findViewById(R.id.max_temp);
sunrises = (TextView) findViewById(R.id.sunrises);
sunsets = (TextView) findViewById(R.id.sunsets);
}
}
now, get return result from URL in your AsyncTask doInBackground()
class weatherTask extends AsyncTask<String, Void, String>{
@Override
protected void onPreExecute() {
super.onPreExecute();
}
@Override
protected String doInBackground(String… args) {
String response = HttpRequest.excuteGet(“https://api.openweathermap.org/data/2.5/weather?q=" + CITY + “&units=metric&appid=” + API);
return response;
}
@Override
protected void onPostExecute(String result) {
try {
JSONObject jsonObj = new JSONObject(result);
JSONObject main = jsonObj.getJSONObject(“main”);
JSONObject weather = jsonObj.getJSONArray(“weather”).getJSONObject(0);
JSONObject sys = jsonObj.getJSONObject(“sys”);
// CALL VALUE IN API :
String city_name = jsonObj.getString(“name”);
String countryname = sys.getString(“country”);
Long updatedAt = jsonObj.getLong(“dt”);
String updatedAtText = “Last Updated at: “ + new SimpleDateFormat(“dd/MM/yyyy hh:mm a”, Locale.ENGLISH).format(new Date(updatedAt * 1000));
String temperature = main.getString(“temp”);
String cast = weather.getString(“description”);
String humi_dity = main.getString(“humidity”);
String temp_min = main.getString(“temp_min”);
String temp_max = main.getString(“temp_max”);
Long rise = sys.getLong(“sunrise”);
String sunrise = new SimpleDateFormat(“hh:mm a”, Locale.ENGLISH).format(new Date(rise * 1000));
Long set = sys.getLong(“sunset”);
String sunset = new SimpleDateFormat(“hh:mm a”, Locale.ENGLISH).format(new Date(set * 1000));
// SET ALL VALUES IN TEXTBOX :
city.setText(city_name);
country.setText(countryname);
time.setText(updatedAtText);
temp.setText(temperature + “°C”);
forecast.setText(cast);
humidity.setText(humi_dity);
min_temp.setText(temp_min);
max_temp.setText(temp_max);
sunrises.setText(sunrise);
sunsets.setText(sunset);
} catch (Exception e) {
Toast.makeText(MainActivity.this, “Error:” + e.toString(), Toast.LENGTH_SHORT).show();
}
}
}
MainActivity.java
package com.example.weatherinfo;
import androidx.appcompat.app.AppCompatActivity;
import android.os.AsyncTask;
import android.os.Bundle;
import android.view.View;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
import com.androdocs.httprequest.HttpRequest;
import org.json.JSONObject;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.Locale;
public class MainActivity extends AppCompatActivity {
String CITY;
String API = “Your Api Key here”;
ImageView search;
EditText etCity;
TextView city,country,time,temp,forecast,humidity,min_temp,max_temp,sunrises,sunsets;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
{
etCity = (EditText) findViewById(R.id.Your_city);
search = (ImageView) findViewById(R.id.search);
// CALL ALL ANSWERS :
city = (TextView) findViewById(R.id.city);
country = (TextView) findViewById(R.id.country);
time = (TextView) findViewById(R.id.time);
temp = (TextView) findViewById(R.id.temp);
forecast = (TextView) findViewById(R.id.forecast);
humidity = (TextView) findViewById(R.id.humidity);
min_temp = (TextView) findViewById(R.id.min_temp);
max_temp = (TextView) findViewById(R.id.max_temp);
sunrises = (TextView) findViewById(R.id.sunrises);
sunsets = (TextView) findViewById(R.id.sunsets);
// CLICK ON SEARCH BUTTON :
search.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
CITY = etCity.getText().toString();
new weatherTask().execute();
}
});
}
}
class weatherTask extends AsyncTask<String, Void, String>{
@Override
protected void onPreExecute() {
super.onPreExecute();
}
@Override
protected String doInBackground(String… args) {
String response = HttpRequest.excuteGet(“https://api.openweathermap.org/data/2.5/weather?q=" + CITY + “&units=metric&appid=” + API);
return response;
}
@Override
protected void onPostExecute(String result) {
try {
JSONObject jsonObj = new JSONObject(result);
JSONObject main = jsonObj.getJSONObject(“main”);
JSONObject weather = jsonObj.getJSONArray(“weather”).getJSONObject(0);
JSONObject sys = jsonObj.getJSONObject(“sys”);
// CALL VALUE IN API :
String city_name = jsonObj.getString(“name”);
String countryname = sys.getString(“country”);
Long updatedAt = jsonObj.getLong(“dt”);
String updatedAtText = “Last Updated at: “ + new SimpleDateFormat(“dd/MM/yyyy hh:mm a”, Locale.ENGLISH).format(new Date(updatedAt * 1000));
String temperature = main.getString(“temp”);
String cast = weather.getString(“description”);
String humi_dity = main.getString(“humidity”);
String temp_min = main.getString(“temp_min”);
String temp_max = main.getString(“temp_max”);
Long rise = sys.getLong(“sunrise”);
String sunrise = new SimpleDateFormat(“hh:mm a”, Locale.ENGLISH).format(new Date(rise * 1000));
Long set = sys.getLong(“sunset”);
String sunset = new SimpleDateFormat(“hh:mm a”, Locale.ENGLISH).format(new Date(set * 1000));
// SET ALL VALUES IN TEXTBOX :
city.setText(city_name);
country.setText(countryname);
time.setText(updatedAtText);
temp.setText(temperature + “°C”);
forecast.setText(cast);
humidity.setText(humi_dity);
min_temp.setText(temp_min);
max_temp.setText(temp_max);
sunrises.setText(sunrise);
sunsets.setText(sunset);
} catch (Exception e) {
Toast.makeText(MainActivity.this, “Error:” + e.toString(), Toast.LENGTH_SHORT).show();
}
}
}
}
Output
enter your city name in the EditText field and click the search button.
