Spannable Textview Part 2 - All text Styles

on
android_learners_hub
android_learners_hub

In the previous post (Spannable Textview Part 1 - Introduction (onlyjavaforall.blogspot.com)) you learn steps to create spannable textview, its syntax and classes of span. Now, in this post you will learn all the text styles used in spannable textview.
Lets take  a look on the styles and their syntax but before that we should understand how to check starting and ending index of our text.
Suppose we have to write "Example" in highlighted way now here starting index of it is "0" and ending index of it is "7"(actual end + 1).
example

Styles and their Syntax :-

To style the text our first step is to make variable SpannableString (you can also make variable of spanned and spannablestringbuilder).
Example:- SpannableString ss= new SpannableString(text); // text is whatever the text yiu want to write.

1.Text color :- This style is used to change the text color ,that is done by the function               ForegroundColorSpan().
 Syntax :-   
 variable of spannable string . setspan( new ForegroundColorSpan(Color.colorname), start,end,flag);
 Example :-
 ss.setSpan(new ForegroundColorSpan(Color.RED), 0, 7,0);

2. Highlighting text or Background color:-This style is used to change the text background color       ,that is done by the function BackgroundColorSpan().
  Syntax :-   
  variable of spannable string . setspan( new BackgroundColorSpan(Color.colorname), start,end,flag);
  Example :-
  ss.setSpan(new BackgroundColorSpan(Color.YELLOW),0,7,0);

3. Bold :-This style is used to make text bold ,that is done with the help of function StyleSpan().
  Syntax :-   
   variable of spannable string . setspan( new StyleSpan(Typeface.BOLD), start,end,flag);
  Example :-
  ss.setSpan(new StyleSpan(Typeface.BOLD), 9, 13,0);

4. Italic :-This style is used to make text Italic ,that is done with the help of function StyleSpan().
   Syntax :-   
   variable of spannable string . setspan( new StyleSpan(Typeface.ITALIC), start,end,flag);
   Example :-
   ss.setSpan(new StyleSpan(Typeface.ITALIC), 26, 32,0);

5. Strikethrough :- This style is used to make a horizontal line in middle of text ,that is done with the      help of function StrikethroughSpan().
   Syntax :-  
   variable of spannable string . setspan( new StrikethroughSpan(Typeface.ITALIC), start,end,flag); 
   Example :-
   ss.setSpan(new StrikethroughSpan(),34,48,0);

6. Large :-This style is used to make text large ,that is done with the help of function     RelativeSizeSpan().
 Syntax :- 
 variable of spannable string . setspan( new RelativeSizeSpan(Proportion), start,end,flag); 
 Example :-
 ss.setSpan(new RelativeSizeSpan(2f),50,55,0);

7. SuperScript Text :- This style is used to appear text above ,that is done with the help of function     SuperscriptSpan().
 Syntax :- 
 variable of spannable string . setspan( new SuperscriptSpan(), start,end,flag);
 Example :-
ss.setSpan(new SuperscriptSpan(),57,68,0);

8. SubScript Text :-This style is used to appear text below ,that is done with the help of function   SubscriptSpan().
 Syntax :- 
 variable of spannable string . setspan( new SubscriptSpan(), start,end,flag);
 Example :-
 ss.setSpan(new SubscriptSpan(), 70, 79, 0);

9. Url :- This style is used to create a hyperlink ,that is done with the help of function URLSpan().
   Syntax :- 
   variable of spannable string . setspan( new URLSpan("url"), start,end,flag);
   Example :-
   ss.setSpan(new URLSpan("http://www.google.com"),81,84,0);

10. Clickable :-This style is used to make text clickable ,that is done with the help of function     ClickableSpan().
   Syntax :- 
   variable of spannable string . setspan( new ClickableSpan(), start,end,flag);
   Example :-
   ss.setSpan(clickableSpan, 86, 95, 0);

Code to illustrate the above styles :-

activity_main.xml
<TextView
    android:id="@+id/text_view"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textSize="20sp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
Mainactivity.java
import androidx.appcompat.app.AppCompatActivity;
import android.graphics.Color;
import android.graphics.Typeface;
import android.os.Bundle;
import android.text.SpannableString;
import android.text.method.LinkMovementMethod;
import android.text.style.BackgroundColorSpan;
import android.text.style.ClickableSpan;
import android.text.style.ForegroundColorSpan;
import android.text.style.RelativeSizeSpan;
import android.text.style.StrikethroughSpan;
import android.text.style.StyleSpan;
import android.text.style.SubscriptSpan;
import android.text.style.SuperscriptSpan;
import android.text.style.URLSpan;
import android.text.style.UnderlineSpan;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        TextView textview=findViewById(R.id.text_view);
        String text = "colored\n\n"+"Bold\n\n"+"Underline\n\n"+"Italic\n\n"+"Strike through\n\n"+"Large\n\n"+"superscript\n\n"+"subscript\n\n"+"Url\n\n"+"Clickable\n\n";
        SpannableString ss = new SpannableString(text);
        //text color
        ss.setSpan(new ForegroundColorSpan(Color.RED), 0, 7,0);
        //text background color for highlighting
        BackgroundColorSpan bcsYellow = new BackgroundColorSpan(Color.YELLOW);
        ss.setSpan(bcsYellow,0,7,0);
        //make text bold
        ss.setSpan(new StyleSpan(Typeface.BOLD), 9, 13,0);
        // make text underline
        ss.setSpan(new UnderlineSpan(),15,24,0);
        // make text italic
        ss.setSpan(new StyleSpan(Typeface.ITALIC), 26, 32,0);
        // make text strike through
        ss.setSpan(new StrikethroughSpan(),34,48,0);
        //make the text twice large
        ss.setSpan(new RelativeSizeSpan(2f),50,55,0);
        // superscript text
        ss.setSpan(new SuperscriptSpan(),57,68,0);
        // make the superscript text smaller
        ss.setSpan(new RelativeSizeSpan(0.6f),57,68,0);
        // subscript text
        ss.setSpan(new SubscriptSpan(), 70, 79, 0);
        // make the subscript text smaller
        ss.setSpan(new RelativeSizeSpan(0.6f), 70, 79, 0);
        // url
        ss.setSpan(new URLSpan("http://www.google.com"), 81, 84, 0);
        // clickable text
        ClickableSpan clickableSpan = new ClickableSpan() {
            @Override
            public void onClick(View widget) {
            // We display a Toast. You could do anything you want here.
                Toast.makeText(MainActivity.this, "Clicked", Toast.LENGTH_SHORT).show();
            }
        };
        ss.setSpan(clickableSpan, 86, 95, 0);

        // this step is mandated for the url and clickable styles.
        textview.setMovementMethod(LinkMovementMethod.getInstance());

        textview.setText(ss);
    }
}

Output:-

output of the above code


Output when we click on url :-
URL Output

Output when we click on clickable text:-
Output of clickable text


android_learners_hub

so, this was all about Spannable textview. For any query feel free to comment and donot forget to subscribe this blog for more updates.


Comments

Post a Comment