{"id":1667,"date":"2016-05-01T07:32:23","date_gmt":"2016-05-01T07:32:23","guid":{"rendered":"http:\/\/abhiandroid.com\/ui\/?page_id=1667"},"modified":"2019-06-12T11:19:01","modified_gmt":"2019-06-12T11:19:01","slug":"textswitcher","status":"publish","type":"page","link":"https:\/\/abhiandroid.com\/ui\/textswitcher","title":{"rendered":"TextSwitcher Tutorial With Example In Android Studio"},"content":{"rendered":"<p>In Android, TextSwitcher is a specialized ViewSwitcher that contains only children of type TextView. TextSwitcher is available in Android from version Android 1.6+.<\/p>\n<p>A TextSwitcher is useful to animate a label(i.e. text) on screen. It is an element of transition widget which helps us to add transitions on the labels. Whenever setText(CharSequence) method is called, TextSwitcher simply animates the current text out and new text in. For Example you need to cycle through information in a TextView like Navigating through a list of dates using\u00a0Left and Right button.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1676\" src=\"\/ui\/wp-content\/uploads\/2016\/05\/TextSwitcher-in-Android.jpg\" alt=\"TextSwitcher in Android\" width=\"604\" height=\"267\" srcset=\"https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/05\/TextSwitcher-in-Android.jpg 604w, https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/05\/TextSwitcher-in-Android-300x133.jpg 300w\" sizes=\"auto, (max-width: 604px) 100vw, 604px\" \/><\/p>\n<hr \/>\n<h4><strong>Steps For\u00a0TextSwitcher Implementation:<\/strong><\/h4>\n<p>New views in TextSwitcher is created using factory\u00a0switcherid.setFactory(). And when\u00a0setText() method is used, it\u00a0first removes the old view using an animation set with the switcherid.setOutAnimation() method, and then places the new one using the animation set by the switcherid.setInAnimation() method.<\/p>\n<ol>\n<li>Get the reference of TextSwitcher in class using findViewById() method, or you can also create an object dynamically.<\/li>\n<li>Set a factory using <strong>switcherid.setFactory()<\/strong><\/li>\n<li>Set an in-animation using <strong>switcherid.setInAnimation()<\/strong><\/li>\n<li>Set an out-animation using <strong>switcherid.setOutAnimation()<\/strong><\/li>\n<\/ol>\n<hr \/>\n<h4><strong>Basic\u00a0TextSwitcher\u00a0XML Code:<\/strong><\/h4>\n<pre>&lt;TextSwitcher\r\n    android:id=\"@+id\/simpleTextSwitcher\"\r\n    android:layout_width=\"match_parent\"\r\n    android:layout_height=\"wrap_content\"\/&gt;<\/pre>\n<hr \/>\n<h4><strong>Important Methods Of TextSwitcher:<\/strong><\/h4>\n<p>Let\u2019s we discuss some important methods of TextSwitcher that may be called in order to manage the TextSwitcher.<\/p>\n<p><span style=\"color: #008000;\"><strong>1. setFactory(ViewFactory factory):<\/strong><\/span> This method is used to create a new view for TextSwitcher. By using this method we create a new TextView and replace the old view with that.<\/p>\n<p>Below we show how to create a new view using setFactory method.<\/p>\n<pre>TextSwitcher simpleTextSwitcher=(TextSwitcher)findViewById(R.id. simpleTextSwitcher); \/\/ get reference of TextSwitcher\r\n\r\n\/\/ Set the ViewFactory of the TextSwitcher that will create TextView object when asked\r\nsimpleTextSwitcher.setFactory(new ViewSwitcher.ViewFactory() {\r\n\r\npublic View makeView() {\r\n\/\/ TODO Auto-generated method stub\r\n\/\/ create a TextView\r\nTextView t = new TextView(MainActivity.this);\r\n\/\/ set the gravity of text to top and center horizontal\r\nt.setGravity(Gravity.TOP | Gravity.CENTER_HORIZONTAL);\r\n\/\/ set displayed text size\r\nt.setTextSize(36);\r\nreturn t;\r\n}\r\n});<\/pre>\n<p><span style=\"color: #008000;\"><strong>2. setCurrentText(CharSequence text):<\/strong><\/span> This method is used to set the text on the TextView that is currently showing.<\/p>\n<p>Below we set the Text in a TextView that is currently showing.<\/p>\n<pre>TextSwitcher simpleTextSwitcher = (TextSwitcher) findViewById(R.id.simpleTextSwitcher); \/\/ get the reference of TextSwitcher\r\nsimpleTextSwitcher.setCurrentText(\"current Text\"); \/\/ set current text in TextView that is currently showing\r\n<\/pre>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1677\" src=\"\/ui\/wp-content\/uploads\/2016\/05\/setCurrentText-in-TextSwitcher-Android.jpg\" alt=\"setCurrentText in TextSwitcher Android\" width=\"346\" height=\"276\" srcset=\"https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/05\/setCurrentText-in-TextSwitcher-Android.jpg 346w, https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/05\/setCurrentText-in-TextSwitcher-Android-300x239.jpg 300w\" sizes=\"auto, (max-width: 346px) 100vw, 346px\" \/><\/p>\n<p><span style=\"color: #008000;\"><strong>3. setText(CharSequence text):<\/strong><\/span> This method is used to set the text on the next view and switches to the next view.<\/p>\n<p>Below we set the Text on next view and switch to next view.<\/p>\n<pre>TextSwitcher simpleTextSwitcher = (TextSwitcher) findViewById(R.id.simpleTextSwitcher); \/\/ get the reference of TextSwitcher\r\nsimpleTextSwitcher.setText(\"text after switching\"); \/\/ set current text on the next view and switch to next view\r\n<\/pre>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1678\" src=\"\/ui\/wp-content\/uploads\/2016\/05\/setText-in-TextSwitcher-Android.jpg\" alt=\"setText in TextSwitcher Android\" width=\"347\" height=\"423\" srcset=\"https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/05\/setText-in-TextSwitcher-Android.jpg 347w, https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/05\/setText-in-TextSwitcher-Android-246x300.jpg 246w\" sizes=\"auto, (max-width: 347px) 100vw, 347px\" \/><\/p>\n<p><span style=\"color: #008000;\"><strong>4. loadAnimation(Context context, int id): <\/strong><\/span>This method is used whenever we need to define an object of Animation class through AnimationUtils class by calling a static method loadAnimation.<\/p>\n<p>Below we create an object of Animation class and load an animation by using AnimationUtils class.<\/p>\n<pre>\/\/ load an animation by using AnimationUtils class\r\nAnimation in = AnimationUtils.loadAnimation(this, android.R.anim.slide_in_left);\r\nAnimation out = AnimationUtils.loadAnimation(this, android.R.anim.slide_out_right);<\/pre>\n<p><span style=\"color: #008000;\"><strong>5. setInAnimation(Animation inAnimation):<\/strong><\/span> This method is used to set the animation of the appearance of the object on the screen.<\/p>\n<p>Below we create an object of Animation class and load an animation by using AnimationUtils class and then set the Animation on TextSwitcher.<\/p>\n<pre>TextSwitcher simpleTextSwitcher=(TextSwitcher)findViewById(R.id. simpleTextSwitcher); \/\/ initiate a TextSwitcher\r\nAnimation in = AnimationUtils.loadAnimation(this,android.R.anim.slide_in_left); \/\/ load an animation\r\nsimpleTextSwitcher.setInAnimation(in); \/\/ set in Animation for TextSwitcher\r\n<\/pre>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1680\" src=\"\/ui\/wp-content\/uploads\/2016\/05\/setInAnimation-in-TextSwitcher-Android.gif\" alt=\"setInAnimation in TextSwitcher Android\" width=\"304\" height=\"405\" \/><\/p>\n<p><span style=\"color: #008000;\"><strong>6. setOutAnimation(Animation outAnimation):<\/strong><\/span> This method does the opposite of setInAnimation().<\/p>\n<p>Whenever we set a new label in TextView, it first removes the old view using an animation set with the setOutAnimation() method, and then places the new one using the animation set by the setInAnimation() method.<\/p>\n<p>Below we create an object of Animation class and load an animation by using AnimationUtils class and then set the out Animation on TextSwitcher<\/p>\n<pre>TextSwitcher simpleTextSwitcher=(TextSwitcher)findViewById(R.id. simpleTextSwitcher); \/\/ get reference of TextSwitcher\r\nAnimation out = AnimationUtils.loadAnimation(this,android.R.anim.slide_out_right); \/\/ load an animation\r\nsimpleTextSwitcher.setOutAnimation(out); \/\/ set out Animation for TextSwitcher\r\n<\/pre>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1679\" src=\"\/ui\/wp-content\/uploads\/2016\/05\/setOutAnimation-in-TextSwitcher-Android.gif\" alt=\"setOutAnimation in TextSwitcher Android\" width=\"304\" height=\"405\" \/><\/p>\n<hr \/>\n<h4><strong>Attributes of TextSwitcher:<\/strong><\/h4>\n<p>Now let\u2019s we discuss some common attributes of TextSwitcher that helps us to configure it in our layout (xml).<\/p>\n<p><strong><span style=\"color: #008000;\">1. Id:<\/span>\u00a0<\/strong>id attribute is used to uniquely identify a TextSwitcher.<\/p>\n<p>Below we set the id of the TextSwitcher that is used to uniquely identify it.<\/p>\n<pre>&lt;TextSwitcher\r\nandroid:id=\"@+id\/simpleTextSwitcher\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\" \/&gt;&lt;!--\u00a0 id of TextSwitcher that is used to uniquely identify it --&gt;\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>2. padding: <\/strong><\/span>This attribute is used to set the padding from left, right, top or bottom side of a TextSwitcher.<\/p>\n<ul>\n<li><strong>paddingRight: <\/strong>This attribute is used to set the padding from the right side of a TextSwitcher<strong>.<\/strong><\/li>\n<li><strong>paddingLeft: <\/strong>This attribute is used to set the padding from the left side of a TextSwitcher<strong>.<\/strong><\/li>\n<li><strong>paddingTop: <\/strong>This attribute is used to set the padding from the top side of a TextSwitcher<strong>.<\/strong><\/li>\n<li><strong>paddingBottom: <\/strong>This attribute is used to set the padding from the bottom side of a TextSwitcher<strong>.<\/strong><\/li>\n<li><strong>Padding: <\/strong>This attribute is used to set the padding from the all the side\u2019s of a TextSwitcher<strong>.<\/strong><\/li>\n<\/ul>\n<p>Below we set the 10dp padding from all the sides of a TextSwitcher<\/p>\n<pre>&lt;TextSwitcher\r\n    android:id=\"@+id\/simpleTextSwitcher\"\r\n    android:layout_width=\"match_parent\"\r\n    android:layout_height=\"wrap_content\"\r\n    android:layout_gravity=\"center_horizontal\"\r\n    android:layout_marginTop=\"50dp\"\r\n    android:background=\"#028B2F\"\r\n    android:padding=\"20dp\"\/&gt;&lt;!--Setting background and padding in TextSwitcher--&gt;<\/pre>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1681\" src=\"\/ui\/wp-content\/uploads\/2016\/05\/background-padding-in-TextSwitcher-Android.jpg\" alt=\"background padding in TextSwitcher Android\" width=\"337\" height=\"270\" srcset=\"https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/05\/background-padding-in-TextSwitcher-Android.jpg 337w, https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/05\/background-padding-in-TextSwitcher-Android-300x240.jpg 300w\" sizes=\"auto, (max-width: 337px) 100vw, 337px\" \/><\/p>\n<p><span style=\"color: #008000;\"><strong>3. background:<\/strong><\/span> This attribute is used to set the background of a TextSwitcher. We can set a color or a drawable in the background of a TextSwitcher.<\/p>\n<p>In the code of padding we also used background and few other common attribute.<\/p>\n<p><strong>Setting background In TextSwitcher In Java class:<\/strong><\/p>\n<pre>TextSwitcher simpleTextSwitcher = (TextSwitcher) findViewById(R.id.simpleTextSwitcher); \/\/ get the reference of TextSwitcher.\r\nsimpleTextSwitcher.setBackgroundColor(Color.BLACK); \/\/ set black color in the background of TextSwitcher.\r\n<\/pre>\n<hr \/>\n<h4><strong>TextSwitcher Example In Android Studio:<\/strong><\/h4>\n<p>Below is the example of TextSwitcher in which we display a TextSwitcher by using its different attributes. In this we use one Button for changing the label of TextSwitcher. Firstly we create a string array and create dynamic TextView using setFactory method and then load and set slide in left and slide in right animation and finally set the text in the TextSwitcher on button click using setText method. Whenever a user click on next button TextSwitcher switch between the labels and the current label will go out and next label will come in with specified animation<em>.<\/em><\/p>\n<p>Below you can download complete Android Studio code, see final output and step by step explanation of the example:<\/p>\n<p style=\"text-align: center;\"><a class=\"download\" href=\"https:\/\/github.com\/abhisheksaini4\/TextSwitcherExample\" 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><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1682\" src=\"\/ui\/wp-content\/uploads\/2016\/05\/TextSwitcher-Example-In-Android-Studio.gif\" alt=\"TextSwitcher Example In Android Studio\" width=\"305\" height=\"466\" \/><\/p>\n<p><span style=\"color: #008000;\"><strong>Step 1<\/strong><\/span><strong><span style=\"color: #008000;\">:<\/span>\u00a0<\/strong>Create a new project and name it <strong>TextSwitcherExample<\/strong><\/p>\n<p><span style=\"color: #008000;\"><strong>Step 2:<\/strong><\/span><strong>\u00a0<\/strong>Open <strong>res -&gt; layout -&gt;activity_main.xml (or) main.xml<\/strong> and add following code :<\/p>\n<p>In this step we open an xml file and add the code for displaying a Button and a TextSwitcher by using its different attributes.<\/p>\n<pre>&lt;LinearLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:orientation=\"vertical\"&gt;\r\n\r\n\r\n&lt;TextSwitcher\r\nandroid:id=\"@+id\/simpleTextSwitcher\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_gravity=\"center_horizontal\"\r\nandroid:layout_marginTop=\"50dp\" \/&gt;\r\n\r\n\r\n&lt;Button\r\nandroid:id=\"@+id\/buttonNext\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"150dp\"\r\nandroid:layout_gravity=\"center\"\r\nandroid:background=\"#005\"\r\nandroid:textColor=\"#fff\"\r\nandroid:textStyle=\"bold\"\r\nandroid:text=\"NEXT\" \/&gt;\r\n\r\n&lt;\/LinearLayout&gt;\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 3:<\/strong><\/span><strong>\u00a0<\/strong>Open <strong>src -&gt; package -&gt; MainActivity.java<\/strong><\/p>\n<p>In this step we open\u00a0MainActivity\u00a0and\u00a0add the code to\u00a0initiate the TextSwitcher and Button. Here firstly we create an string array and create dynamic TextView using setFactory method and then load and set slide in left and slide in right animation and finally set the text in the TextSwitcher on button click using setText method. Whenever a user click on next button TextSwitcher switch between the labels and the current label will go out and next label will come in with specified animation.<\/p>\n<pre>package com.example.ip_d.textswitcherexample;\r\n\r\nimport android.os.Bundle;\r\nimport android.support.v7.app.AppCompatActivity;\r\nimport android.view.Gravity;\r\nimport android.view.View;\r\nimport android.view.animation.Animation;\r\nimport android.view.animation.AnimationUtils;\r\nimport android.widget.Button;\r\nimport android.widget.TextSwitcher;\r\nimport android.widget.TextView;\r\nimport android.widget.ViewSwitcher;\r\n\r\npublic class MainActivity extends AppCompatActivity {\r\n    private TextSwitcher simpleTextSwitcher;\r\n    Button btnNext;\r\n\r\n\r\n    \/\/ Array of String to Show In TextSwitcher\r\n    String strings[] = {\"Text Switcher 1\", \"Text Switcher 2\", \"Text Switcher 3\", \"Text Switcher 4\", \"Text Switcher 5\"};\r\n    int messageCount = strings.length;\r\n    \/\/ to keep current Index of textID array\r\n    int currentIndex = -1;\r\n\r\n\r\n    @Override\r\n    protected void onCreate(Bundle savedInstanceState) {\r\n        super.onCreate(savedInstanceState);\r\n\r\n        setContentView(R.layout.activity_main);\r\n\r\n        \/\/ get The references if Button and TextSwitcher\r\n        btnNext = (Button) findViewById(R.id.buttonNext);\r\n        simpleTextSwitcher = (TextSwitcher) findViewById(R.id.simpleTextSwitcher);\r\n        \/\/ Set the ViewFactory of the TextSwitcher that will create TextView object when asked\r\n        simpleTextSwitcher.setFactory(new ViewSwitcher.ViewFactory() {\r\n\r\n            public View makeView() {\r\n                \/\/ TODO Auto-generated method stub\r\n                \/\/ create a TextView\r\n                TextView t = new TextView(MainActivity.this);\r\n                \/\/ set the gravity of text to top and center horizontal\r\n                t.setGravity(Gravity.TOP | Gravity.CENTER_HORIZONTAL);\r\n                \/\/ set displayed text size\r\n                t.setTextSize(36);\r\n                return t;\r\n            }\r\n        });\r\n\r\n        \/\/ Declare in and out animations and load them using AnimationUtils class\r\n        Animation in = AnimationUtils.loadAnimation(this, android.R.anim.slide_in_left);\r\n        Animation out = AnimationUtils.loadAnimation(this, android.R.anim.slide_out_right);\r\n\r\n        \/\/ set the animation type to TextSwitcher\r\n        simpleTextSwitcher.setInAnimation(in);\r\n        simpleTextSwitcher.setOutAnimation(out);\r\n\r\n            \/\/text appear on start\r\n        simpleTextSwitcher.setCurrentText(\"click on next button to switch text\");\r\n        \/\/ ClickListener for NEXT button\r\n        \/\/ When clicked on Button TextSwitcher will switch between labels\r\n        \/\/ The current label will go out and next label will come in with specified animation\r\n        btnNext.setOnClickListener(new View.OnClickListener() {\r\n\r\n            public void onClick(View v) {\r\n                \/\/ TODO Auto-generated method stub\r\n                currentIndex++;\r\n                \/\/ If index reaches maximum then reset it\r\n                if (currentIndex == messageCount)\r\n                    currentIndex = 0;\r\n                simpleTextSwitcher.setText(strings[currentIndex]); \/\/ set Text in TextSwitcher\r\n            }\r\n        });\r\n\r\n    }\r\n\r\n}\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>Output:<\/strong><\/span><\/p>\n<p>Now run the App and you will see TextSwitcher in action. Simply click on Next button and text will start switching one to another.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In Android, TextSwitcher is a specialized ViewSwitcher that contains only children of type TextView. TextSwitcher is available in Android from version Android 1.6+. A TextSwitcher is useful to animate a label(i.e. text) on screen. It is an element of transition widget which helps us to add transitions on the labels. Whenever setText(CharSequence) method is called, &hellip; <a href=\"https:\/\/abhiandroid.com\/ui\/textswitcher\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">TextSwitcher Tutorial 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-1667","page","type-page","status-publish","hentry"],"acf":[],"psp_head":"<title>TextSwitcher Tutorial With Example In Android Studio \u2013 Abhi Android<\/title>\r\n<meta name=\"description\" content=\"Tutorial on TextSwitcher with step by step explanation using example in Android Studio. In Android, TextSwitcher is a specialized ViewSwitcher that contains only children of type TextView.\" \/>\r\n<meta name=\"robots\" content=\"index,follow\" \/>\r\n<link rel=\"canonical\" href=\"https:\/\/abhiandroid.com\/ui\/textswitcher\" \/>\r\n","_links":{"self":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/1667","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=1667"}],"version-history":[{"count":3,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/1667\/revisions"}],"predecessor-version":[{"id":2802,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/1667\/revisions\/2802"}],"wp:attachment":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/media?parent=1667"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}