Tabs page

fsonmez · Apr 11, 2015 · ecfd900 · ecfd900
1 parent 62f3ee9
commit ecfd900
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 0 deletions.
diff --git a/www/js/app.js b/www/js/app.js
@@ -71,6 +71,16 @@ angular.module('wpIonic', ['ionic', 'wpIonic.controllers', 'wpIonic.services', '
     }
   })
 
+  .state('app.tabs', {
+    url: "/tabs",
+    views: {
+      'menuContent': {
+        templateUrl: "templates/tabs.html",
+        controller: 'TabsCtrl'
+      }
+    }
+  })
+
   .state('app.settings', {
       url: "/settings",
       views: {

diff --git a/www/js/controllers.js b/www/js/controllers.js
@@ -199,4 +199,10 @@ angular.module('wpIonic.controllers', [])
     $scope.slideIndex = index;
   };
 
+})
+
+.controller('TabsCtrl', function($scope) {
+
+  // Tabs stuff here
+
 });
diff --git a/www/templates/menu.html b/www/templates/menu.html
@@ -24,6 +24,9 @@
         <ion-item nav-clear menu-close href="#/app/posts">
           Posts
         </ion-item>
+        <ion-item nav-clear menu-close href="#/app/tabs">
+          Tabs
+        </ion-item>
         <ion-item nav-clear menu-close href="#/app/settings">
           Settings
         </ion-item>

diff --git a/www/templates/tabs.html b/www/templates/tabs.html
@@ -0,0 +1,27 @@
+<ion-view title="Tabs">
+
+	<ion-tabs tabs-type="tabs-icon-only">
+	    <ion-tab title="Home" icon-on="ion-ios-home" icon-off="ion-ios-home-outline">
+	        <ion-content has-header="true" padding="true">
+	        	<p>&nbsp;</p><!--- extra p tag is a hack, not sure why has-header isn't working -->
+	            <h2>Welcome Home</h2>
+	        </ion-content>
+	    </ion-tab>
+
+	    <ion-tab title="Camera" icon-on="ion-ios-camera" icon-off="ion-ios-camera-outline">
+	        <ion-content has-header="true" padding="true">
+	        	<p>&nbsp;</p><!--- extra p tag is a hack, not sure why has-header isn't working -->
+	            <h2>Take a picture</h2>
+	        </ion-content>
+	    </ion-tab>
+
+	    <ion-tab title="Books" icon-on="ion-ios-book" icon-off="ion-ios-book-outline">
+	        <ion-content has-header="true" padding="true">
+	        	<p>&nbsp;</p><!--- extra p tag is a hack, not sure why has-header isn't working -->
+	            <h2>Reading is good for you</h2>
+	        </ion-content>
+	    </ion-tab>
+
+	</ion-tabs>
+
+</ion-view>