Android: Display a pop-up dialog when a particular word in a TextView is clicked

Question

In my application, I have some text for terms and conditions.

By registering you agree to be bound by our Terms of Use and that you have read our Privacy Policy.

The words Terms of Use and Privacy Policy should be clickable, and display an alert box.

First I tried splitting the sentences into four TextViews:

1. By registering you agree to be bound by our
2. Terms of Use
3. and that you have read our
4. Privacy Policy.

This worked well, with the following layout XML:

 <LinearLayout
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/termsandcondtion"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"
            android:orientation="horizontal" >

        <TextView
            android:id="@+id/terms_1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/terms_1"
            android:textColor="#000000"
            android:textSize="12dp" />

        <TextView
            android:id="@+id/terms"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:onClick="showTerms"
            android:text="@string/terms_2"
            android:textColor="#000000"
            android:textSize="12dp" />

        <TextView
            android:id="@+id/terms_3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/terms_3"
            android:textColor="#000000"
            android:textSize="12dp" />

        <TextView
            android:id="@+id/termsofuse"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:onClick="showTermsofUse"
            android:text="@string/terms_4"
            android:textColor="#000000"
            android:textSize="12dp" />
    </LinearLayout>

The code for displaying the popup is:

WebView wv = new WebView(this);

    wv.loadUrl(url);

    wv.setWebViewClient(new WebViewClient()
    {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url)
        {
            view.loadUrl(url);

            return true;
        }
    });
    AlertDialog.Builder alert = new AlertDialog.Builder(this);

    alert.setTitle("Privacy Policy");
    alert.setView(wv);
    alert.setNegativeButton("Close", new DialogInterface.OnClickListener()
    {
        public void onClick(DialogInterface dialog, int id)
        {
        }
    });
    alert.show();

The problem is that the four TextViews are not properly aligned with each other. This means I have to use one TextView and display a pop-up diaplog when a particular word (Terms of Use, Privacy Policy) in TextView is clicked.

What is the best way to do this?

Answer 1

I think you will need Spannable Strings. Also, this question would help. Creating ClickableSpan will be a good choice for your problem.

SpannableString stringToSpan = new SpannableString("<your sentence>");
TextView textView = (TextView) findViewById(R.id.<yourTextView ID>);
textView.setText(stringToSpan);
textView.setMovementMethod(LinkMovementMethod.getInstance());
ClickableSpan clickableSpan = new ClickableSpan() {
      @Override
      public void onClick(View textView) {
       //alert box code here
       }
      };
stringToSpan.setSpan(clickableSpan, <start position of span>,<end position>,Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
   }