Clickable checkBox text in android with Kotlin

Question

I am creating an android app with kotlin. I have reached a point that I have an EULA (End User License Agreement) checkbox and I need to make a part of the text of the check box clickable in order to display the terms and conditions.

XML file

 <CheckBox
    android:id="@+id/accept_terms_and_conditions"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="8dp"
    android:layout_marginBottom="8dp"
    android:text="I have read and accept the Terms &amp; Conditions"
    android:textColor="#000000"
    android:textSize="16sp"/>

I want to have the Terms & Conditions part clickable. I have already tried the code below. This was initially java code found here and it was transformed to kotlin automatically by Android Studio but I didn't have much luck with it as the app crashes when the SignUpActivity starts.

Kotlin file

class SignUpActivity : AppCompatActivity() {

    private var mAuthTask: UserSignUpTask? = null


    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_sign_up)


        val checkBox = findViewById<TextView>(R.id.accept_terms_and_conditions)

        val text = getText(R.string.terms_and_conditions)

        val ss = SpannableString(text)

        val clickableSpan1 = object : ClickableSpan() {

            override fun onClick(widget: View) {
                    Toast.makeText(this@SignUpActivity, "One", Toast.LENGTH_SHORT).show()
            }

            override fun updateDrawState(ds: TextPaint) {
                super.updateDrawState(ds)
                ds.color = Color.BLUE
                ds.isUnderlineText = false
            }
        }

        ss.setSpan(clickableSpan1, 28, 46, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE)

        checkBox.text = ss
        checkBox.movementMethod = LinkMovementMethod.getInstance()
    }
}

So is there any way to do this from the XML file directly? And if not how can I do it in Kotlin?

Note: The API I am developing the app is 21.

Answer 1

With help from @Karan Mer and some of the code found here the problem is solved so I will present the overall solution here.

XML file

<LinearLayout
        android:id="@+id/checkbox_Layout"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <CheckBox
            android:id="@+id/accept_terms_and_conditions"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>


        <TextView
            android:id="@+id/Terms_and_condition_text"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="0dp"
            android:layout_marginBottom="0dp"
            android:text="I have read and accept the Terms & Conditions"
            android:textColor="#000000"
            android:textSize="16sp"/>
    </LinearLayout>

Kotlin file

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_sign_up)



    val textView = findViewById<TextView>(R.id.Terms_and_condition_text)

    val text = getText(R.string.terms_and_conditions)

    val ss = SpannableString(text)

    val clickableSpan1 = object : ClickableSpan() {
        override fun onClick(widget: View) {
            //here you can set it to do whatever you want when clicked
        }


        //This is in order to change the default appereance of the link
        override fun updateDrawState(ds: TextPaint) {
            super.updateDrawState(ds)
            ds.color = Color.BLUE
            ds.isUnderlineText = false
        }
    }

    //here you set the starting and ending char of the link in the string
    ss.setSpan(clickableSpan1, 28, 45, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE)

    textView.text = ss
    textView.movementMethod = LinkMovementMethod.getInstance()
}

Answer 2

You can do something like this, Use horizontal LinearLayout with CheckBox with no text and TextView that you want to show as checkbox text. Now you can individually handle clicks on both checkbox and textview.

<LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

        <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

        <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="I agree to terms and conditions"/>
    </LinearLayout>

Result looks like below.