September release $a, $v, Appery Helper and Global Functions

Today we are pleased to announce the September release of appery.io with new alias $a of Appery helper, global variable $v and global functions!

Let’s look at what’s new

 

$a

‘$a’ is an alias for the Appery helper ‘Apperyio’. Now, instead of writing:

this.Apperyio.navigateTo("Screen1");

you can use a much shorter form:

this.$a.navigateTo("Screen1");

 

$v

‘$v’ is an alias for global variables that were previously accessed through Apperyio.vars.

$v is a place for storing any data as ‘global’. For example, to transfer data between screens.

this.$v.myData = 12345;
this.$v.userInfo = {id: 123, name: 'Joe'};

For more detailed information about ‘$v’, you can refer to our documentation https://docs.appery.io/docs/6-model-and-storage#apperyio-global-variable

 

Appery Helper

The list of functions and properties for the Appery helper ‘$a’ has been significantly expanded. This expansion greatly simplifies the invocation of the most commonly used operations. For example, if you need to display a modal window and pass parameters to it, this can now be achieved in a single line of code:

let data = await this.$a.modal("EditUser", {name: 'john'});

If you need to display a loading indicator, a simple call will do:

await this.$a.showLoading();

And if you need to perform a GET request:

let res = await this.$a.get("https://mydomain.com/user/12345");

You can explore the full list of available functions on this page: https://docs.appery.io/reference/common-methods-and-properties

 

Global Functions

Global functions have been added. Now, in the Functions section under Modal and Storage, you can define a function, for example ‘sum’, which will be accessible on all screens, custom components, services, etc., using this.$v.sum()

 

For more detailed information about global functions, you can refer to our documentation https://docs.appery.io/docs/6-model-and-storage#global-functions

 

We believe this new feature will be of great value to our users. We appreciate your continued use of Appery.io, and we wish you a happy developing!

Thank you for using Appery.io and Happy Developing!

Your Appery.io Team

Support for Android 13, API level 33

We’re excited to announce the introduction of the latest Appery.io release, which includes support for Android 13 (API level 33).

While many of the Appery projects were upgraded automatically, we aimed to keep manual application changes to a minimum to ensure a smooth transition for all users.
– Please ensure that you have not manually modified the config.xml file in the source tab. If any modifications were made to this file, kindly follow these steps: Remove the file and execute the “Undo all source changes” operation for the CORDOVA folder.

 

– Additionally, for some users, it may be necessary to access the App Settings. From there, navigate to Cordova Config, then proceed to the Android tab. Ensure that the property “GradlePluginKotlinVersion” is present with the value “1.6.20” (refer to the provided image for visual guidance). If this property is missing, kindly add it manually.

 

We believe this new feature will be of great value to our users. We appreciate your continued use of Appery.io, and we wish you a happy developing!

Thank you for using Appery.io and Happy Developing!

Your Appery.io Team

Appery.io First Release of 2023: What’s In?

Dear Appery.io Community,

We are excited to announce that our first Release of 2023 is already live and you are free to check out what new features and upgrades are already available to all Appery.io users!

First things first: we have successfully upgraded our App Builder to Ionic 6 and Angular 15, which resulted in many useful functional improvements and new features for your app-building experience. Most of them are not immediately noticeable, except in a few cases, but innovative and qualitative.

  • The first improvement we would like to introduce is related to the system capability: thanks to upgrading to Angular 15, there will exist no limitations in importing npm packages and modules to your apps anymore.

Check here for some examples of how you can add the npm-modules to the projects created with Appery.io.

Updated Preview Page:

  •  The serious upgrade that will hopefully be noticed and welcomed by you: our App Builder now has a very modern-looking editor mobile frame design. Besides, it now comes with an upgraded app preview page that is now user-friendlier and offers more functionality. From the preview page, now not only can you adjust your app’s UI on the device screen with further easy testing it on your device but also publish and share your app right from the preview:

  • Moreover, those who decide to publish their project as a mobile web app will be able to share it right from the preview.

New and updated UI Components PALETTE

  • Next, we are proud to announce that two new UI components have been added to our App Builder for Ionic: Audio and Video. These new components offer you rich customization options for your multimedia resources:

  • The existing Datetime component has also been upgraded and now comes with two views to select from, Inline which opens an inline calendar, and Open in modal which opens the modal with a calendar and an editable label:

  • One more enhancement: all the components that offer the option of entering strings now allow users to edit them inline right in the mobile frame, and that is a very handy time saver:

  • The next three features refer to the components’ properties upgrades: 1) the Position property was added to many UI components like Checkbox, DataTable, etc.; 2) many UI components that contain labels, for example, Input and Link received the Font Size and Font Weight properties; 3) the Text in Editor property was added to several UI components. With this feature enabled, you will be able to finetune your app UI right in the editor even if this component also has some functional code added as its Text property:

Filtering feature added to OUTLINE and Mapping editor

  • The OUTLINE view now comes with a useful feature of filtering components added to the screen. Just start typing the name of the component to retrieve its parent(s) on the tree and quickly locate the component you are looking for:

  • Users struggling with cumbersome mappings may find the new Mapping editor option of filtering components (similar to how it is realized in the OUTLINE) particularly useful:

Other enhancements

  • The next improvement is minor but comfortable: the Method selection can be changed after the function has been created in the CODE panel:

  • Our last enhancement might also seem rather minor, but will definitely be found useful by our users: the ability to double-click on many of the UI components added to the mobile frame of our App Builder in order to speed up the process of customizing them. By double-clicking the Image component, for example, you can immediately access the Media Manager window and thus work with your custom image files more easily:

