UI Performance: Custom View

Mkhytar Mkhoian
Lalafo
Published in
3 min readJul 25, 2019

--

picture belongs to hipsthetic.com

In the previous post, we learn how to improve text rendering used a custom view. In this blog post, I’ll tell why and how to write a custom view.

Why a custom view group is better than anyone layout from the Android SDK?

Let’s step back and look at layouts from Android SDK.

  • FrameLayout — child views are drawn in a stack, with the most recently added child on top.
  • LinearLayout — a layout that arranges other views either horizontally in a single column or vertically in a single row.
  • RelativeLayout — a layout where the positions of the children can be described in relation to each other or to the parent.
  • ConstraintLayout — a layout which allows you to position and size widgets in a flexible way.

They all designed to arranges views in a specific way and to be a universal component. What I want to say is for this universality we paid the price and this is performance. When you want to build a UI interface, you combine these layouts and views to achieve it. As a result, we have a complex layout with a deep hierarchy and many views. With ConstraintLayout we can build a layout with a flat hierarchy, but we steel pay price for the ability to arranges views in a complex way with different relations when doing measure and layout of views.

One thing to note View is a pretty heavy object with deep integration in the UI framework. It's a matter for performance, how many views do you have in layout.

So, what we need, is a good performance, flat hierarchy, minimize memory allocation and flexibility. Custom ViewGroup allows you to measure and layout views in specific for your use case in an efficient way. That’s why you don’t need to combine layouts form Android SDK. You can build a flat hierarchy, minimize the count of views and allocation. But sometimes writing custom view it’s not easy and turns into a mess.

ViewCell

The general idea is to use View interface but not extend View class. This interface allows wrapping different UI components such as text, image, drawable and its combinations. ViewCell easy integrate with View and ViewGroup because of the same interface. You can reuse cells and combine with each other.

For example, use text rendering from the previous post and wrapping up into TextViewCell.

As you can see, the logic for the measure, layout, and the draw are separated. Let’s use it in the custom view.

Now it’s not looking like a mess, it looks like ViewGroup with two child View. As a result, we reach our goals and build a layout with good performance of onMeasureand onLayout, flat hierarchy, minimized the count of views and memory allocation.

Wrapping up

I hope this article helped you understand why the custom view is a better choice than one of the standard Android SDK, especially if we talking about sensitive for performance UI component like RecyclerView. Hopefully, you should now be able to build a custom view match easier with ViewCell abstraction. Thank you for reading!

--

--