{"id":705,"date":"2016-01-20T08:49:18","date_gmt":"2016-01-20T08:49:18","guid":{"rendered":"http:\/\/abhiandroid.com\/ui\/?page_id=705"},"modified":"2019-06-12T11:23:00","modified_gmt":"2019-06-12T11:23:00","slug":"textview","status":"publish","type":"page","link":"https:\/\/abhiandroid.com\/ui\/textview","title":{"rendered":"TextView With Example In Android Studio"},"content":{"rendered":"<p>In Android, TextView<strong>\u00a0<\/strong>displays text to the user and optionally allows them to edit it programmatically. TextView is a complete text editor, however basic class is configured to not allow editing but we can edit it.<\/p>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-712\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/TextView-Size-of-Plain-Large-Medium-and-Small-Text-Android-Studio.jpg\" alt=\"TextView Size of Plain, Large, Medium, and Small Text Android Studio\" width=\"468\" height=\"163\" srcset=\"https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/01\/TextView-Size-of-Plain-Large-Medium-and-Small-Text-Android-Studio.jpg 468w, https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/01\/TextView-Size-of-Plain-Large-Medium-and-Small-Text-Android-Studio-300x104.jpg 300w\" sizes=\"auto, (max-width: 468px) 100vw, 468px\" \/><\/center>View is the parent class of TextView. Being a subclass of view the text view component can be used in your app\u2019s GUI inside a ViewGroup, or as the content view of an activity.<\/p>\n<p>We can create a TextView\u00a0instance by declaring it inside a layout(XML file) or by instantiating it programmatically(Java Class).<\/p>\n<p><span style=\"color: #008000;\"><strong>TextView code in XML:<\/strong><\/span><\/p>\n<pre>&lt;TextView android:id=\"@+id\/simpleTextView\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:text=\"AbhiAndroid\" \/&gt;<\/pre>\n<p><span style=\"color: #008000;\"><strong>TextView code in JAVA:<\/strong><\/span><\/p>\n<pre>TextView textView = (TextView) findViewById(R.id.textView);\r\ntextView.setText(\"AbhiAndroid\"); \/\/set text for text view<\/pre>\n<hr \/>\n<h4><strong>Attributes of TextView:<br \/>\n<\/strong><\/h4>\n<p>Now let\u2019s we discuss about the attributes that helps us to configure a TextView in your xml file.<\/p>\n<p><span style=\"color: #008000;\"><strong>1. id:<\/strong><\/span> id is an attribute used to uniquely identify a text view. Below is the example code in which we set the id of a text view.<\/p>\n<pre>&lt;TextView\r\nandroid:id=\"@+id\/simpleTextView\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\/&gt;<\/pre>\n<p><span style=\"color: #008000;\"><strong>2. gravity: <\/strong><\/span>The gravity attribute is an optional attribute which is used to control the alignment of the text like left, right, center, top, bottom, center_vertical, center_horizontal etc.<\/p>\n<p>Below is the example code with explanation included in which we set the center_horizontal gravity for text of a TextView.<\/p>\n<pre>&lt;TextView\r\nandroid:id=\"@+id\/simpleTextView\"\r\nandroid:layout_width=\"fill_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:text=\"AbhiAndroid\"\r\nandroid:textSize=\"20sp\"\r\nandroid:gravity=\"center_horizontal\"\/&gt; &lt;!--center horizontal gravity--&gt;<\/pre>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-711\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/Gravity-in-TextView-Android.jpg\" alt=\"Gravity in TextView Android\" width=\"224\" height=\"278\" \/><\/center><span style=\"color: #008000;\"><strong>3. text:<\/strong><\/span> text attribute is used to set the text in a text view. We can set the text in xml as well as in the java class.<\/p>\n<p>Below is the example code with explanation included in which we set the text \u201cAbhiAndroid\u201d in a text view.<\/p>\n<pre>&lt;TextView\r\nandroid:id=\"@+id\/simpleTextView\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:textSize=\"25sp\"\r\nandroid:text=\"AbhiAndroid\"\/&gt;&lt;!--Display Text as AbhiAndroid--&gt;\r\n<\/pre>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-713\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/text-attribute-in-TextView-Android.jpg\" alt=\"text attribute in TextView Android\" width=\"220\" height=\"279\" \/><\/center><strong>In Java class:<\/strong><\/p>\n<p>Below is the example code in which we set the text in a textview programmatically means in java class.<\/p>\n<pre>TextView textView = (TextView)findViewById(R.id.textView);\r\ntextView.setText(\"AbhiAndroid\"); \/\/set text for text view<\/pre>\n<p><span style=\"color: #008000;\"><strong>4. textColor:<\/strong><\/span> textColor attribute is used to set the text color of a text view. Color value is in the form of &#8220;#argb&#8221;, &#8220;#rgb&#8221;, &#8220;#rrggbb&#8221;, or &#8220;#aarrggbb&#8221;.<\/p>\n<p>Below is the example code with explanation included in which we set the red color for the displayed text.<\/p>\n<pre>&lt;TextView\r\nandroid:id=\"@+id\/simpleTextView\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:text=\"AbhiAndroid\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:textSize=\"25sp\"\r\nandroid:textColor=\"#f00\"\/&gt;&lt;!--red color for text view--&gt;\r\n<\/pre>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-714\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/textcolor-in-TextView.jpg\" alt=\"textcolor in TextView\" width=\"208\" height=\"280\" \/><\/center><strong>In Java class:<\/strong><\/p>\n<p>Below is the example code in which we set the text color of a text view programmatically means in java class.<\/p>\n<pre>TextView textView = (TextView)findViewById(R.id.textView);\r\ntextView.setTextColor(Color.<strong><em>RED<\/em><\/strong>); \/\/set red color for text view\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>5. textSize:<\/strong><\/span> textSize attribute is used to set the size of text of a text view. We can set the text size in sp(scale independent pixel) or dp(density pixel).<\/p>\n<p>Below is the example code in which we set the 20sp size for the text of a text view.<\/p>\n<pre>&lt;TextView\r\n    android:id=\"@+id\/simpleTextView\"\r\n    android:layout_width=\"wrap_content\"\r\n    android:layout_height=\"wrap_content\"\r\n    android:text=\"AbhiAndroid\"\r\n    android:layout_centerInParent=\"true\"\r\n    android:textSize=\"40sp\" \/&gt;&lt;!--Set size--&gt;<\/pre>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-715\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/textsize-attribute-in-TextView.jpg\" alt=\"textsize attribute in TextView\" width=\"213\" height=\"260\" \/><\/center><strong>In Java class:<\/strong><\/p>\n<p>Below is the example code in which we set the text size\u00a0of a text view programmatically means in java class.<\/p>\n<pre>TextView textView = (TextView)findViewById(R.id.textView);\r\ntextView.setTextSize(20); \/\/set 20sp size of text\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>6. textStyle:<\/strong><\/span> textStyle attribute is used to set the text style of a text view. The possible text styles are bold, italic and normal. \u00a0If we need to use two or more styles for a text view then \u201c|\u201d operator is used for that.<\/p>\n<p>Below is the example code with explanation included in which we\u00a0 set the bold and italic text styles for text.<\/p>\n<pre>&lt;TextView\r\n    android:id=\"@+id\/simpleTextView\"\r\n    android:layout_width=\"wrap_content\"\r\n    android:layout_height=\"wrap_content\"\r\n    android:text=\"AbhiAndroid\"\r\n    android:layout_centerInParent=\"true\"\r\n    android:textSize=\"40sp\"\r\n    android:textStyle=\"bold|italic\"\/&gt;&lt;!--bold and italic text style of text--&gt;<\/pre>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-716\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/textStyle-in-TextView.jpg\" alt=\"textStyle in TextView\" width=\"219\" height=\"264\" \/><\/center><span style=\"color: #008000;\"><strong>7.\u00a0background:<\/strong><\/span> background attribute is used to set the background of a text view. We can set a color or a drawable in the background of a text view.<\/p>\n<p><span style=\"color: #008000;\"><strong>8. padding:<\/strong><\/span> padding attribute is used to set the padding from left, right, top or bottom. In above example code of background we also set the 10dp padding from all the side\u2019s of text view.<\/p>\n<p>Below is the example code with explanation included in which we set the black color for the background, white color for the displayed text and set 10dp padding from all the side\u2019s for text view.<\/p>\n<pre>&lt;TextView\r\nandroid:id=\"@+id\/simpleTextView\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:text=\"AbhiAndroid\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:textSize=\"40sp\" \r\nandroid:padding=\"10dp\"\r\nandroid:textColor=\"#fff\"\r\nandroid:background=\"#000\"\/&gt; &lt;!--red color for background of text view--&gt;\r\n<\/pre>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-717\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/padding-and-background-attribute-in-TextView.jpg\" alt=\"padding and background attribute in TextView\" width=\"219\" height=\"273\" \/><\/center><strong>In Java class:<\/strong><\/p>\n<p>Below is the example code in which we set the background color of a text view programmatically means in java class.<\/p>\n<pre>TextView textView = (TextView)findViewById(R.id.textView);\r\ntextView.setBackgroundColor(Color.<strong><em>BLACK<\/em><\/strong>);\/\/set background color<\/pre>\n<hr \/>\n<h4><strong>Example of TextView:<\/strong><\/h4>\n<p>Below is the example of TextView in which we display a text view and set the text in xml file and then change the text on button click event programmatically. Below is the final output and code:<\/p>\n<p style=\"text-align: center;\"><a class=\"download\" href=\"https:\/\/github.com\/abhisheksaini4\/TextViewExample\" target=\"_blank\" rel=\"nofollow\">Download Code<\/a><a class=\"help\" title=\"Learn How To Download Code And Import In Android Studio\" href=\"\/androidstudio\/download-code-abhiandroid\" target=\"_blank\" rel=\"nofollow\"> ? <\/a><\/p>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-709\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/TextView-Example-in-Android-Studio.jpg\" alt=\"TextView Example in Android Studio\" width=\"348\" height=\"678\" srcset=\"https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/01\/TextView-Example-in-Android-Studio.jpg 348w, https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/01\/TextView-Example-in-Android-Studio-154x300.jpg 154w\" sizes=\"auto, (max-width: 348px) 100vw, 348px\" \/><\/center><strong>Step 1:<\/strong> Create a new project and name it textViewExample.<\/p>\n<pre>Select File -&gt; New -&gt; New Project. Fill the forms and click \"Finish\" button.\r\n<\/pre>\n<p><strong>Step 2:<\/strong> Open res -&gt; layout -&gt;\u00a0xml (or) activity_main.xml\u00a0and add following code. Here we will create a button and a textview in Relative Layout.<\/p>\n<pre>&lt;RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    xmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\n    android:layout_width=\"match_parent\"\r\n    android:layout_height=\"match_parent\"\r\n    android:paddingBottom=\"@dimen\/activity_vertical_margin\"\r\n    android:paddingLeft=\"@dimen\/activity_horizontal_margin\"\r\n    android:paddingRight=\"@dimen\/activity_horizontal_margin\"\r\n    android:paddingTop=\"@dimen\/activity_vertical_margin\"\r\n    tools:context=\".MainActivity\"&gt;\r\n\r\n    &lt;TextView\r\n        android:id=\"@+id\/simpleTextView\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_centerHorizontal=\"true\"\r\n        android:text=\"Before Clicking\"\r\n        android:textColor=\"#f00\"\r\n        android:textSize=\"25sp\"\r\n        android:textStyle=\"bold|italic\"\r\n        android:layout_marginTop=\"50dp\"\/&gt;\r\n\r\n    &lt;Button\r\n        android:id=\"@+id\/btnChangeText\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_centerInParent=\"true\"\r\n        android:background=\"#f00\"\r\n        android:padding=\"10dp\"\r\n        android:text=\"Change Text\"\r\n        android:textColor=\"#fff\"\r\n        android:textStyle=\"bold\" \/&gt;\r\n&lt;\/RelativeLayout&gt;<\/pre>\n<p><strong>Step 3:<\/strong> Open app -&gt; java -&gt; package and open MainActivity.java and add the following code. Here we will change the text of TextView after the user click on Button.<strong><br \/>\n<\/strong><\/p>\n<pre>package example.abhiandriod.textviewexample;\r\n\r\nimport android.graphics.Color;\r\nimport android.support.v7.app.AppCompatActivity;\r\nimport android.os.Bundle;\r\nimport android.view.Menu;\r\nimport android.view.MenuItem;\r\nimport android.view.View;\r\nimport android.widget.Button;\r\nimport android.widget.TextView;\r\n\r\npublic class MainActivity extends AppCompatActivity {\r\n\r\n    @Override\r\n    protected void onCreate(Bundle savedInstanceState) {\r\n        super.onCreate(savedInstanceState);\r\n        setContentView(R.layout.activity_main); \/\/set the layout\r\n        final TextView simpleTextView = (TextView) findViewById(R.id.simpleTextView); \/\/get the id for TextView\r\n        Button changeText = (Button) findViewById(R.id.btnChangeText); \/\/get the id for button\r\n        changeText.setOnClickListener(new View.OnClickListener() {\r\n            @Override\r\n            public void onClick(View view) {\r\n                simpleTextView.setText(\"After Clicking\"); \/\/set the text after clicking button\r\n            }\r\n        });\r\n    }\r\n\r\n\r\n}<\/pre>\n<p><strong>Output:<\/strong><\/p>\n<p>Now run the app in Emulator and click on the button. You will see text will change &#8220;After Clicking&#8221;.<\/p>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-718\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/TextView-Example-Output.jpg\" alt=\"TextView Example Output\" width=\"272\" height=\"289\" \/><\/center><\/p>\n","protected":false},"excerpt":{"rendered":"<p>In Android, TextView\u00a0displays text to the user and optionally allows them to edit it programmatically. TextView is a complete text editor, however basic class is configured to not allow editing but we can edit it. View is the parent class of TextView. Being a subclass of view the text view component can be used in &hellip; <a href=\"https:\/\/abhiandroid.com\/ui\/textview\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">TextView With Example In Android Studio<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"home.php","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-705","page","type-page","status-publish","hentry"],"acf":[],"psp_head":"<title>TextView With Example In Android Studio \u2013 Abhi Android<\/title>\r\n<meta name=\"description\" content=\"Tutorial on TextView with example in Android Studio which displays text to the user. Find attributes details like change color, style, padding, size and more in TextView.\" \/>\r\n<meta name=\"robots\" content=\"index,follow\" \/>\r\n<link rel=\"canonical\" href=\"https:\/\/abhiandroid.com\/ui\/textview\" \/>\r\n","_links":{"self":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/705","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/comments?post=705"}],"version-history":[{"count":3,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/705\/revisions"}],"predecessor-version":[{"id":2803,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/705\/revisions\/2803"}],"wp:attachment":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/media?parent=705"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}