Add a click listener to your Adapter using MVVM in Kotlin (part 2)

Adem Gunay
3 min readAug 6, 2019

--

source: unsplash
Click listener on cat image that starts a Detail Activity.

Welcome to the second part of this series. If you are discovering this series, you might take a look at the first story from the url below for more instruction about this project. This new feature will be an improvement based on the state of the previous implementation.

You can also download the initial code from the GitHub repository below and checkout on the initial state with the following command line inside the DemoMeow repository: git checkout 430211e

First thing first, let’s create the new DetailActivity who’s going to display the detail Image as below.

Notice the detailCatImage.loadImage(imageUrl). This is what is called Extension functions in Kotlin. Basically, it’s like improving a class by adding new custom functions. It’s much more simpler to call this custom function when we will need to load an image inside an ImageView. We can create it as below:

And here is DetailActivity’s layout (activity_detail):

It’s a very basic implementation but the main part lies inside the companion object’s getStartIntent() (used to make a startActivity call easier), which allows you create some class specific static function that you can call followed by the class name. We’ll be using the intent’s extra imageUrl the we got from MainActivity’s click event to start this Activity. More information on companion objects here.

Next step is to update our MainActivity (launchMode) and add the new DetailActivity in the manifest:

<application ///...<activity
android:name=".presentation.main.MainActivity"
android:launchMode="singleTop">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<!-- Adding Detail activity with Main as a parent to display back arrow in ActionBar --><activity
android:name=".presentation.detail.DetailActivity"
android:parentActivityName=".presentation.main.MainActivity" />
</application>
  • The launchMode update is to prevent Activity from restarting when we navigate back to it using ActionBar back arrow. It’s recreating itself due to its intent filter specificity being Main and Launch. You can learn more about launchMode here.

After that, we have to update our MainActivity’s onCreate() function with a clickListener variable to pass to the CatAdapter. Let’s create that variable and update our CatsAdapter as below.

The MainActivity onCreate() update:

The CatAdapter update:

Before assigning the click listener to the holder, whe need to make sure that our adapterPosition is on an exisiting item with the small RecyclerView.NO_POSITION check. We assign the click listener on the holder inside our onCreateViewHolder() method.

That’s It! You’ve now covered the basic implementation of a click listener to an Adapter in Kotlin. I Hope it helped you understand it better and if it’s the case, don’t forget to 👏 ;) Thanks!

You can thank me with a coffee too! 😋

--

--

Adem Gunay

Android/Flutter developer @OOZOU Huge passion for mobile development. Clean Code addict.