{"id":15179,"date":"2021-09-13T11:24:12","date_gmt":"2021-09-13T11:24:12","guid":{"rendered":"https:\/\/flobiz.in\/blog\/?p=15179"},"modified":"2021-09-19T10:56:10","modified_gmt":"2021-09-19T10:56:10","slug":"fragment-view-binding-initialisation-using-delegates","status":"publish","type":"post","link":"http:\/\/35.200.248.73\/blog\/fragment-view-binding-initialisation-using-delegates\/","title":{"rendered":"Fragment View Binding initialisation using Delegates"},"content":{"rendered":"\n

View Binding in Android, allows us to seamlessly interact with the user interface by providing auto-generated classes for each<\/em> XML layout (on a module by module basis).<\/p>\n\n\n\n

Therefore, a routine task of setting text in a TextView can be transformed from this:<\/p>\n\n\n\n

val textView = findViewById<TextView>(R.id.text_view)
textView.text = \"Foo\"<\/pre>\n\n\n\n
To this:<\/p>\n\n\n\n
binding.textView.text = \"Foo\"<\/pre>\n\n\n\n
Of course, view binding requires some additional boilerplate code before we can use it. In the example above, we need to first initialise the binding<\/code>.<\/p>\n\n\n\n
\/\/ Step 1: Declare the binding<\/em>
private lateinit var binding: FragmentBuyBinding<\/strong>override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)    \/\/ Step 2: Initialise it
    binding = FragmentBuyBinding.inflate(layoutInflater<\/em>)<\/strong>
    
    \/\/ Step 3: Access it
    binding.textView.text <\/em>= \"Foo\"<\/strong>
}<\/pre>\n\n\n\n
Doing this for each fragment in our project is cumbersome. So, can we do better? Is there a cleaner, more efficient way that decreases our boilerplate code? Yes! By leveraging the power of Delegates<\/strong>.<\/p>\n\n\n\n
The article assumes you have already set up view binding in your project. If not, refer to this link<\/a> <\/strong>to learn how to set it up.<\/p>\n\n\n\n
What are Delegates?<\/h2>\n\n\n\n
Delegation is defined as the shifting of responsibility for some particular work from one person to another. Simply put, you can think of delegation as a process in which one object delegates (assigns\/gives) a particular task to a helper object, called the delegate<\/strong>. It then becomes the responsibility of the delegate to execute the task and provide the result to our initial object. Kotlin inherently provides support for both class and property delegates. Since our binding<\/code> object is a Fragment property, we\u2019ll be working with property delegates.<\/p>\n\n\n\n
Property Delegation<\/h3>\n\n\n\n
With property delegation, our delegate is responsible for handling the get<\/code> and set<\/code> for the specified property. We can thus abstract our common logic behind the delegate and re-use it for similar objects which in our case is the set of classes, auto-generated by view binding.<\/p>\n\n\n\n
A thorough, more descriptive explanation of delegates can be found here<\/a>.<\/p>\n\n\n\n
A Custom Property Delegate for Fragment View Binding<\/h3>\n\n\n\n
Without further ado, let\u2019s start writing our view binding delegate.<\/p>\n\n\n\n
Step 1: Create the delegate class
<\/strong>Create a new class FragmentViewBindingDelegate.kt<\/code> and implement the ReadOnlyProperty<Fragment, T><\/code> interface. In case your property is mutable, you can use the ReadWriteProperty<Fragment, T><\/code> interface but since our binding<\/code> is immutable, we only extend the read only interface. In addition, we require the binding class in our delegate constructor.<\/p>\n\n\n\n
class FragmentViewBindingDelegate<T : ViewBinding>(
    private val bindingClass: Class<T>
) : ReadOnlyProperty<Fragment, T> { }<\/pre>\n\n\n\n
Step 2: Implement the <\/strong>ReadOnlyProperty<\/strong><\/code> interface
<\/strong>As soon as we implement the ReadOnlyProperty<\/code> interface, we are asked to implement the getValue<\/code> member function.<\/p>\n\n\n\n
class FragmentViewBindingDelegate<T : ViewBinding>(
    private val bindingClass: Class<T>
) : ReadOnlyProperty<Fragment, T> {

    override fun getValue(thisRef: Fragment, property: KProperty<*>): T {
        \/\/ TODO
    }

}<\/pre>\n\n\n\n
The first param of getValue()<\/code> is thisRef<\/code> which represents the object that holds our property. It is of type Fragment<\/code> in our case. The type for thisRef<\/code> is governed by how we implement our interface. This is why we implemented ReadOnlyProperty<Fragment, T><\/code> instead of ReadOnlyProperty<Any?, T><\/code>.<\/p>\n\n\n\n
Step 3: Implement <\/strong>getValue<\/strong><\/code>
<\/strong>getValue()<\/code> needs to return an instance of our binding<\/code> object. So we create a variable called binding<\/code>. In getValue()<\/code> we initialise binding<\/code> if it\u2019s not initialised and return it. This ensures we only initialise binding once and subsequently re-use the same instance.<\/p>\n\n\n\n
private var binding: T? = null
override fun getValue(thisRef: Fragment, property: KProperty<*>): T {
    if (binding == null)
        binding = bindingClass.getMethod(\"bind\", View::class.java<\/em>).invoke(null, thisRef.requireView()) as T
    return binding!!
}<\/pre>\n\n\n\n
At this point, we have handled most of our boilerplate code and can initialise our binding<\/code> as:<\/p>\n\n\n\n
val binding by FragmentViewBindingDelegate(FragmentBuyBinding::class.java<\/em>)<\/pre>\n\n\n\n
However, there are a few problems
1. The syntax to initialise binding<\/code> can be improved
2. Our delegate is not lifecycle aware and thus, it will leak memory<\/p>\n\n\n\n
Let\u2019s resolve them. Read on.<\/p>\n\n\n\n
Step 4: Clean our <\/strong>binding<\/strong><\/code> init syntax
<\/strong>Our delegate requires the class of our generic Class<T><\/code> to return the correct view binding instance. Another way to get this information is by using the reified<\/code> <\/strong>keyword in Kotlin. You can learn more about reified here<\/a>.<\/p>\n\n\n\n
Add this inline function outside your delegate class:<\/p>\n\n\n\n
inline fun <reified T : ViewBinding> Fragment.viewBinding() = FragmentViewBindingDelegate(T::class.java<\/em>)<\/pre>\n\n\n\n
Et voil\u00e0! You can now initialise your binding with a clean, concise syntax.<\/p>\n\n\n\n
private val binding by viewBinding<FragmentBuyBinding>()<\/pre>\n\n\n\n
Step 5: Make <\/strong>FragmentViewBindingDelegate<\/strong><\/code> lifecycle aware
<\/strong>To make our delegate lifecycle aware we need to pass an instance of our host fragment to it.<\/p>\n\n\n\n
class FragmentViewBindingDelegate<T : ViewBinding>(
    private val bindingClass: Class<T>,
    private val fragment: Fragment
) : ReadOnlyProperty<Fragment, T> {<\/pre>\n\n\n\n
And, update our inline function.<\/p>\n\n\n\n
inline fun <reified T : ViewBinding> Fragment.viewBinding() = FragmentViewBindingDelegate(T::class.java<\/em>, this)<\/pre>\n\n\n\n
Finally, subscribe to the fragment\u2019s lifecycle and set the binding<\/code> to null<\/code> once the fragment is destroyed ensuring our delegate does not leak any memory.<\/p>\n\n\n\n
init {
    fragment.lifecycle<\/em>.addObserver(object : DefaultLifecycleObserver {
        override fun onCreate(owner: LifecycleOwner) {
            fragment.viewLifecycleOwnerLiveData<\/em>.observe<\/em>(fragment) { _<\/strong>viewLifecycleOwner ->
                _<\/strong>viewLifecycleOwner.lifecycle<\/em>.addObserver(object : DefaultLifecycleObserver {
                    override fun onDestroy(owner: LifecycleOwner) {
                        binding = null
                    }
                })
            }
        <\/strong>}
    })
}<\/pre>\n\n\n\n
And we\u2019re done!<\/p>\n\n\n\n
Final Code<\/h2>\n\n\n\n
inline fun <reified T : ViewBinding> Fragment.viewBinding() = FragmentViewBindingDelegate(T::class.java<\/em>, this)
class FragmentViewBindingDelegate<T : ViewBinding>(
    private val bindingClass: Class<T>,
    private val fragment: Fragment
) : ReadOnlyProperty<Fragment, T> {

    private var binding: T? = null

    init {
        fragment.lifecycle<\/em>.addObserver(object : DefaultLifecycleObserver {
            override fun onCreate(owner: LifecycleOwner) {
                fragment.viewLifecycleOwnerLiveData<\/em>.observe<\/em>(fragment) { <\/strong>viewLifecycleOwner ->
                    <\/strong>viewLifecycleOwner.lifecycle<\/em>.addObserver(object : DefaultLifecycleObserver {
                        override fun onDestroy(owner: LifecycleOwner) {
                            binding = null
                        }
                    })
                }
            <\/strong>}
        })
    }


    override fun getValue(thisRef: Fragment, property: KProperty<*>): T {
        if (binding == null)
            binding = bindingClass.getMethod(\"bind\", View::class.java<\/em>).invoke(null, thisRef.requireView()) as T
        return binding!!
    }

}<\/pre>\n\n\n\n
And in our fragment,<\/p>\n\n\n\n
private val binding by viewBinding<\/em><FragmentBuyBinding>()<\/pre>\n","protected":false},"excerpt":{"rendered":"
Is there more efficient way that decreases our boilerplate code? Yes! By leveraging the power of Delegates.<\/p>\n","protected":false},"author":7,"featured_media":15285,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[149],"tags":[],"class_list":["post-15179","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-engineering-product"],"yoast_head":"\nFragment View Binding initialisation using Delegates - Flobiz<\/title>\n<meta name=\"description\" content=\"About Fragment view Binding initialisation using Delegates. Read what are delegates, property delegation, custom property delegate for fragment view.\" \/>\n<link rel=\"canonical\" href=\"http:\/\/73.248.200.35.bc.googleusercontent.com\/blog\/fragment-view-binding-initialisation-using-delegates\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Fragment View Binding initialisation using Delegates - Flobiz\" \/>\n<meta property=\"og:description\" content=\"About Fragment view Binding initialisation using Delegates. Read what are delegates, property delegation, custom property delegate for fragment view.\" \/>\n<meta property=\"og:url\" content=\"http:\/\/73.248.200.35.bc.googleusercontent.com\/blog\/fragment-view-binding-initialisation-using-delegates\/\" \/>\n<meta property=\"og:site_name\" content=\"FloBiz\" \/>\n<meta property=\"article:published_time\" content=\"2021-09-13T11:24:12+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-09-19T10:56:10+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/35.200.248.73\/blog\/wp-content\/uploads\/2021\/09\/Untitled-design-5.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"675\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\">\n\t<meta name=\"twitter:data1\" content=\"5 minutes\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"http:\/\/35.200.248.73:80\/blog\/#website\",\"url\":\"http:\/\/35.200.248.73:80\/blog\/\",\"name\":\"FloBiz\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"http:\/\/35.200.248.73:80\/blog\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"http:\/\/73.248.200.35.bc.googleusercontent.com\/blog\/fragment-view-binding-initialisation-using-delegates\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"http:\/\/35.200.248.73\/blog\/wp-content\/uploads\/2021\/09\/Untitled-design-5.png\",\"contentUrl\":\"http:\/\/35.200.248.73\/blog\/wp-content\/uploads\/2021\/09\/Untitled-design-5.png\",\"width\":1200,\"height\":675,\"caption\":\"Binding\"},{\"@type\":\"WebPage\",\"@id\":\"http:\/\/73.248.200.35.bc.googleusercontent.com\/blog\/fragment-view-binding-initialisation-using-delegates\/#webpage\",\"url\":\"http:\/\/73.248.200.35.bc.googleusercontent.com\/blog\/fragment-view-binding-initialisation-using-delegates\/\",\"name\":\"Fragment View Binding initialisation using Delegates - Flobiz\",\"isPartOf\":{\"@id\":\"http:\/\/35.200.248.73:80\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"http:\/\/73.248.200.35.bc.googleusercontent.com\/blog\/fragment-view-binding-initialisation-using-delegates\/#primaryimage\"},\"datePublished\":\"2021-09-13T11:24:12+00:00\",\"dateModified\":\"2021-09-19T10:56:10+00:00\",\"author\":{\"@id\":\"http:\/\/35.200.248.73:80\/blog\/#\/schema\/person\/9a658391bc1bd4a4dcb0c3eac063cae6\"},\"description\":\"About Fragment view Binding initialisation using Delegates. Read what are delegates, property delegation, custom property delegate for fragment view.\",\"breadcrumb\":{\"@id\":\"http:\/\/73.248.200.35.bc.googleusercontent.com\/blog\/fragment-view-binding-initialisation-using-delegates\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\/\/73.248.200.35.bc.googleusercontent.com\/blog\/fragment-view-binding-initialisation-using-delegates\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\/\/73.248.200.35.bc.googleusercontent.com\/blog\/fragment-view-binding-initialisation-using-delegates\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"item\":{\"@type\":\"WebPage\",\"@id\":\"http:\/\/35.200.248.73:80\/blog\/\",\"url\":\"http:\/\/35.200.248.73:80\/blog\/\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"position\":2,\"item\":{\"@type\":\"WebPage\",\"@id\":\"http:\/\/73.248.200.35.bc.googleusercontent.com\/blog\/fragment-view-binding-initialisation-using-delegates\/\",\"url\":\"http:\/\/73.248.200.35.bc.googleusercontent.com\/blog\/fragment-view-binding-initialisation-using-delegates\/\",\"name\":\"Fragment View Binding initialisation using Delegates\"}}]},{\"@type\":\"Person\",\"@id\":\"http:\/\/35.200.248.73:80\/blog\/#\/schema\/person\/9a658391bc1bd4a4dcb0c3eac063cae6\",\"name\":\"Sarthak Garg\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"http:\/\/35.200.248.73:80\/blog\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/bee27a54b0195d4d219f0aeafd1062ca33346ad05c60e348ee63291170bdae4a?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/bee27a54b0195d4d219f0aeafd1062ca33346ad05c60e348ee63291170bdae4a?s=96&d=mm&r=g\",\"caption\":\"Sarthak Garg\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"http:\/\/35.200.248.73\/blog\/wp-json\/wp\/v2\/posts\/15179","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/35.200.248.73\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/35.200.248.73\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/35.200.248.73\/blog\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"http:\/\/35.200.248.73\/blog\/wp-json\/wp\/v2\/comments?post=15179"}],"version-history":[{"count":5,"href":"http:\/\/35.200.248.73\/blog\/wp-json\/wp\/v2\/posts\/15179\/revisions"}],"predecessor-version":[{"id":15377,"href":"http:\/\/35.200.248.73\/blog\/wp-json\/wp\/v2\/posts\/15179\/revisions\/15377"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/35.200.248.73\/blog\/wp-json\/wp\/v2\/media\/15285"}],"wp:attachment":[{"href":"http:\/\/35.200.248.73\/blog\/wp-json\/wp\/v2\/media?parent=15179"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/35.200.248.73\/blog\/wp-json\/wp\/v2\/categories?post=15179"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/35.200.248.73\/blog\/wp-json\/wp\/v2\/tags?post=15179"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}