Alpha Anywhere 2.0 New Features Video Library

With Alpha Anywhere, we're working around the clock to bring license holders exciting new features and critical functionality for building the most robust mobile and web business apps possible.

With the recent release of Alpha Anywhere 2.0, we unveiled our most significant update to the product since its initial launch last year. And while you may have heard about the seamless one-click PhoneGap integration, new iOS and Android style templates, and security framework updates, there is a lot more to Alpha Anywhere 2.0 than that.

Check out the videos below to see a more complete overview of everything that's new in Alpha Anywhere 2.0—available immediately to all current license holders at no extra charge. If you have any questions about Alpha Anywhere 2.0 or your licensing options, please don't hesitate to get in touch.

PhoneGap Build Integration

Support for the PhoneGap Build service is now tightly integrated into Alpha Anywhere! PhoneGap is an open source product that allows you to build native applications for mobile devices. With the Alpha Anywhere mobile app development platform + PhoneGap integration, you can easily create a Hybrid (HTML5/Native) application that has access to all of the native features of the phone that are exposed by PhoneGap.

When you create a List control that is based on SQL data, you must use Alpha Anywhere 'portable' SQL. If you want to base you List on 'native' SQL (which includes stored procedures), you must define a 'custom' data source for the List and then in theXbasic function that returns the data, you can use your native SQL.

The Button List control (and the Checkbox control) can show an icon on selected items. The List control can also be configured to allow multiple selections, but it does not show an icon on the selected rows to indicate the row has been selected (it shows selected rows using a different row color). In this video we show how you can easily display an icon on the selected rows using a custom CSS class.

When working with virtualized Lists, it's possible to have Lists with a very large number of rows. This makes navigating by scrolling on the List body cumbersome. To facilitate navigating large Lists, a 'List scroller' can now be added. The scroller shows a message while you are dragging with which row in the List will be shown if you were to stop dragging. Using the scroller, you can very quickly navigate to any row in the List. The List Scroller is not limited to virtualized Lists. It can also be used with non-virtualized Lists. In this video we demonstrate the List Scroller on a List that contains 100,000 rows of data.

A common pattern in Alpha Anywhere is to place a button on a component to print a Report and display the Report in a window, div or TabbedUI pane. However, instead of displaying the Report, you might want to send it as an email. The Action JavaScript action to Print a Report has an option to call an Xbasic function when the Report has printed. In this video we show how you can use this option to e-mail the report using the Mandrill e-mail service.

Xdialog allows users who are building desktop applications to create powerful 'screens' to prompt for and display information to users. You can now embed Google's Chrome browser directly into your Xdialogs. This means that you can use the full power of HTML, CSS3 and JavaScript to create amazing looking Xdialog screens. When you embed the Chrome control in an Xdialog you can easily respond to events in the HTML with either JavaScript or Xbasic code. You can also easily send events from Xbasic to the HTML that is displayed in the embedded Chrome control. If you have used Xdialog in your desktop applications in the past, this new feature will open up many exiting possibilities.

Alpha Anywhere now includes a very powerful client-side template engine that allows you to merge JavaScript data into templates to produce HTML output that can then be displayed on your component. Client-side templating has become increasingly popular among developers and we are very happy to announce that client-side templating can now be accomplished in Alpha Anywhere.

Now, group breaks can be inserted into the List control as either server- or client-side group breaks. The advantage of client-side group breaks is that they can be dynamically applied to the List datamaking it easy to switch from grouping by 'Lastname' to 'City', etc. Plus, you can also display summary values in the group headers and footer. For lists with group breaks, you can also display a List Navigator, allowing the user to easily scroll a long List. Check out an overview of both and then go into depth on setting up client-side grouping using Action JavaScript.

A cross-domain Ajax callback is a callback that takes places to a server that is in a different domain than the domain from which the component was loaded. Now Alpha Anywhere features support for cross-domain Ajax callbacks, facilitating the retrieval of data from third-party services.

Controls such as Lists and Maps have a 'Fill container' property that allow you to automatically cause the List or Map to fill the Panel Card in which the control is contained. Other controls, such as Text Areas, do not have this property. In this video we show how you can configure the UX so that the Text Area control automatically fills the Panel Card in which it is contained.

There are many 3rd party Icon Font (CSS Icons) libraries that can be used with Alpha Anywhere. In this video we show how you can go to a source of icon fonts and download a font library that can then be installed into Alpha Anywhere.

The Font-Awesome CSS Icon library is bundled with Alpha Anywhere and can be used in the UX, Grid and TabbedUI components.In this video we show how to use the Font-Awesome font library and CSS icons in general.

A split button is displayed as a regular button and a smaller button with a dropdown icon. You can have different event handlers for the dropdown button portion of the button and the regular portion of the button. When space is constrained, you can use a single split button to perform many tasks, while still giving the user single click access to the last selected task.

The Absolute Layout container in a UX allows you to place controls at absolute locations, typically using a bitmap image of a form as a background. You can use an action in Action JavaScript to save the contents of the Absolute Layout container as PDF file and then download the PDF to the client, or call some Xbasic function to process the PDF file. This video shows how this is done using Action JavaScript.

By default, the data type for each field in a List is a JavaScript string. In some cases you might want the data type for a column to be a JavaScript date or number object. A benefit of transforming dates into true Javascript date objects is that you can then use date formatting in the template for the List.

A common pattern in mobile apps is the 'split-view' which shows a menu on the left and a work area on the right.On a phone, the menu is hidden and only shown on demand, but on a tablet, the menu is always shown. Now, with Alpha Anywhere, you can simply select a pre-defined split-view quick start template to automatically generate the outline—complete with CSS icons—of a stunning menu for your mobile apps!

You can open a UX component from a button on a Grid using several different actions in Action JavaScript. For example, there are built-in actions to edit the data in the current row of a Grid using a UX. But sometimes you want to simply open a UX and pass information from the current row in the Grid to the UX. See how this is easily done by defining arguments in the UX component and then automatically setting the value of these arguments when the UX is opened.

When you are working with List controls that contain a large number of rows (say several thousand rows), it is advisable to turn on the List's 'virtualization' feature. With virtualization turned on, the List will only render a small number of rows at a time (the visible rows and some additional rows above and below the visible rows). Turning on List Virtualization will dramatically reduce both the time taken to load the List and the amount of memory consumed by the List.

A common design pattern in applications is to allows users to drag items from one List to another. The Alpha Anywhere JavaScript library contains powerful drag and drop functions that allow you to easily enable this type of functionality. In the first video, we show how you can create a UX with two List controls and drag rows from one List to the other. In the second video, we explain the JavaScript code that enables this functionality:

A common pattern in mobile applications is to display a List of records and then when the user clicks on a row in the List to display a list of fields and corresponding values for the row the user clicked on, with one field/value pair per line. In this video we show how a second List can be used to display the field/value pairs and how this List can be dynamically populated when the user clicks on a row in the main List of records

The List control allows you to define 'lookup columns' where the data in the column is 'looked up' either by calling a JavaScript function (that you define), or by looking up the value in some other List. A typical use case for this is a List that shows Order Details. Each row in the list has a 'productId' field. You would like to display the product name for each product ID.

Remember: This is just an overview of some of what's included in Alpha Anywhere 2.0. To see a complete list, along with more videos, screenshots, and additional documentation, please check out the Release Notes.