Development Tip: Managing Device Contacts with an Appery.io Plug-in

icon-contactsBy using the Appery.io Contacts plug-in, you can conveniently manage contacts on a user’s device. The plug-in is based on the Cordova API and can be imported into your Appery.io app like any other plug-in. Just click CREATE NEW > From plugin, select Apperyio Contacts Service and click “Import selected plugins.” There is a set of services you can use to perform the operations, such as find, remove, create, edit and more.

We’ve also prepared a detailed tutorial on how to use this plug-in, as well as a simple demo app (you can create it from the attached backup), that allows you to find, create and save contacts. Find it here.

Make sure to check out all of our mobile development tips.

Do you want to build apps fast? Start developing with our trial plan!

Mobile Tip: Dynamic REST API URLs in AngularJS Apps

dynamic_urls

Dynamic URLs are very common in any mobile app. When building AngularJS apps with Appery.io there are few ways to make parts of the URL (or even the entire URL) dynamic. We’ll use this URL for our example: http://mywebsite.com/name/{id}/edit , where the {id} part should be dynamic.

  1. First of all, you can use the Settings service to perform dynamic substitutions:
    1.  Create a new Settings service (if you don’t have one yet) by going to CREATE NEW > Service > Settings (REST settings).
    2. Then, create a new id parameter in the newly-created Settings and provide a value for it.
    3. Now, go to your REST service, and change the dynamic part of your URL to {MySettings.id} where MySettings is the settings service name, and id is the name of the parameter. Your URL should look like:           http://mywebsite.com/name/{MySettings.id}/edit
  2. Alternatively, you can create request parameters directly in the REST service. They will be automatically substituted if names coincide. You can use this approach if you need visual Mapping for dynamic parameters:
    1. Go to your REST service Request > Query String.
    2. Create the new id parameter and provide a value for it.
    3. Change the REST service URL to http://mywebsite.com/name/{id}/edit.
    4. Because the value of the id parameter will be automatically inserted to the {id} placeholder, it won’t be added to the end of the URL as a query string.

Read more about the REST and Settings services in AngularJS.

Make sure to check out all of our mobile development tips.

Do you want to build apps fast? Start developing with our trial plan!

Mobile Dev. Tip: Simplify UI Building with Outline View

outline_view

Outline view

When building complex UI for your mobile app, it can become difficult to quickly select needed components. It can be even more complicated if there are many levels of nested components. A Grid component, for example, contains rows and columns, while each cell contains Buttons, Images and HTML. Some cells can even contain another Grid. By using OUTLINE view you can see the UI structure in simple hierarchical way. You can open or hide OUTLINE view by clicking the button to the bottom of the screen, nearby the components palette.

Make sure to check out all of our mobile development tips.

Do you want to build apps fast? Start developing with our trial plan!

Mobile Dev. Tip: Conveniently Manage Dependencies in Your Mobile App

dependency_manager

Appery.io Dependency Manager

Another great built-in Appery.io tool is the powerful Dependency Manager. It can be used to add new dependencies to your app, manage the asset loading order, add initial logic for dependencies, and much more. You can load resources any time it is required in the project (not only while loading the app). This can be configured in a simple, visual way with the Dependency Manager.

Make sure to check out all of our mobile development tips.

Do you want to build apps fast? Start developing with our free plan.

Mobile Dev. Tip: Quickly Map Data Between Services and UI Using Visual Mapping and Binding Editor in AngularJS Apps

apperyio_binding

There are two powerful and convenient ways to use data flow management in Appery.io: Mapping and Binding.

Mapping

When a REST service is invoked, it usually requires input data. In most mobile apps, the data comes from the page (user-entered) or from storage (previously saved). When the service is invoked, it returns the data you want for further actions with it. This is when Mapping comes really handy — you can map input and output data via a simple and intuitive drag&drop system. You can also modify the incoming and outgoing data on-the-fly by adding custom JavaScript to a needed element.

Binding

AngularJS apps support automatic data synchronization between the model and view components. When the model changes, the view reflects the change, and vice versa. It’s called data-binding. Appery.io provides Binding — the visual tool for managing the connections between UI components and scope. By going to the BINDING tab you can see an overview, and add or remove connections via the simple drag&drop system.

Make sure to check out all of our mobile development tips.

Do you want to build apps fast? Start developing with our free plan.

Mobile Dev. Tip: Geolocation Plug-in for AngularJS Apps

geolocation-plugin

Geolocation functionality is one of the most popular features in mobile development. In Appery.io, a geolocation plug-in is available out-of-the box and can be configured in minutes to use in your mobile app. Recently, we’ve updated the geolocation plug-in for AngularJS apps (both Ionic and Bootstrap) and now it is even more intuitive and faster to use. In the geolocation plug-in docs you can find out how to add the plug-in to your Appery.io app, so you can retrieve the current position and start\stop watching position.

Make sure to check out all our mobile development tips.

Do you want to build apps fast? Start developing with our free plan.

Mobile Dev. Tip: Update Apps without Going through the App Store

apperyio_app_auto_update

Appery.io recently announced another great feature that significantly simplifies app versions publishing. By using the AutoUpdate feature, you can make changes to the published app without submitting it to app stores. Go to EXPORT > Auto update after you’ve made changes, and Appery.io will generate a bundle with the updated resources. Apps installed on devices will automatically download the updated bundle, so users don’t need to do anything for the update. You can read more about the AutoUpdate feature in our documentation.

Make sure to check out all our mobile development tips.

Do you want to build apps fast? Start developing with our free plan.

Mobile Dev. Tip: How to Use a Custom Sound for Push Notifications

placeit

Would it be nice to have unique push notification sounds for your app? When you have a unique sound, users can quickly differentiate it from other notifications. Adding custom sound is really easy with Appery.io – upload a custom sound file to your Appery.io app and then specify its name on the push notifications page. Currently, the feature is available for iOS apps only. You can find more about the custom sounds and a lot of other useful information on push notifications in our documentation.

Check all the mobile development tips.

Do you want to build apps fast? Start developing with our free plan.

Tip: Keep Data in One Place to Use Anywhere in Your App

Icon for a tipAre you looking for a convenient place to keep data that may be accessed from any screen of your app? Appery.io has you covered. Use the Settings Service to keep any data you need to quickly access from anywhere in your app. The Settings Service has its own API. so it’s easy to manage programmatically. Use it for static values such as URLs and IDs and for dynamic values such as device language or dates. But, beware of keeping sensitive information there such as session tokens.

Tell me more.

For more tips…

Tip: Make HTML Do New Tricks with AngularJS Directives

Icon for a tip AngularJS provides many useful tools for easy app development, including the concept of directives. When building an AngularJS mobile app with Appery.io, you can easily write any custom directive you want to extend the behavior of HTML. Appery.io even provides two of it’s own built-in directives you can use: navigateTo and backButton. The first one helps navigate between app pages; the second one helps manage your browser history including making the back button behave more intuitively.

Tell me more.

For more tips…