- Mobile Angular UI Tutorial
- Mobile Angular UI - Home
- Mobile Angular UI - Overview
- Mobile Angular UI - Installation
- Mobile Angular UI - Project Setup
- Mobile Angular UI - My First App
- Mobile Angular UI - Layouts
- Mobile Angular UI - Components
- Mobile Angular UI - Dropdowns
- Mobile Angular UI - Accordions
- Mobile Angular UI - Tabs
- Mobile Angular UI - Drag and Drop
- Mobile Angular UI - Scrollable Areas
- Mobile Angular UI - Forms
- Mobile Angular UI - Swipe Gestures
- Mobile Angular UI - Toggle Switch
- Mobile Angular UI - Sections
- Mobile Angular UI - Core Details
- Mobile Angular UI - Touch Events
- Mobile Angular UI - PhoneGap & Cordova
- Mobile Angular UI - Creating APK File
- Mobile Angular UI - APP Development
- Mobile Angular UI - Examples
- Mobile Angular UI Resources
- Mobile Angular UI - Quick Guide
- Mobile Angular UI - Useful Resources
- Mobile Angular UI - Discussion
Mobile Angular UI - Overview
Mobile Angular UI is an open-source framework for developing hybrid mobile apps. Mobile Angular UI makes use of Twitter Bootstrap and AngularJS that helps to create attractive HTML5 hybrid mobile and desktop apps.
Features of Mobile Angular UI
Mobile Angular UI has some cool components that are listed below −
Navbars − Navbars makes use of the top and bottom portion of the device screen. We can use the top navbar to display the menu items or the header section. The bottom navbar can be used to display the footer section.
Scrollable Areas − This feature makes the app more user friendly. Adding css classes .scrollable-header/.scrollable-footer, will add fixed header/footer to the scrollable area you want. You don’t have to take any trouble about the height and positioning, the css will take care of everything.
Accordion − Accordions are mostly used when the content is supposed to be in section type of view and any, one section is visible at a time. You can hide and open the next section to view the contents in it.
Dropdowns − To work with dropdowns adding the css .dropdown-menu to the container serves the purpose.
Modals and Overlays − Modals and Overlays will show a pop-up type window on your screen. Overlays differ from modal only in how the container is displayed for it.
Sections − Sections are containers that are displayed inside the body. You can modify the layout of your display in the device with classes available with sections. You can make use of the classes like .section-default, .section-primary, .section-success, .section-info, .section-warning or .section-danger to change the layout.
Sidebars − The sidebars occupy the left and right side of the screen. They are always hidden and activated when the item connected to the left side or right side is clicked. It is the best way to utilize the space on the screen.
Toggle Switch − Mobile Angular UI offers toggle switch elements using the ui-switch directive. The ui-switch directive makes a toggle when applied on to a boolean ngModel value.
Tabs − Tabs are useful components available in angular mobile ui.Tabs are available in the same wrapper and show your contents in separate pane just like how the tabs are opened in the browser. Only one tab is displayed to the user at a time.
Advantages of Mobile Angular UI
The following are the advantages of Mobile Angular UI −
Mobile Angular UI provides cool UI mobile components like navbar, sidebars, modals and overlays, switches, etc.
Easy to create hybrid apps as it makes use of AngularJS and Twitter Bootstrap that is very easy to learn and get started. Also, it’s a free open source framework.
It is possible to use ionic components along with Mobile Angular UI components.
Disadvantages of Mobile Angular UI
The following are the disadvantages of Mobile Angular UI −
As the AngularJS directives are added to the HTML markup debugging becomes a little difficult when the error comes up.
Kickstart Your Career
Get certified by completing the courseGet Started