![\"TabLayout](\"\/materialdesign\/wp-content\/uploads\/2016\/06\/TabLayout-in-Android.gif\")
<\/p>\nIn Android TabLayout is a new element introduced in Design Support library. It \u00a0provides horizontal layout to display tabs on the screen. We can display more screens in a single\u00a0screen using tabs. We can quickly swipe between the tabs. TabLayout is basically view class required to be added into our layout(xml) for creating Sliding Tabs. We use different methods of TabLayout to create, add and manage the tabs.<\/p>\n
<\/p>\n
Special Note:<\/strong><\/span> TabLayout is used to display tabs on the screen. We can create sliding as well as non sliding tabs by using TabLayout. If we need simple tabs without sliding then we replace the layout with the fragment on tab selected listener event and if we need sliding tabs then we use Viewpager.<\/p>\n Let\u2019s we discuss some important methods of TabLayout that may be called in order to manage the TabLayout.<\/p>\n 1.\u00a0newTab():<\/strong><\/span> This method is used to create and return a new TabLayout.Tab.<\/p>\n Below we create a new tab and set the text and icon for the tab.<\/p>\n 2. addTab(Tab\u00a0tab):<\/strong><\/span> This method is used to add a tab in the TabLayout. By using this method we add the tab which we created using newTab() method in the TabLayout. The tab will be added at the end of the list and\u00a0 If it is the first tab to be added then it will become the selected tab.<\/p>\n Below we firstly create a new tab and then add it in the TabLayout.<\/p>\n 3. addTab(Tab\u00a0tab, boolean setSelected):<\/strong> <\/span>This method is used to add a tab in the TabLayout and set the state for the tab. By using this method we add the tab which we created using newTab() method in the TabLayout. In this method we also set the state of the tab whether it is selected or not.<\/p>\n Below we firstly create a new tab and then add it in the TabLayout and set the true value for setSelected parameter that makes it selectable.<\/p>\n 4. addTab(Tab\u00a0tab, int position):<\/strong><\/span> This method is used to add a tab in the TabLayout and set the state for the tab. By using this method we add the tab which we created using newTab() method in the TabLayout. The tab will be inserted at\u00a0the given position. If it is the first tab to be added then it will become the selected tab.<\/p>\n Below we firstly create a new tab and then add it in the TabLayout at a specific position.<\/p>\n 5. addTab(Tab\u00a0tab, int position, boolean setSelected):<\/strong><\/span> This method is used to add a tab at a specific position and set the state of the tab. By using this method we add the tab which we created using newTab() method in the TabLayout. The tab will be inserted at\u00a0 the defined\u00a0 position and a Boolean value used to set the state of the tab. True value is used to make the tab selectable.<\/p>\n Below we firstly create a tab and then add it in the TabLayout at a specific position and we also set true value to make the tab selectable.<\/p>\n 6. getSelectedTabPosition():<\/strong><\/span> This method is used to get the position of the current selected tab. This method returns an int type value for the position of the selected tab. It returns -1 if there isn’t a selected tab.<\/p>\n Below we get the current selected tab position.<\/p>\n 7. getTabAt(int index):<\/strong><\/span> This method is used to get the tab at the specified index. This method returns TabLayout.Tab.<\/p>\n Below we get the tab at 1th index.<\/p>\n 8. getTabCount():<\/strong><\/span> This method is used to get the number of tabs currently registered with the action bar. This method returns an int type value for the number of total tabs.<\/p>\n Below we get the total number of tabs currently registered with the action bar.<\/p>\n 9. setTabGravity(int gravity):<\/strong><\/span> This method is used to set the gravity to use when laying out the tabs.<\/p>\n Below we set the gravity for the tabs.<\/p>\n 10. getTabGravity():<\/strong><\/span> This method is used to get the current gravity used for laying out tabs. This method returns the gravity which we set using setTabGravity(int gravity) method.<\/p>\n Below we firstly set the gravity and then get the current gravity used for laying out tabs.<\/p>\n 11. setTabMode(int mode):<\/strong><\/span> This method is used to set the behavior mode for the Tabs in this layout. The valid input options are:<\/p>\n MODE_FIXED:<\/strong>\u00a0 Fixed tabs display all tabs concurrently and are best used with content that benefits from quick pivots between tabs.<\/p>\n MODE_SCROLLABLE:<\/strong> Scrollable tabs display a subset of tabs at any given moment and it can contain longer tab labels and a larger number of tabs. They are best used for browsing contexts in touch interfaces when users don\u2019t need to directly compare the tab labels. This mode is commonly used with a\u00a0ViewPager.<\/p>\n Below we set the behaviour mode for the tabs.<\/p>\n 12. getTabMode():<\/strong><\/span> This method is used to get the current mode of\u00a0TabLayout. This method returns an int type value which we set using setTabMode(int mode) method.<\/p>\n Below we firstly set the tab mode and then get the current mode of the TabLayout.<\/p>\n 13. setTabTextColors(int normalColor, int selectedColor):<\/strong> <\/span>This method is used to set the text colors for the different states (normal, selected) of the tabs.<\/p>\n Below we set the tab text colors for the both states of the tab.<\/p>\n 14. getTabTextColors():<\/strong><\/span> This method is used to get the text colors for the different states (normal, selected) of the tabs. This method returns the text color which we set using setTabTextColors(int normalColor, int selectedColor) method.<\/p>\n Below we firstly set the text colors and then get the text colors for the both states of the tab.<\/p>\n 15. removeAllTabs():<\/strong><\/span> This method is used to remove all tabs from the action bar and deselect the current tab.<\/p>\n Below we remove all the tabs from the action bar and deselect the current tab.<\/p>\n 16. setOnTabSelectedListener(OnTabSelectedListener\u00a0listener):<\/strong> <\/span>This method is used to add a\u00a0 listener that will be invoked when tab selection changes.<\/p>\n Below we show how to use addOnTabSelectedListener of TabLayout.<\/p>\n 17. removeTab(Tab\u00a0tab):<\/strong> <\/span>This method is used to remove\u00a0a tab from the layout. In this method we pass the TabLayout.Tab object to remove the tab from the layout. If the removed tab was selected then it will be automatically deselected and another tab will be selected if present in the TabLayout.<\/p>\n Below we firstly create and add a tab and then remove it from the TabLayout.<\/p>\n 18. removeTabAt(int position):<\/strong><\/span> This method is used to remove a tab from the layout. In this method we pass the position of the tab that we want to remove from the layout. If the removed tab was selected then it will be automatically deselected and another tab will be selected if present in the TabLayout.<\/p>\n Below we remove the tab from a specified position of TabLayout.<\/p>\n 19. setSelectedTabIndicatorColor(int color):<\/strong><\/span> This method is used to set the tab indicator’s color for the currently selected tab.<\/p>\n Below we set the red color for the selected tab indicator.<\/p>\n 20. setSelectedTabIndicatorHeight(int height):<\/strong> <\/span>This method is used to set the tab indicator’s height for the currently selected tab.<\/p>\n Below we set the height for the selected tab\u2019s indicator.<\/p>\n 21. setupWithViewPager(ViewPager\u00a0viewPager):<\/strong><\/span> This method is used for setting up the TabLayout with ViewPager. ViewPager is mainly used for creating Sliding tabs.<\/p>\n Below we set the TabLayout with the ViewPager.<\/p>\n Now let\u2019s we discuss some common attributes of a TabLayout that helps us to configure it in our layout (xml).<\/p>\n 1. id:<\/strong> <\/span>id attribute is used to uniquely identify a TabLayout.<\/p>\n 2. support.design:tabBackground:<\/strong> <\/span>This attribute is used to set the background of the tabs. We can set a color or drawable in the background of tabs.<\/p>\n Below we set the Black color for the background of the tabs.<\/p>\n 3. support.design:tabGravity:<\/strong> <\/span>This attribute is used to set the gravity to use when laying out the tabs. We can also set gravity programmatically means in java class using setTabGravity(int gravity) method.<\/p>\n Below we set the gravity for the tabs.<\/p>\n 4. support.design:tabIndicatorColor:<\/strong> <\/span>This attribute is used to set the Color of the indicator used to show the currently selected tab. We can also set color programmatically means in java class using setSelectedTabIndicatorColor(int color) method.<\/p>\n Below we set the red color for the selected tab indicator<\/p>\n 5. support.design:tabIndicatorHeight:<\/strong><\/span> This attribute is used to set the height of the indicator used to show the currently selected tab. We can also set height programmatically means in java class using setSelectedTabIndicatorHeight(int height) method.<\/p>\n Below we set the height for the selected tab\u2019s indicator.<\/p>\n 6. support.design:tabMaxWidth:<\/strong><\/span> This attribute is used to set the maximum width for the tabs.<\/p>\n Below we set the maximum width value for the\u00a0 tabs.<\/p>\n 7. support.design:tabMinWidth:<\/strong> <\/span>This attribute is used to set the minimum width for the tabs.<\/p>\n Below we set the minimum width value for the tabs.<\/p>\n 8. support.design:tabMode:<\/strong><\/span> This attribute is used to set the behavior mode for the Tabs in this layout. We can also set the mode programmatically means in java class using setTabMode(int mode) method.<\/p>\n Below we set the behaviour mode for the tabs.<\/p>\n 9. support.design:tabPadding:<\/strong><\/span> This attribute is used to set the padding along all edges of tabs.<\/p>\n android.support.design:tabPaddingBottom:<\/strong> Set padding along the bottom edge of the tabs.<\/p>\n android.support.design:tabPaddingEnd:<\/strong> Set padding along the end edge of the tabs.<\/p>\n android.support.design:tabPaddingStart:<\/strong> Set padding along the start edge of the tabs.<\/p>\n android.support.design:tabPaddingTop:<\/strong> Set padding along the top edge of the tabs.<\/p>\n Below we set the padding along all edges of the tabs.<\/p>\n 10. support.design:tabSelectedTextColor:<\/strong><\/span> This attribute is used to set the text color to be applied to the currently selected tab. We can also set this programmatically using setTabTextColors(int normalColor, int selectedColor) method.<\/p>\n Below we set the text color for the selected tab.<\/p>\n 11. support.design:tabTextColor:<\/strong><\/span> This method is used to set the default text color to be applied to tabs. . We can also set this programmatically using setTabTextColors(int normalColor, int selectedColor) method.<\/p>\n Below we set the default text color for the tabs.<\/p>\n Example 1 of TabLayout:<\/strong><\/p>\n Below is the first example of TabLayout in which we display three non-sliding tabs. In this example we define a TabLayout and a FrameLayout in our xml file. In this example we create and add 3 tabs in the TabLayout with the help of different methods of TabLayout. After that we implement setOnTabSelectedListener event and replace the FrameLayout with the fragment\u2019s according to selected tab.<\/p>\n Download Code<\/a><\/p>\n Step 1:\u00a0<\/strong><\/span>Create a new project and name it TabLayoutExample<\/p>\n Step 2:<\/strong><\/span> Open\u00a0build.gradle\u00a0and add Design support library dependency.<\/p>\n Step 3:<\/strong><\/span> \u00a0Open res -> layout ->activity_main.xml (or) main.xml and add following code:<\/p>\n In this step we add the code for displaying TabLayout and ViewPager in our xml file.<\/p>\n Step4:<\/strong><\/span>\u00a0Open\u00a0 \u00a0src -> package -> MainActivity.java<\/p>\n In this step we open\u00a0MainActivity\u00a0and\u00a0add the code for initiate the FrameLayout and TabLayout.\u00a0 After that we create and add 3 tabs in the TabLayout. Finally\u00a0 we implement setOnTabSelectedListener event and replace the FrameLayout with the fragment\u2019s according to selected tab.<\/p>\n Step 5:<\/strong><\/span>\u00a0Now we need 3 fragments and 3 xml layouts for three tabs. So create three fragments by right click on your package folder and create classes and name them as FirstFragment, SecondFragment and ThirdFragment and add the following code respectively.<\/p>\n FirstFragment.class<\/strong><\/p>\n SecondFragment.class<\/strong><\/p>\n ThirdFragment.class<\/strong><\/p>\n Step 6:\u00a0<\/strong><\/span>\u00a0Now create 3 xml layouts by\u00a0right clicking on res\/layout -> New -> Layout Resource\u00a0File\u00a0and name them as fragment_first, fragment_second and fragment_third and add the following code in respective files.<\/p>\n Here we will design the basic simple UI for all the three tabs.<\/p>\n fragment_first.xml<\/strong><\/p>\n fragment_second.xml<\/strong><\/p>\n fragment_third.xml<\/strong><\/p>\n Below is the example of TabLayout in which we display sliding tabs with the help of ViewPager. In this example we define a TabLayout and a ViewPager in our xml file. In this example we create and add 3 tabs in the TabLayout with the help of different methods of TabLayout. After that we create a PagerAdapter to set up the TabLayout with ViewPager.<\/p>\n Download Code<\/a><\/p>\n Step 1:<\/strong><\/span>\u00a0Create a new project and name it TabLayoutExample<\/p>\n Step 2:<\/strong> <\/span>Open\u00a0build.gradle\u00a0and add Design support library dependency.<\/p>\n Step 3:<\/strong> <\/span>\u00a0Open res -> layout ->activity_main.xml (or) main.xml and add following code:<\/p>\n Step 4:<\/strong><\/span>\u00a0Open\u00a0 \u00a0src -> package -> MainActivity.java<\/p>\n In this step we open\u00a0MainActivity\u00a0and\u00a0add the code for initiate the ViewPager and TabLayout.\u00a0 After that we create and add 3 tabs in the TabLayout. Finally we set an Adapter named \u00a0PagerAdapter to set up the TabLayout with ViewPager.<\/p>\n Step 5:<\/strong><\/span> Create a new Class named PagerAdapter and extend FragmentStatePagerAdapter in the class.\u00a0In this step we create a PagerAdapter class and extends FragmentStatePagerAdapter In the class for setting the TabLayout with the ViewPager.<\/p>\n Step 6:\u00a0<\/strong><\/span>Now we need 3 fragments and 3 xml layouts for three tabs. So create three fragments by right click on your package folder and create classes and name them as FirstFragment, SecondFragment and ThirdFragment and add the following code respectively.<\/p>\n FirstFragment.class<\/strong><\/p>\n SecondFragment.class<\/strong><\/p>\n ThirdFragment.class<\/strong><\/p>\n Step 7:\u00a0\u00a0<\/strong><\/span>Now create 3 xml layouts by\u00a0right clicking on res\/layout -> New -> Layout Resource\u00a0File\u00a0and name them as fragment_first, fragment_second and fragment_third and add the following code in respective files.<\/p>\n Here we will design the basic simple UI for all the three tabs.<\/p>\n fragment_first.xml<\/strong><\/p>\n fragment_second.xml<\/strong><\/p>\n fragment_third.xml<\/strong><\/p>\n In Android TabLayout is a new element introduced in Design Support library. It \u00a0provides horizontal layout to display tabs on the screen. We can display more screens in a single\u00a0screen using tabs. We can quickly swipe between the tabs. TabLayout is basically view class required to be added into our layout(xml) for creating Sliding Tabs. … Continue reading TabLayout Tutorial With Example In Android Studio<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":47,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1,5],"tags":[],"class_list":["post-51","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-archive","category-tablayout"],"psp_head":"
\nBasic TabLayout XML Code:<\/strong><\/h4>\n
<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabMode=\"fixed\"\r\napp:tabGravity=\"fill\"\/>\r\n<\/pre>\n
\nImportant Methods Of TabLayout:<\/strong><\/h4>\n
TabLayout\u00a0\u00a0 tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\nTabLayout.Tab firstTab = tabLayout.newTab(); \/\/ Create a new Tab names\r\nfirstTab.setText(\"First Tab\"); \/\/ set the Text for the first Tab\r\nfirstTab.setIcon(R.drawable.ic_launcher); \/\/ set an icon for the first tab\r\n<\/pre>\n
TabLayout\u00a0\u00a0 tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\nTabLayout.Tab firstTab = tabLayout.newTab(); \/\/ Create a new Tab names \"First Tab\"\r\nfirstTab.setText(\"First Tab\"); \/\/ set the Text for the first Tab\r\nfirstTab.setIcon(R.drawable.ic_launcher); \/\/ set an icon for the first tab\r\ntabLayout.addTab(firstTab); \/\/ add\u00a0 the tab to the TabLayout\r\n<\/pre>\n
TabLayout\u00a0\u00a0 tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\nTabLayout.Tab firstTab = tabLayout.newTab(); \/\/ Create a new Tab names \"First Tab\"\r\nfirstTab.setText(\"First Tab\"); \/\/ set the Text for the first Tab\r\nfirstTab.setIcon(R.drawable.ic_launcher); \/\/ set an icon for the first tab\r\ntabLayout.addTab(firstTab,true); \/\/ add\u00a0 the tab in the TabLayout and makes it selectable\r\n<\/pre>\n
TabLayout\u00a0\u00a0 tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\nTabLayout.Tab firstTab = tabLayout.newTab(); \/\/ Create a new Tab names \"First Tab\"\r\nfirstTab.setText(\"First Tab\"); \/\/ set the Text for the first Tab\r\nfirstTab.setIcon(R.drawable.ic_launcher); \/\/ set an icon for the first tab\r\ntabLayout.addTab(firstTab,2); \/\/ add\u00a0 the tab in the TabLayout at specific position\r\n<\/pre>\n
TabLayout\u00a0\u00a0 tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\nTabLayout.Tab firstTab = tabLayout.newTab(); \/\/ Create a new Tab names \"First Tab\"\r\nfirstTab.setText(\"First Tab\"); \/\/ set the Text for the first Tab\r\nfirstTab.setIcon(R.drawable.ic_launcher); \/\/ set an icon for the first tab\r\ntabLayout.addTab(firstTab,2,true); \/\/ add\u00a0 the tab at specified position in the TabLayout and makes it selectable\r\n<\/pre>\n
TabLayout\u00a0\u00a0 tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\nint selectedTabPosition = tabLayout.getSelectedTabPosition(); \/\/ get the position for the current selected tab\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\nTabLayout.Tab tab = tabLayout.getTabAt(1); \/\/\u00a0 get the tab at 1th in index\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\nint tabCount= tabLayout.getTabCount(); \/\/ get the total number of tabs currently registered with the action bar.\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\ntabLayout.setTabGravity(TabLayout.GRAVITY_CENTER); \/\/ set the gravity to use when laying out the tabs.\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\ntabLayout.setTabGravity(TabLayout.GRAVITY_CENTER); \/\/ set the gravity to use when laying out the tabs.\r\nint gravity=tabLayout.getTabGravity(); \/\/ get the current gravity used for laying out tabs\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\ntabLayout.setTabMode(TabLayout.MODE_SCROLLABLE); \/\/ set the behaviour mode for the tabs\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\ntabLayout.setTabMode(TabLayout.MODE_SCROLLABLE); \/\/ set the behaviour mode for the tabs\r\nint mode=tabLayout.getTabMode(); \/\/ get the current mode of the TabLayout\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\ntabLayout.setTabTextColors(Color.RED,Color.WHITE); \/\/ set the tab text colors for the both states of the tab.\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\ntabLayout.setTabTextColors(Color.RED,Color.WHITE); \/\/ set the tab text colors for the both states of the tab.\r\nColorStateList colorStateList=tabLayout.getTabTextColors(); \/\/ get the text colors for the both states of the tab\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\ntabLayout.removeAllTabs(); \/\/ remove all the tabs from the action bar and deselect the current tab\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\ntabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {\r\n@Override\r\npublic void onTabSelected(TabLayout.Tab tab) {\r\n\/\/ called when tab selected\r\n}\r\n\r\n@Override\r\npublic void onTabUnselected(TabLayout.Tab tab) {\r\n\/\/ called when tab unselected\r\n}\r\n\r\n@Override\r\npublic void onTabReselected(TabLayout.Tab tab) {\r\n\/\/ called when a tab is reselected\r\n}\r\n});\r\n<\/pre>\nTabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\nTabLayout.Tab firstTab = tabLayout.newTab(); \/\/ Create a new Tab names \"First Tab\"\r\nfirstTab.setText(\"First Tab\"); \/\/ set the Text for the first Tab\r\nfirstTab.setIcon(R.drawable.ic_launcher); \/\/ set an icon for the first tab\r\ntabLayout.addTab(firstTab); \/\/ add\u00a0 the tab at in the TabLayout\r\ntabLayout.removeTab(firstTab); \/\/ remove the tab from the TabLayout\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\ntabLayout.removeTabAt(1); \/\/ remove the tab from a specified position of TabLayout\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\ntabLayout.setSelectedTabIndicatorColor(Color.RED); \/\/ set the red color for the selected tab indicator.\r\n<\/pre>\n
TabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\ntabLayout.setSelectedTabIndicatorHeight(2); \/\/ set the height for the selected tab\u2019s indicator\r\n<\/pre>\n
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager); \/\/ get the reference of ViewPager\r\nTabLayout tabLayout = (TabLayout) findViewById(R.id.simpleTabLayout); \/\/ get the reference of TabLayout\r\ntabLayout.setupWithViewPager(viewPager); \/\/ set the TabLayout with the ViewPager.\r\n<\/pre>\n
\nAttributes of TabLayout:<\/strong><\/h4>\n
<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabBackground=\"@android:color\/darker_gray\" \/><!-- set the Black color for the background of the tabs.-->\r\n<\/pre>\n
<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout \"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabGravity=\"fill\" \/><!-- set the gravity for the tabs.-->\r\n<\/pre>\n
<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout \"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabIndicatorColor=\"#f00\" \/><!-- set the red color for the selected tab indicator.-->\r\n<\/pre>\n
<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout \"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabIndicatorHeight=\"2dp\" \/>\r\n<!-- set the height for the selected tab\u2019s indicator -->\r\n<\/pre>\n
<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout \"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabMaxWidth=\"100dp\" \/>\r\n<!-- set the maximum width value for the\u00a0 tabs. -->\r\n<\/pre>\n
<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout \"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabMinWidth=\"50dp\" \/>\r\n<!-- set the minimum width value for the tabs\u00a0 -->\r\n<\/pre>\n
<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout \"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabMode=\"fixed\" \/>\r\n<!-- set the behaviour mode for the tabs\u00a0 -->\r\n<\/pre>\n
<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout \"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabPadding=\"5dp\" \/>\r\n<!-- set the padding along all edges of the tabs\u00a0 -->\r\n<\/pre>\n
<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout \"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabSelectedTextColor=\"#fff\" \/>\r\n<!-- set the text color for the selected tab.\u00a0 -->\r\n<\/pre>\n
<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout \"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabTextColor=\"#f00\" \/>\r\n<!-- set red as default text color for the text of tabs\u00a0 -->\r\n<\/pre>\n
\nTabLayout Example In Android Studio:<\/h4>\n
<\/p>\napply plugin: 'com.android.application'\r\n\r\nandroid {\r\ncompileSdkVersion 23\r\nbuildToolsVersion \"23.0.2\"\r\n\r\ndefaultConfig {\r\napplicationId \"com.abhiandroid.tablayoutexample\"\r\nminSdkVersion 15\r\ntargetSdkVersion 23\r\nversionCode 1\r\nversionName \"1.0\"\r\n}\r\nbuildTypes {\r\nrelease {\r\nminifyEnabled false\r\nproguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'\r\n}\r\n}\r\n}\r\n\r\ndependencies {\r\ncompile fileTree(dir: 'libs', include: ['*.jar'])\r\ncompile 'com.android.support:appcompat-v7:23.1.0'\r\ncompile 'com.android.support:design:23.1.0' \/\/ design support library\r\n}\r\n<\/pre>\n<LinearLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nxmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:orientation=\"vertical\"\r\ntools:context=\".MainActivity\">\r\n\r\n<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabBackground=\"@android:color\/darker_gray\"\r\napp:tabIndicatorColor=\"#f00\"\r\napp:tabSelectedTextColor=\"#f00\"\r\napp:tabTextColor=\"#000\" \/>\r\n\r\n<FrameLayout\r\nandroid:id=\"@+id\/simpleFrameLayout\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\" \/>\r\n\r\n<\/LinearLayout>\r\n<\/pre>\n
package com.abhiandroid.tablayoutexample;\r\n\r\nimport android.os.Bundle;\r\nimport android.support.design.widget.TabLayout;\r\nimport android.support.v4.app.Fragment;\r\nimport android.support.v4.app.FragmentManager;\r\nimport android.support.v4.app.FragmentTransaction;\r\nimport android.support.v7.app.AppCompatActivity;\r\nimport android.widget.FrameLayout;\r\n\r\npublic class MainActivity extends AppCompatActivity {\r\n\r\nFrameLayout simpleFrameLayout;\r\nTabLayout tabLayout;\r\n\r\n@Override\r\nprotected void onCreate(Bundle savedInstanceState) {\r\nsuper.onCreate(savedInstanceState);\r\nsetContentView(R.layout.activity_main);\r\n\/\/ get the reference of FrameLayout and TabLayout\r\nsimpleFrameLayout = (FrameLayout) findViewById(R.id.simpleFrameLayout);\r\ntabLayout = (TabLayout) findViewById(R.id.simpleTabLayout);\r\n\/\/ Create a new Tab named \"First\"\r\nTabLayout.Tab firstTab = tabLayout.newTab();\r\nfirstTab.setText(\"First\"); \/\/ set the Text for the first Tab\r\nfirstTab.setIcon(R.drawable.ic_launcher); \/\/ set an icon for the\r\n\/\/ first tab\r\ntabLayout.addTab(firstTab); \/\/ add\u00a0 the tab at in the TabLayout\r\n\/\/ Create a new Tab named \"Second\"\r\nTabLayout.Tab secondTab = tabLayout.newTab();\r\nsecondTab.setText(\"Second\"); \/\/ set the Text for the second Tab\r\nsecondTab.setIcon(R.drawable.ic_launcher); \/\/ set an icon for the second tab\r\ntabLayout.addTab(secondTab); \/\/ add\u00a0 the tab\u00a0 in the TabLayout\r\n\/\/ Create a new Tab named \"Third\"\r\nTabLayout.Tab thirdTab = tabLayout.newTab();\r\nthirdTab.setText(\"Third\"); \/\/ set the Text for the first Tab\r\nthirdTab.setIcon(R.drawable.ic_launcher); \/\/ set an icon for the first tab\r\ntabLayout.addTab(thirdTab); \/\/ add\u00a0 the tab at in the TabLayout\r\n\r\n\r\n\/\/ perform setOnTabSelectedListener event on TabLayout\r\ntabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {\r\n@Override\r\npublic void onTabSelected(TabLayout.Tab tab) {\r\n\/\/ get the current selected tab's position and replace the fragment accordingly\r\nFragment fragment = null;\r\nswitch (tab.getPosition()) {\r\ncase 0:\r\nfragment = new FirstFragment();\r\nbreak;\r\ncase 1:\r\nfragment = new SecondFragment();\r\nbreak;\r\ncase 2:\r\nfragment = new ThirdFragment();\r\nbreak;\r\n}\r\nFragmentManager fm = getSupportFragmentManager();\r\nFragmentTransaction ft = fm.beginTransaction();\r\nft.replace(R.id.simpleFrameLayout, fragment);\r\nft.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN);\r\nft.commit();\r\n}\r\n\r\n@Override\r\npublic void onTabUnselected(TabLayout.Tab tab) {\r\n\r\n}\r\n\r\n@Override\r\npublic void onTabReselected(TabLayout.Tab tab) {\r\n\r\n}\r\n});\r\n}\r\n}\r\n<\/pre>\npackage com.abhiandroid.tablayoutexample;\r\n\r\nimport android.os.Bundle;\r\nimport android.support.v4.app.Fragment;\r\nimport android.view.LayoutInflater;\r\nimport android.view.View;\r\nimport android.view.ViewGroup;\r\n\r\npublic class FirstFragment extends Fragment {\r\n\r\npublic FirstFragment() {\r\n\/\/ Required empty public constructor\r\n}\r\n\r\n@Override\r\npublic void onCreate(Bundle savedInstanceState) {\r\nsuper.onCreate(savedInstanceState);\r\n}\r\n\r\n@Override\r\npublic View onCreateView(LayoutInflater inflater, ViewGroup container,\r\nBundle savedInstanceState) {\r\n\/\/ Inflate the layout for this fragment\r\nreturn inflater.inflate(R.layout.fragment_first, container, false);\r\n}\r\n\r\n}\r\n<\/pre>\npackage com.abhiandroid.tablayoutexample;\r\n\r\nimport android.os.Bundle;\r\nimport android.support.v4.app.Fragment;\r\nimport android.view.LayoutInflater;\r\nimport android.view.View;\r\nimport android.view.ViewGroup;\r\n\r\npublic class SecondFragment extends Fragment {\r\n\r\npublic SecondFragment() {\r\n\/\/ Required empty public constructor\r\n}\r\n\r\n@Override\r\npublic void onCreate(Bundle savedInstanceState) {\r\nsuper.onCreate(savedInstanceState);\r\n}\r\n\r\n@Override\r\npublic View onCreateView(LayoutInflater inflater, ViewGroup container,\r\nBundle savedInstanceState) {\r\n\/\/ Inflate the layout for this fragment\r\nreturn inflater.inflate(R.layout.fragment_second, container, false);\r\n}\r\n\r\n}\r\n<\/pre>\npackage com.abhiandroid.tablayoutexample;\r\n\r\nimport android.os.Bundle;\r\nimport android.support.v4.app.Fragment;\r\nimport android.view.LayoutInflater;\r\nimport android.view.View;\r\nimport android.view.ViewGroup;\r\n\r\npublic class ThirdFragment extends Fragment {\r\n\r\npublic ThirdFragment() {\r\n\/\/ Required empty public constructor\r\n}\r\n\r\n@Override\r\npublic void onCreate(Bundle savedInstanceState) {\r\nsuper.onCreate(savedInstanceState);\r\n}\r\n\r\n@Override\r\npublic View onCreateView(LayoutInflater inflater, ViewGroup container,\r\nBundle savedInstanceState) {\r\n\/\/ Inflate the layout for this fragment\r\nreturn inflater.inflate(R.layout.fragment_third, container, false);\r\n}\r\n\r\n}\r\n<\/pre>\n<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\ntools:context=\"info.androidhive.materialtabs.fragments.OneFragment\">\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:text=\"First Fragment\"\r\nandroid:textSize=\"40dp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/RelativeLayout>\r\n<\/pre>\n
<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\ntools:context=\"info.androidhive.materialtabs.fragments.OneFragment\">\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:text=\"Second Fragment\"\r\nandroid:textSize=\"40dp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/RelativeLayout>\r\n<\/pre>\n
<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\ntools:context=\"info.androidhive.materialtabs.fragments.OneFragment\">\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:text=\"Third Fragment\"\r\nandroid:textSize=\"40dp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/RelativeLayout>\r\n<\/pre>\n
\nExample 2 of TabLayout Using ViewPager:<\/strong><\/h4>\n
<\/p>\napply plugin: 'com.android.application'\r\n\r\nandroid {\r\ncompileSdkVersion 23\r\nbuildToolsVersion \"23.0.2\"\r\n\r\ndefaultConfig {\r\napplicationId \"com.abhiandroid.tablayoutexample\"\r\nminSdkVersion 15\r\ntargetSdkVersion 23\r\nversionCode 1\r\nversionName \"1.0\"\r\n}\r\nbuildTypes {\r\nrelease {\r\nminifyEnabled false\r\nproguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'\r\n}\r\n}\r\n}\r\n\r\ndependencies {\r\ncompile fileTree(dir: 'libs', include: ['*.jar'])\r\ncompile 'com.android.support:appcompat-v7:23.1.0'\r\ncompile 'com.android.support:design:23.1.0' \/\/ design support library\r\n}\r\n<\/pre>\n<LinearLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nxmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:orientation=\"vertical\"\r\ntools:context=\".MainActivity\">\r\n\r\n<android.support.design.widget.TabLayout\r\nandroid:id=\"@+id\/simpleTabLayout\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\napp:tabBackground=\"@android:color\/darker_gray\"\r\napp:tabIndicatorColor=\"#f00\"\r\napp:tabSelectedTextColor=\"#f00\"\r\napp:tabTextColor=\"#000\" \/>\r\n\r\n\r\n<android.support.v4.view.ViewPager\r\nandroid:id=\"@+id\/simpleViewPager\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\napp:layout_behavior=\"@string\/appbar_scrolling_view_behavior\" \/>\r\n<\/LinearLayout>\r\n<\/pre>\n
package com.abhiandroid.tablayoutexample;\r\n\r\nimport android.os.Bundle;\r\nimport android.support.design.widget.TabLayout;\r\nimport android.support.v4.view.ViewPager;\r\nimport android.support.v7.app.AppCompatActivity;\r\n\r\npublic class MainActivity extends AppCompatActivity {\r\n\r\nViewPager simpleViewPager;\r\nTabLayout tabLayout;\r\n\r\n@Override\r\nprotected void onCreate(Bundle savedInstanceState) {\r\nsuper.onCreate(savedInstanceState);\r\nsetContentView(R.layout.activity_main);\r\n\/\/ get the reference of ViewPager and TabLayout\r\nsimpleViewPager = (ViewPager) findViewById(R.id.simpleViewPager);\r\ntabLayout = (TabLayout) findViewById(R.id.simpleTabLayout);\r\n\/\/ Create a new Tab named \"First\"\r\nTabLayout.Tab firstTab = tabLayout.newTab();\r\nfirstTab.setText(\"First\"); \/\/ set the Text for the first Tab\r\nfirstTab.setIcon(R.drawable.ic_launcher); \/\/ set an icon for the\r\n\/\/ first tab\r\ntabLayout.addTab(firstTab); \/\/ add\u00a0 the tab at in the TabLayout\r\n\/\/ Create a new Tab named \"Second\"\r\nTabLayout.Tab secondTab = tabLayout.newTab();\r\nsecondTab.setText(\"Second\"); \/\/ set the Text for the second Tab\r\nsecondTab.setIcon(R.drawable.ic_launcher); \/\/ set an icon for the second tab\r\ntabLayout.addTab(secondTab); \/\/ add\u00a0 the tab\u00a0 in the TabLayout\r\n\/\/ Create a new Tab named \"Third\"\r\nTabLayout.Tab thirdTab = tabLayout.newTab();\r\nthirdTab.setText(\"Third\"); \/\/ set the Text for the first Tab\r\nthirdTab.setIcon(R.drawable.ic_launcher); \/\/ set an icon for the first tab\r\ntabLayout.addTab(thirdTab); \/\/ add\u00a0 the tab at in the TabLayout\r\n\r\nPagerAdapter adapter = new PagerAdapter\r\n(getSupportFragmentManager(), tabLayout.getTabCount());\r\nsimpleViewPager.setAdapter(adapter);\r\n\/\/ addOnPageChangeListener event change the tab on slide\r\nsimpleViewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));\r\n}\r\n}\r\n<\/pre>\npackage com.abhiandroid.tablayoutexample;\r\n\r\nimport android.support.v4.app.Fragment;\r\nimport android.support.v4.app.FragmentManager;\r\nimport android.support.v4.app.FragmentStatePagerAdapter;\r\n\r\npublic class PagerAdapter extends FragmentStatePagerAdapter {\r\nint mNumOfTabs;\r\n\r\npublic PagerAdapter(FragmentManager fm, int NumOfTabs) {\r\nsuper(fm);\r\nthis.mNumOfTabs = NumOfTabs;\r\n}\r\n\r\n@Override\r\npublic Fragment getItem(int position) {\r\n\r\nswitch (position) {\r\ncase 0:\r\nFirstFragment tab1 = new FirstFragment();\r\nreturn tab1;\r\ncase 1:\r\nSecondFragment tab2 = new SecondFragment();\r\nreturn tab2;\r\ncase 2:\r\nThirdFragment tab3 = new ThirdFragment();\r\nreturn tab3;\r\ndefault:\r\nreturn null;\r\n}\r\n}\r\n\r\n@Override\r\npublic int getCount() {\r\nreturn mNumOfTabs;\r\n}\r\n}\r\n<\/pre>\npackage com.abhiandroid.tablayoutexample;\r\n\r\nimport android.os.Bundle;\r\nimport android.support.v4.app.Fragment;\r\nimport android.view.LayoutInflater;\r\nimport android.view.View;\r\nimport android.view.ViewGroup;\r\n\r\npublic class FirstFragment extends Fragment {\r\n\r\npublic FirstFragment() {\r\n\/\/ Required empty public constructor\r\n}\r\n\r\n@Override\r\npublic void onCreate(Bundle savedInstanceState) {\r\nsuper.onCreate(savedInstanceState);\r\n}\r\n\r\n@Override\r\npublic View onCreateView(LayoutInflater inflater, ViewGroup container,\r\nBundle savedInstanceState) {\r\n\/\/ Inflate the layout for this fragment\r\nreturn inflater.inflate(R.layout.fragment_first, container, false);\r\n}\r\n\r\n}\r\n<\/pre>\npackage com.abhiandroid.tablayoutexample;\r\n\r\nimport android.os.Bundle;\r\nimport android.support.v4.app.Fragment;\r\nimport android.view.LayoutInflater;\r\nimport android.view.View;\r\nimport android.view.ViewGroup;\r\n\r\npublic class SecondFragment extends Fragment {\r\n\r\npublic SecondFragment() {\r\n\/\/ Required empty public constructor\r\n}\r\n\r\n@Override\r\npublic void onCreate(Bundle savedInstanceState) {\r\nsuper.onCreate(savedInstanceState);\r\n}\r\n\r\n@Override\r\npublic View onCreateView(LayoutInflater inflater, ViewGroup container,\r\nBundle savedInstanceState) {\r\n\/\/ Inflate the layout for this fragment\r\nreturn inflater.inflate(R.layout.fragment_second, container, false);\r\n}\r\n\r\n}\r\n<\/pre>\npackage com.abhiandroid.tablayoutexample;\r\n\r\nimport android.os.Bundle;\r\nimport android.support.v4.app.Fragment;\r\nimport android.view.LayoutInflater;\r\nimport android.view.View;\r\nimport android.view.ViewGroup;\r\n\r\npublic class ThirdFragment extends Fragment {\r\n\r\npublic ThirdFragment() {\r\n\/\/ Required empty public constructor\r\n}\r\n\r\n@Override\r\npublic void onCreate(Bundle savedInstanceState) {\r\nsuper.onCreate(savedInstanceState);\r\n}\r\n\r\n@Override\r\npublic View onCreateView(LayoutInflater inflater, ViewGroup container,\r\nBundle savedInstanceState) {\r\n\/\/ Inflate the layout for this fragment\r\nreturn inflater.inflate(R.layout.fragment_third, container, false);\r\n}\r\n\r\n}\r\n<\/pre>\n<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\ntools:context=\"info.androidhive.materialtabs.fragments.OneFragment\">\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:text=\"First Fragment\"\r\nandroid:textSize=\"40dp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/RelativeLayout>\r\n<\/pre>\n
<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\ntools:context=\"info.androidhive.materialtabs.fragments.OneFragment\">\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:text=\"Second Fragment\"\r\nandroid:textSize=\"40dp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/RelativeLayout>\r\n<\/pre>\n
<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\ntools:context=\"info.androidhive.materialtabs.fragments.OneFragment\">\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:text=\"Third Fragment\"\r\nandroid:textSize=\"40dp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/RelativeLayout><\/pre>\n","protected":false},"excerpt":{"rendered":"