kotlin write a simple weather forecast app (4) increase the interface display

Write an interface to display the returned data

User-friendliness: Through interface design and user experience optimization, weather information can be made easier to read, understand and operate. Effective interface design can increase user satisfaction and provide a better interactive experience.

Add the TextView of the city name

    <TextView
        android:id="@+id/textViewCityName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:width="200dp"
        android:height="50dp"
        app:layout_constraintTop_toBottomOf="@+id/buttonSearch"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:textSize="20sp"
        android:gravity="center"/>

• android:id="@+id/textViewCityName": Set a unique identifier for TextView, so that it can be referenced in the code.
• android:layout_width="wrap_content" and android:layout_height="wrap_content": Set the width and height of the TextView to be automatically adjusted according to the text content respectively.
• android:width="200dp" and android:height="50dp": Specify the width and height of the TextView as 200dp and 50dp.
• app:layout_constraintTop_toBottomOf="@+id/buttonSearch": Aligns the top of the TextView to the bottom of the view with id buttonSearch.
• app:layout_constraintStart_toStartOf="parent" And app:layout_constraintEnd_toEndOf="parent": Aligns the left side of the TextView to the left side of the parent container and the right side of the TextView to the right side of the parent container.
• android:textSize="20sp": Set the text font size of TextView to 20sp.
• android:gravity="center": Center the text content horizontally and vertically in the TextView.

Increase the temperature display part

    <TextView
        android:id="@+id/textViewTemperature"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toBottomOf="@+id/textViewCityName"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:textSize="30sp"
        android:gravity="center"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="@+id/textViewTemperature"
        app:layout_constraintStart_toEndOf="@id/textViewTemperature"
        android:text="@string/degree"
        android:textSize="20sp"
        android:gravity="center" />

    <TextView
        android:id="@+id/textViewMaxMinTemperature"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toBottomOf="@id/textViewTemperature"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:textSize="12sp"
        android:gravity="center" />

Add weather content

    <TextView
        android:id="@+id/textViewWeather"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toBottomOf="@id/textViewMaxMinTemperature"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:textSize="20sp"
        android:gravity="center" />

Write logic to populate data

    @SuppressLint("SetTextI18n")
    @Subscribe(threadMode = ThreadMode.MAIN)
    fun onEvent(event: WeatherResponseEvent) {
    
    
        val weatherResponse = event.weatherResponse
        val kelvins = 273.15
        val cityName = weatherResponse.name
        val temperature = weatherResponse.main?.temp?.minus(kelvins)
        val maxTemperature = weatherResponse.main?.temp_max?.minus(kelvins)
        val minTemperature = weatherResponse.main?.temp_min?.minus(kelvins)

        findViewById<TextView>(R.id.textViewCityName).text = cityName
        findViewById<TextView>(R.id.textViewTemperature).text = temperature?.toInt().toString()
        findViewById<TextView>(R.id.textViewMaxMinTemperature).text = "${
      
      maxTemperature?.toInt()} / ${
      
      minTemperature?.toInt()}"
        findViewById<TextView>(R.id.textViewWeather).text = "${
      
      weatherResponse.weather.first().main} | ${
      
      weatherResponse.weather.first().description}"

    }

The final effect: