Learn how to create mobile apps using NativeScript for Angular.
We can run our app in the iOS Simulator using the
tns command line utilities. Also learn how to target specific simulator devices and versions. You must have a Mac to develop apps for iOS. Ensure you have XCode installed via the Mac App Store, and ensure you have opened it at least once to agree to the terms and install the additional components it may prompt about.
We can run our app in an Android emulator using GenyMotion, which provides flexible options and great performance. Let’s learn how to set one up and run our app in it. First install the Android SDK by installing Android Studio here: https://developer.android.com/studio/index.html. Then register for a GenyMotion account here: https://www.genymotion.com/account/create/. Once created and logged in, you will see a ‘Download’ button in the header where you can download the free tools.
This is the fundamental building block for native views. Let’s understand the syntax and some of the options available to us to construct our views starting with Layout Containers. StackLayout and GridLayout containers are the most commonly used. Also learn about helpful snippets for a few popular IDE’s.
Let’s learn how to style those native views with CSS and understand a few things that are unique to the native platforms regarding styling. A good majority of standard web CSS properties are supported with the addition of a few like
horizontal-align that are unique to native platforms.
The default core theme comes preinstalled and ready to go with every new project. Learn how to use some of the many helpful utility classes that are provided like common
btn classes for Buttons,
h2, etc. Label classes and convenient
m-10 (shorthand margin/padding) classes ranging from 0 - 30. You can learn all about the rich options you get here: http://docs.nativescript.org/ui/theme
Let’s build a new Angular component and use NativeScript for Angular’s ModalDialogService to open it in a native modal. We will also look at special considerations with handling the close action in addition to passing data between the modal and the caller.