Live Templates in Android Studio: Getting Started

Creating Live Templates

If you took a look at MainView.kt, you know that there are a bunch of show/hide methods to implement. You might predict the body of these methods will change the visibility of a view, and in some cases set the text. That’s a lot of repetition of the same logic. You’d probably be daydreaming of better times while writing that code by hand. Thankfully, you can make Android Studio do it for you after a little configuration!

To think about how you might want to create your template, you first need to picture what you want the result to look like. Start by imagining what the implementations of showProgress() and hideProgress() might be:

override fun showProgress() {
  progress.visibility = View.VISIBLE
}

override fun hideProgress() {
  progress.visibility = View.GONE
}

You need two methods, one that sets the visibility to VISIBLE and one that sets it to GONE. Open back up the live templates window to learn how to make a template for this.

As you’ve seen, there are many sublists of templates. They only matter for organizational reasons, and you can create a group if you need to. It’s suggested you put your custom template under other for this tutorial. Select other from the list, then click the + symbol on the right to create a new live template.

To represent show/hide view, enter shview for the abbreviation. Then, enter Add methods to show or hide a view for the description. To start building your template, paste in your final goal in the Template text box:

override fun showProgress() {
  progress.visibility = View.VISIBLE
}

override fun hideProgress() {
  progress.visibility = View.GONE
}

This is a great starting point. This is all ready to go if you only want to ever show and hide the progress view, but you can use variables to make it more flexible.

Adding Variables

To allow customization, you need to use variables. These always take the format of $<name>$, and you can use any name you want other than the reserved $END$ and $SELECTION$.

To think about where you might want to use variables, consider what will be consistent and what might change. You want to be able to change the function name to match the view and the view ID. Modify your template to use $VIEW$ and $VIEWID$, respectively. It should now look like this:

override fun show$VIEW$() {
  $VIEWID$.visibility = View.VISIBLE
}

override fun hide$VIEW$() {
  $VIEWID$.visibility = View.GONE
}

Notice how you’re able to reuse the same variable in multiple places, both in the show function and again in the hide function. This makes it so after you fill it in for the first function, the IDE will automatically copy it to where ever the variable is duplicated.

Setting Applicable Contexts

One last thing before you can use your template. Right under the template text, there is an option to define applicable contexts. Click on Define and select Kotlin ‣ Class.

This tells the IDE where this template can be used, in this case inside a Kotlin class. Now, this template will only be available when you’re writing code inside of a class.

Click OK to save your live template. Then use your new abbreviation, shview to implement the showProgress() and hideProgress() functions in your MainActivity:

override fun showProgress() {
  progress.visibility = View.VISIBLE
}

override fun hideProgress() {
  progress.visibility = View.GONE
}

Notice that because you didn’t use an $END$ variable, your cursor was placed at the end of the inserted code.

Yay! You successfully created and used your very own live template. You can use this template in other places, but looking at the rest of the interface you’re going to need to do more work. That means you get to make another template.

Creating a Complex Template

Most of the other show methods have some text as a parameter that needs to be set on a view. It makes sense, then, to create a template specifically for TextViews.

Start by considering the implementations for showTitle(title: String) and hideTitle(). They might look like this:

override fun showTitle(title: String) {
  text_title.text = title
  text_title.visibility = View.VISIBLE
}

override fun hideTitle() {
  text_title.visibility = View.GONE
}

This is pretty similar to the template you made before, with the addition of setting the passed in text. Open the live template window and create another new template. Use shtext for the abbreviation and Show/hide text view with value for the description. Just as before, copy in your end goal for show/hide title from above so you can start modifying it.

Thinking about what variables you might want to use, you can guess that you’d want the same ones as your previous template. In addition, you need one for the String that’s passed in. Modify your template to look like this:

override fun show$VIEW$($VALUE$: String) {
  $VIEWID$.text = $VALUE$
  $VIEWID$.visibility = View.VISIBLE
}

override fun hide$VIEW$() {
  $VIEWID$.visibility = View.GONE
}

This has the same $VIEW$ and $VIEWID$ variables you saw before. The additional $VALUE$ variable is used for that String you want to assign to the TextView.

Select Kotlin ‣ Class as the context, and click OK to save. Now use your new shtext template to add the title methods to your MainActivity:

override fun showTitle(title: String) {
  text_title.text = title
  text_title.visibility = View.VISIBLE
}

override fun hideTitle() {
  text_title.visibility = View.GONE
}

Nice! You could complete the MainActivity with these templates, but there’s still room for improvement. Keep reading to learn how!

Reordering Variables

You may be able to relate with the experience of forgetting the exact name of a view and relying on autocomplete to help you. In this case, it would be helpful to fill in the view ID variable before the method name. Good thing there’s a way to do that!

Open up your shtext template to edit. Next to the template text pane you’ll see a button labeled Edit variables. Click it to open up a new Edit Template Variables window here.

There are many options here, but you’ll look at one of them to start: reordering. The table lists these variables in the order they will be filled in. You want the VIEWID variable first.

If it’s not already at the top of the list, select the VIEWID row. Then, use the arrows at the bottom of the list to move it to the top of the list. If you have a preference for the order of the other two variables, you can practice reordering with those as well.

Click OK to save the variable order, then OK again to save the template. Use your updated shtext template to add these tagline methods to your MainActivity:

override fun showTagline(tagline: String) {
  text_tagline.text = tagline
  text_tagline.visibility = View.VISIBLE
}

override fun hideTagline() {
  text_tagline.visibility = View.GONE
}

With this template, you’re able to fill in the view ID first to make sure you’re using the right name.

There’s still a lot of repetition in what you’re typing, so how about trying to clear that up more.