Android View is not updating over data binding

Question

I've created a simple application that load a random joke from the API and shows it in the TextView. For learning reasons I've implemented the app with data binding. At first I created a ViewModel, that fetch data from the API

class RandomJokeViewModel: ViewModel() {

private val jokeService = RetrofitService()

fun getRandomJoke(): MutableLiveData<RandomJoke> ? {
    Log.e("getRandomJokeData", "yes")
    return jokeService.loadRandomJoke()
}

In my Fragment I call the method to load the jokes and update the view

class RandomJokeFragment : Fragment() {

private lateinit var binding: FragmentRandomJokeBinding

override fun onCreateView(
    inflater: LayoutInflater, container: ViewGroup?,
    savedInstanceState: Bundle?
): View? {
    binding = DataBindingUtil.inflate(layoutInflater, R.layout.fragment_random_joke, container, false)
    binding.lifecycleOwner = this
    // Inflate the layout for this fragment
    return inflater.inflate(R.layout.fragment_random_joke, container, false)
}

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)
    loadRandomJoke()
}

private fun loadRandomJoke() {
    Log.e("getAndroidVersion", "yes")
    val randomJokeViewModel =
        ViewModelProviders.of(requireActivity()).get(RandomJokeViewModel::class.java)
    randomJokeViewModel.getRandomJoke()?.observe(this, Observer<RandomJoke> { randomJoke ->
        binding.randomJoke = randomJoke
        Log.e("RandomJokeFragment", "This is your Joke: ${randomJoke.value}")
    })
}

My data calls looks like this:

data class RandomJoke (
@SerializedName("categories") val categories: ArrayList<String>,
@SerializedName("created_at") val createdAt: String,
@SerializedName("icon_url") val iconUrl: String,
@SerializedName("id") val id: String,
@SerializedName("updated_at:") val updatedAt: String,
@SerializedName("url") val url: String,
@SerializedName("value") val value: String)

In my Fragment Layout I defined the data binding ressources like this

<data>
    <variable
        name="randomJoke" type="com.example.jokegenerator.data.remote.response.RandomJoke"
        />
</data>

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimaryDark"
    >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="1dp"
        android:layout_marginStart="1dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:text="@{randomJoke.value}"
        android:textColor="#ffff"
        tools:text="Hello World"/>

</androidx.constraintlayout.widget.ConstraintLayout>

So when I run the app my TextView is empty. In Logcat and Debugger I verified, that the randomJoke response has data. Why is my view not updating after I get the data? What did I miss?

Answer 1

Not completely sure that this is the reason but:

override fun onCreateView(
    inflater: LayoutInflater, container: ViewGroup?,
    savedInstanceState: Bundle?
): View? {
    binding = DataBindingUtil.inflate(layoutInflater, R.layout.fragment_random_joke, container, false)
    binding.lifecycleOwner = this
    // Inflate the layout for this fragment
    return inflater.inflate(R.layout.fragment_random_joke, container, false)
}

here you inflate your layout 2 times.

instead try like this:

override fun onCreateView(
    inflater: LayoutInflater, container: ViewGroup?,
    savedInstanceState: Bundle?
): View? {
    // This will inflate your layout. You just have to return the root view.
    binding = DataBindingUtil.inflate(layoutInflater, R.layout.fragment_random_joke, container, false)
    binding.lifecycleOwner = this
    return binding.root // Returning your root view
}

The databinding is probably mixing of the 2 layouts.