In the world of Android development, creating practical applications is the best way to hone your skills. Today, we’ll walk you through building a weather app using Kotlin, a modern, concise, and safe programming language. By the end of this tutorial, you’ll have a functional weather app that fetches real-time weather data from an API and displays it in a user-friendly interface.

Setting Up the Environment

Before we dive into coding, let's set up our development environment.

  1. Install Android Studio: Download and install the latest version of Android Studio from the official website.
  2. Create a New Project:
    • Open Android Studio.
    • Select "Start a new Android Studio project."
    • Choose "Empty Activity" and click "Next."
    • Name your project (e.g., WeatherApp) and set the language to Kotlin.
    • Click "Finish" to create the project.
  3. Set Up an Emulator: You can use an Android emulator or a physical device for testing. To set up an emulator, go to AVD Manager in Android Studio and create a virtual device.

Designing the UI

Next, we’ll design the user interface using XML.

  1. Open activity_main.xml:
    • In the res/layout folder, open activity_main.xml.
  2. Add UI Components:
    xml

    Copy code

  3. Fetching Weather Data

To fetch weather data, we’ll use the OpenWeatherMap API and Retrofit for network requests.

  1. Add Dependencies: Open build.gradle (Module: app) and add the following dependencies:

    
     
    groovy

    Copy code

    implementation 'com.squareup.retrofit2:retrofit:2.9.0' implementation 'com.squareup.retrofit2:converter-gson:2.9.0'

    Sync your project to download the dependencies.

  2. Create API Interface:

    
     
    kotlin

    Copy code

    interface WeatherApiService { @GET("weather") fun getWeather(@Query("q") cityName: String, @Query("appid") apiKey: String): Call }

  3. Data Classes for JSON Response:

    
     
    kotlin

    Copy code

    data class WeatherResponse( val main: Main ) data class Main( val temp: Float )

  4. Make Network Request:

    
     
    kotlin

    Copy code

    val retrofit = Retrofit.Builder() .baseUrl("https://api.openweathermap.org/data/2.5/") .addConverterFactory(GsonConverterFactory.create()) .build() val service = retrofit.create(WeatherApiService::class.java)

Displaying Data

  1. Fetch and Display Weather Data:
    
     
    kotlin

    Copy code

    class MainActivity : AppCompatActivity() { private lateinit var tvCityName: TextView private lateinit var tvTemperature: TextView private lateinit var btnFetchWeather: Button override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) tvCityName = findViewById(R.id.tvCityName) tvTemperature = findViewById(R.id.tvTemperature) btnFetchWeather = findViewById(R.id.btnFetchWeather) btnFetchWeather.setOnClickListener { fetchWeatherData("London") } } private fun fetchWeatherData(cityName: String) { val apiKey = "YOUR_API_KEY" val call = service.getWeather(cityName, apiKey) call.enqueue(object : Callback { override fun onResponse(call: Call, response: Response) { if (response.isSuccessful) { val weatherResponse = response.body() tvTemperature.text = "${weatherResponse?.main?.temp} °C" } } override fun onFailure(call: Call, t: Throwable) { // Handle error } }) } }

Conclusion

Congratulations! You’ve built a functional weather app using Kotlin. This project not only demonstrates how to work with APIs and display data in Android but also helps you understand the basics of Retrofit and JSON parsing. We encourage you to expand on this project by adding features like a search function for different cities or a detailed weather forecast.