add onselectedIndexChanged to trigger changes when tab selected.

Author: jcassidyav

demo-ng/src/app.css

@@ -1,2 +1,8 @@
 @import '@nativescript/theme/css/core.css';
 @import '@nativescript/theme/css/default.css';
+
+MDTabStrip {
+    selected-item-color: #FFFFFF;
+    un-selected-item-color: #404040;
+    highlight-color: #4CFFFF;
+}

demo-ng/src/app/examples/tabs/tabs.component.html

@@ -1,6 +1,6 @@
 <MDTabs selectedIndex="1">
   <!-- The bottom tab UI is created via MDTabStrip (the containier) and MDTabStripItem (for each tab)-->
-  <MDTabStrip>
+  <MDTabStrip >
     <MDTabStripItem>
       <Label text="Home"></Label>
       <Image src="res://ic_home"></Image>

src/tabs/tabs.android.ts

@@ -37,6 +37,9 @@ function getTabById(id: number): Tabs {
 
     return ref && ref.get();
 }
+interface PositionChanger {
+    onSelectedPositionChange(position: number, prevPosition: number);
+}
 
 function initializeNativeClasses() {
     if (PagerAdapter) {
@@ -282,7 +285,7 @@ function initializeNativeClasses() {
     }
 
     @NativeClass
-    class TabsBarImplementation extends com.nativescript.material.core.TabsBar {
+    class TabsBarImplementation extends com.nativescript.material.core.TabsBar implements PositionChanger {
         constructor(context: android.content.Context, public owner: Tabs) {
             super(context);
 
@@ -477,6 +480,11 @@ export class Tabs extends TabsBase {
 
         return nativeView;
     }
+    onSelectedIndexChanged(oldIndex: number, newIndex:number) {
+        const tabBarImplementation = (this._tabsBar as unknown ) as PositionChanger;
+        tabBarImplementation.onSelectedPositionChange(oldIndex, newIndex);
+        super.onSelectedIndexChanged(oldIndex, newIndex);
+    }
 
     public initNativeView(): void {
         super.initNativeView();