<commit_before>---
layout: post
title: Material Tabs Revisited
comments: true
---
This isn't a detailed tutorial on how to implement material tabs but just a quick revisit on'em. 
I assume you've created your project and everything is well set. Head over <a href="http://www.materialpalette.com/">Materialpallte</a> for awesome color choices and download an xml type of colors.

</p>
<p>With Toolbar aboard in replacement of ActionBar, lets start by adding it to our new layout. roughly that would translate to something like this.</p>
<img src="public/images/toolbar.png"  height="400px" width="900px">
<img src="public/images/tabs.png" height="700px" width="350px">
<b>Then came material tabs</b>
For my lazy fellas we gotta head over to our browsers for two major classes, Mr. <code>SlidingTabLayout.java</code> and Mrs.<code>SlidingTabStrip.java</code>.
I like to get mine from Google IO app <a href="https://github.com/google/iosched/tree/master/android/src/main/java/com/google/samples/apps/iosched/ui/widget">Here</a> but you can also get them elsewhere. There is no rule that you should get them from somewhere but my laziness tells me so. 
Their names are self explanatory so lets see what happens under the hood.
<p>With no error nearby, head over to <code>xml</code> and add some lines
first, add SlidingTabLayout just below <code>Toolbar</code>. snippet for SlidingTablayout goes like this
<p>
<code>&lt;android.aaron.com.material.tabs.SlidingTabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/primary"&gt;
  &lt;/android.aaron.com.material.tabs.SlidingTabLayout&gt;</code>
	</p>


but watch out for the package name in <code>android.aaron.com.material.tabs.SlidingTabLayout</code>. Make sure you replace it with your package.

Now add <code>Viewpager</code> below them. Something like
<p>
<code> &lt;android.support.v4.view.ViewPager
                android:id="@+id/pager"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_alignParentTop="true"&gt;
            &lt;/android.support.v4.view.ViewPager&gt;</code>
            </p>
</p><commit_msg>fix image bug<commit_after>---
layout: post
title: Material Tabs Revisited
comments: true
---
This isn't a detailed tutorial on how to implement material tabs but just a quick revisit on'em. 
I assume you've created your project and everything is well set. Head over <a href="http://www.materialpalette.com/">Materialpallte</a> for awesome color choices and download an xml type of colors.

</p>
<p>With Toolbar aboard in replacement of ActionBar, lets start by adding it to our new layout. roughly that would translate to something like this.</p>
<img src="public/images/toolbar.png"  height="400px" width="900px">
<img src="public/images/toolbar.png" height="700px" width="350px">
<b>Then came material tabs</b>
For my lazy fellas we gotta head over to our browsers for two major classes, Mr. <code>SlidingTabLayout.java</code> and Mrs.<code>SlidingTabStrip.java</code>.
I like to get mine from Google IO app <a href="https://github.com/google/iosched/tree/master/android/src/main/java/com/google/samples/apps/iosched/ui/widget">Here</a> but you can also get them elsewhere. There is no rule that you should get them from somewhere but my laziness tells me so. 
Their names are self explanatory so lets see what happens under the hood.
<p>With no error nearby, head over to <code>xml</code> and add some lines
first, add SlidingTabLayout just below <code>Toolbar</code>. snippet for SlidingTablayout goes like this
<p>
<code>&lt;android.aaron.com.material.tabs.SlidingTabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/primary"&gt;
  &lt;/android.aaron.com.material.tabs.SlidingTabLayout&gt;</code>
	</p>


but watch out for the package name in <code>android.aaron.com.material.tabs.SlidingTabLayout</code>. Make sure you replace it with your package.

Now add <code>Viewpager</code> below them. Something like
<p>
<code> &lt;android.support.v4.view.ViewPager
                android:id="@+id/pager"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_alignParentTop="true"&gt;
            &lt;/android.support.v4.view.ViewPager&gt;</code>
            </p>
</p>
{'fraction_non_alphanumeric': 0.11162381894089211, 'fraction_numerical': 0.0061524939573720065, 'mean_word_length': 3.8893662728249194, 'pattern_counts': {'":': 0, '<': 69, '<?xml version=': 0, '>': 69, 'https://': 2, 'lorem ipsum': 0, 'www.': 2, 'xml': 4}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3621012', 'n_tokens_mistral': 1372, 'n_tokens_neox': 1321, 'n_words': 447}