Android Studio Chronometer Rotation - Works in portrait but not in landscape... using view models & Kotlin

Question

The chronometer is working in portrait. The issue is when it is rotated to landscape it doesn't continue from where it was in portrait... but the interesting thing is when it goes back to portrait (portrait -> landscape -> portrait) the chronometer picks up from where it was last.

Please help find the bug in the code... Thanks!

Here is the fragment code (NotesFragment.kt):

package com.genauapps.cis2818_proj4_runningapp

import android.os.Bundle
import android.os.SystemClock
import android.util.Log
import androidx.fragment.app.Fragment
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.Chronometer
import androidx.lifecycle.ViewModelProvider
import com.genauapps.cis2818_proj4_runningapp.databinding.FragmentNotesBinding
import kotlin.math.absoluteValue

class NotesFragment : Fragment() {
    private lateinit var binding: FragmentNotesBinding
    private lateinit var viewModel: NotesViewModel

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        binding = FragmentNotesBinding.inflate(layoutInflater)
        viewModel = ViewModelProvider(this).get(NotesViewModel::class.java)

        binding.notesFragmentBtStartStop.setOnClickListener { onStartStop(viewModel.time.value!!) }

        if (viewModel.isWorking.value == true) {
            binding.notesFragmentChTime.base = viewModel.time.value!!
            binding.notesFragmentChTime.start()
        }

        // Inflate the layout for this fragment
        return binding.root
    }

    private fun onStartStop(startTime: Long) {
        if (!viewModel.isWorking.value!!) {
            if (startTime == 0L) {
                binding.notesFragmentChTime.base = SystemClock.elapsedRealtime()
            } else {
                binding.notesFragmentChTime.base = startTime
            }
            binding.notesFragmentChTime.start()
            viewModel.isWorking.value = true
        } else {
            binding.notesFragmentChTime.stop()
            viewModel.isWorking.value = false
            viewModel.time.value = SystemClock.elapsedRealtime() - binding.notesFragmentChTime.base
            Log.i("test", "Stopwatch time is ${viewModel.time.value}")
        }
    }

    override fun onDestroy() {
        super.onDestroy()
        viewModel.time.value = SystemClock.elapsedRealtime() - binding.notesFragmentChTime.base

    }

//    override fun onDestroyView() {
//        super.onDestroyView()
//        viewModel.time.value = SystemClock.elapsedRealtime() - binding.notesFragmentChTime.base
//    }
}

Here is the view model code (NotesViewModel.kt):

package com.genauapps.cis2818_proj4_runningapp

import androidx.lifecycle.LiveData
import androidx.lifecycle.MutableLiveData
import androidx.lifecycle.ViewModel

class NotesViewModel : ViewModel() {
    private val _time = MutableLiveData()
    val time: MutableLiveData get() = _time

    private val _date = MutableLiveData()
    val date: LiveData get() = _date

    private val _distance = MutableLiveData()
    val distance: LiveData get() = _distance

    private val _notes = MutableLiveData()
    val notes: LiveData get() = _notes

    private val _isWorking = MutableLiveData()
    val isWorking: MutableLiveData get() = _isWorking


    init {
        _time.value = 0L
        _isWorking.value = false
    }

    fun timer(time: Long) {

    }
}

Here is the xml (fragment_notes.xml):

user_14467794 · Answer

First of all, in the AndroidManifest file inside your "Activity tag" write:

android:configChanges="orientation|screenSize"

And now in NotesFragment.kt:

package com.genauapps.cis2818_proj4_runningapp

import android.os.Bundle
import android.os.SystemClock
import androidx.fragment.app.Fragment
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.lifecycle.ViewModelProvider
import com.genauapps.cis2818_proj4_runningapp.databinding.FragmentNotesBinding

class NotesFragment : Fragment() {
      private lateinit var binding: FragmentNotesBinding
      private lateinit var viewModel: NotesViewModel


override fun onCreateView(
    inflater: LayoutInflater, container: ViewGroup?,
    savedInstanceState: Bundle?

): View? {
    binding = FragmentNotesBinding.inflate(layoutInflater)
    viewModel = ViewModelProvider(this).get(NotesViewModel::class.java)

    binding.notesFragmentBtStartStop.setOnClickListener { 
    onStartStop(viewModel.time.value!!) }

    // Inflate the layout for this fragment
    return binding.root

}

private fun onStartStop(startTime: Long) {
    if (viewModel.isWorking.value == false) {

        if (startTime == 0L) {
            binding.notesFragmentChTime.base = SystemClock.elapsedRealtime() - 
startTime/ SystemClock.elapsedRealtime()
            binding.notesFragmentChTime.start()
            viewModel.isWorking.value = true
        } else {
            binding.notesFragmentChTime.base = SystemClock.elapsedRealtime() - 
viewModel.time.value!!
            binding.notesFragmentChTime.start()
            viewModel.isWorking.value = true

        }

    } else {
        binding.notesFragmentChTime.stop()
        viewModel.isWorking.value = false
        viewModel.time.value = SystemClock.elapsedRealtime() - 
binding.notesFragmentChTime.base
    }
}

// Saving Fragment State When Orientation Changes
private fun Fragment.onRestoreInstanceState(savedInstanceState: Bundle?) {
    onRestoreInstanceState(savedInstanceState)
    onCreate(savedInstanceState)
   }
}

Remember, every time you change orientation, In fact, you are calling "Destroy()", and recreating the View, so you have to "save Fragment state" before switching between Portrait and Landscape orientation.

Android Studio Chronometer Rotation - Works in portrait but not in landscape... using view models & Kotlin

1 Answers