All Projects → shripalsoni04 → Nativescript Angular Drawer Template

shripalsoni04 / Nativescript Angular Drawer Template

Licence: mit
A starter project to quickly create nativescript angular project with drawer pages.

Programming Languages

typescript
32286 projects

Projects that are alternatives of or similar to Nativescript Angular Drawer Template

Nativescript
NativeScript empowers you to access native platform APIs from JavaScript directly. Angular, Capacitor, Ionic, React, Svelte, Vue and you name it compatible.
Stars: ✭ 20,730 (+44965.22%)
Mutual labels:  nativescript
Nativescript Flappy Bird
NativeScript implementation of Flappy Bird (basic). Demonstrates how to build games in NativeScript.
Stars: ✭ 31 (-32.61%)
Mutual labels:  nativescript
Duo Navigation Drawer
A flexible, easy to use, unique drawer library for your Android project.
Stars: ✭ 986 (+2043.48%)
Mutual labels:  drawerlayout
Xpopup
🔥XPopup2.0版本重磅来袭,2倍以上性能提升,带来可观的动画性能优化和交互细节的提升!!!功能强大,交互优雅,动画丝滑的通用弹窗!可以替代Dialog,PopupWindow,PopupMenu,BottomSheet,DrawerLayout,Spinner等组件,自带十几种效果良好的动画, 支持完全的UI和动画自定义!(Powerful and Beautiful Popup for Android,can absolutely replace Dialog,PopupWindow,PopupMenu,BottomSheet,DrawerLayout,Spinner. With built-in animators , very easy to custom popup v…
Stars: ✭ 6,106 (+13173.91%)
Mutual labels:  drawerlayout
Nativescript Headset Detection
Detect when a headphone (jack or bluetooth) is (dis)connected.
Stars: ✭ 11 (-76.09%)
Mutual labels:  nativescript
Nativescript Keyframes
Facebook Keyframes plugin - if CSS animations don't cut it for ya
Stars: ✭ 32 (-30.43%)
Mutual labels:  nativescript
Android Runtime
Android runtime for NativeScript (based on V8)
Stars: ✭ 399 (+767.39%)
Mutual labels:  nativescript
Https
Secure HTTP client with SSL pinning for Nativescript - iOS/Android
Stars: ✭ 45 (-2.17%)
Mutual labels:  nativescript
Shoutoutplay
The mobile app that allows you to create and record personal dedications using your favorite music playlists for corporate events, parties, weddings and get togethers.
Stars: ✭ 28 (-39.13%)
Mutual labels:  nativescript
Ns Vue Radio
A native white-label application built with NativeScript-Vue for community radios
Stars: ✭ 36 (-21.74%)
Mutual labels:  nativescript
Nativescript Particle
🕹 Control your https://particle.io devices from NativeScript
Stars: ✭ 19 (-58.7%)
Mutual labels:  nativescript
Nativescript Paystack
Nativescript integration for Paystack payment platform
Stars: ✭ 10 (-78.26%)
Mutual labels:  nativescript
Nativescript Cli
Command-line interface for building NativeScript apps
Stars: ✭ 977 (+2023.91%)
Mutual labels:  nativescript
Nativescript Vue
Native mobile applications using Vue and NativeScript.
Stars: ✭ 4,784 (+10300%)
Mutual labels:  nativescript
House
Proof of Concept and Research repository.
Stars: ✭ 37 (-19.57%)
Mutual labels:  nativescript
Docs
Documentation, API reference, and code snippets for NativeScript
Stars: ✭ 442 (+860.87%)
Mutual labels:  nativescript
Nativescript Azure Mobile Apps
☁️ NativeScript plugin for working with Microsoft Azure Mobile Apps services
Stars: ✭ 31 (-32.61%)
Mutual labels:  nativescript
Nativescript Email
✉️ NativeScript plugin for opening draft e-mails
Stars: ✭ 45 (-2.17%)
Mutual labels:  nativescript
Nativescript Plugin Firebase
🔥 NativeScript plugin for Firebase
Stars: ✭ 990 (+2052.17%)
Mutual labels:  nativescript
Nativescript Image Swipe
A NativeScript widget to easily 👆 and 🔍 through a list of images
Stars: ✭ 35 (-23.91%)
Mutual labels:  nativescript

Nativescript-Angular-Drawer-Template

A starter template to quickly create nativescript angular projects with drawer pages.

Usage

tns create my-project-name --template nativescript-angular-drawer-template

Preview

Android

android-preview

iOS

ios-preview

How To Change Menu Items

You can change the menu items of drawer from app/modules/shared/side-drawer-page/side-drawer-page.component.ts file as shown below:

navMenu: any[] = [
    { name: 'Home', commands: ['/'] },
    { name: 'About', commands: ['/about'] },
    { name: 'Contact', commands: ['/contact'] }
];

How To Create New Page

You just need to wrap the content template of the new page inside <side-drawer-page> tag as shown below:

<side-drawer-page>
    <GridLayout>
        <Label text="Hello World"></Label>
    </GridLayout>
</side-drawer-page>

You can refer home, contact or about sample modules for reference.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].