Oh man, that list was impressive, wasn’t it?

Well, we tried to do our best to make the features above functional and easy to use as much as possible, and hope you’ll enjoy using them.

Thank you for using Appery.io and Happy Developing!

Your Appery.io Team

Appery Database, a new Educational Video Guide unit, is on!

Having recently announced our third Educational Video Guide unit, we are excited to inform you that the fourth one, Appery Database, has already gone live!

Designed to address all possible database-related questions new Appery.io users might have, this unit can also be extremely helpful to all our users.

Educational Video Guide. Unit 3: Appery Database

As you progress through this unit, you will learn how to create a new database with a custom collection and populate it with data, how to import and set up the predefined database services, what Models and Storages are for, how to define storage variables, and much more…

Appery.io Database

There are as many as six steps in total, and we bet if you follow them one by one, you will be able to create your own ToDo List application that allows you to add new records to the Appery.io Database, list them on the screen, and select the needed entries for further updating them.

Unit 3: Appery Database

Note, that all the actions will take place both: in the app and in the database collection you create.

Well, now that you know how enjoyable learning difficult things can be, why not give it a shot?

PS All our educational series are also available on our YouTube Channel where we publish many useful videos, so, be sure to check it out!

Watch with pleasure and develop with joy!

The July 2021 release is here. What’s in?

Dear Appery.io Community,

We are excited to announce the new features included into our new release, which is already here. So, please make sure you do not miss them:

  • Ionic 5 Text Area component. This is something that many of you have been asking for. The component is available to all our users and can be found in the App Builder PALETTE.
  • Improved performance of Ionic 4/5 preview. And this is great news since loading the project preview takes less time now, making your development experience even more positive and productive.
  • Improved Ace editor with added autocomplete option
  • Added rich editor for variable’s value in Ionic 5 projects. Now, if you need to provide a long line of code or add some object or array to your variable, just click the three-dot button next to the Value field:
  • Full support of Android 11.
  • A bonus feature is the possibility to quickly add the predefined dark theme for your apps by using our Dark Theme plug-in:

 

And, the last but not the least: bug fixes (not too much, though).

How to Use Geolocation in Your Mobile App

geolacation_map

 

Geolocation is one of the most widely used APIs in mobile apps today. From weather to Uber and Lyft, the device location is crucial information and many APIs use it to determine what services and products are available in a given location. When building a mobile app in Appery.io, using the Geolocation API is simple. Apache Cordova library is built-in in every new Appery.io app. Invoking Geolocation will return the latitude, longitude (and other) information which can then be passed to any REST API. The following two short videos show how to use and invoke Geolocation in an Ionic and jQuery Mobile apps:

Looking for more videos like that? Check out our YouTube channel for many more videos.

How to Expose a SOAP Service as a REST API

apiexpress-soap

Appery.io API Express make it fast and simple to connect to an enterprise data source and expose it via a REST API. With API Express you can quickly create an API for:

  • A relational database
  • A WSDL service (SOAP)
  • An existing REST API

In this tutorial, I’m going to show how to expose an existing WSDL service as a REST API and then build a mobile app using the API.

Read the rest of this entry »

Development Tip: Displaying and Centering a Spinner in an Ionic App

With Appery.io and Ionic, you can easily add a spinner to a page:

  1. Drag’n’drop the spinner component to a page.
  2. Provide an expression for ng-show in the properties panel. It could be a variable that returns true or false.
  3. To vertically and horizontally center the spinner do the following:
    1. Add a centered-spinner class to Class in the properties panel.
    2. Create new CSS by going to CREATE NEW > CSS > Create CSS.
    3. Add the following code to create the CSS file:
.centered-spinner {
    width: 28px;
    height: 28px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -14px;
    margin-left: -14px;
}

.scroll
{
    height:100%;
}
spinner
Ionic spinners

Your spinner is ready to use! Don’t forget to change the variable provided for ng-show to true when you need to show the spinner, and to false when you need to hide it.

You can find related information here or 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!

Build Apps Faster with Automatic App Update, Visual API Service Designer, Angular Visual Binding Editor, and More Security Options

Update fast without going through the app store

Wouldn’t it be awesome to update your app without having to resubmit it to app stores? Now you can! With the new Appery.io AutoUpdate feature, you’ll only have to submit your app to the app stores once. You’ll use EXPORT > Auto update to build a new bundle with updated resources. Apps installed on devices will automatically download the updated bundle, meaning users won’t need to do anything for the update.

However, there are some restrictions due to security policies:

  • Only web-resources: HTML/JS/CSS resources could be updated with this feature;
  • Cordova and Cordova plugins couldn’t be updated with this feature;

The updated release bundle is the same for all platforms, so all mobile devices (Android and iOS) are updated simultaneously. See the documentation for more about this feature.

New API Express capabilities

Quickly create services with new visual builder

API Express, which allows you to use external relational databases with Appery.io, was updated with powerful visual tools. Now it’s really easy to build complex algorithms by combining multiple queries into one endpoint.

flow_builder

Read the rest of this entry »

Quickly Fix the AngularJS WebView iOS 9 Issue with a New Plug-in

Last week we blogged about an AngularJS issue that breaks some APIs when you upgrade to iOS 9. We showed you how to create a patch. Today, we have added a plug-in that makes fixing this even faster and simpler. Import the plug-in, and you’re done. I’ll show you how to do that.

Read the rest of this entry »