We recently received an e-mail from Google regarding some of our apps on the Google Play Store. Unfortunately, these e-mails weren’t congratulating us on making such amazing apps. Instead, they were warning us about security issues that have made some apps vulnerable to attack. The title of the e-mail read, “Security Alert: Apache Cordova vulnerabilities in your Google Play apps”. There has been a lot of talk about these vulnerabilities online. This is our attempt to explain them in as clear and brief a fashion as possible.
Our final post in this mini-series on the TestFlight SDK and PhoneGap will look at integrating it with a Sencha Touch application.
In our last post on TestFlight and PhoneGap we talked about how to integrate the TestFlight SDK into a PhoneGap project using the TestFlight Plugin. In this article we are going to show you how to take advantage of more of the SDK’s features including logging, collecting feedback, asking questions and customising the environment data saved.
This tutorial covers how we go about integrating TestFlight’s (www.testflightapp.com) SDK into your PhoneGap (aka Cordova) iOS application. If you don’t know about TestFlight yet I suggest you head over there right now and sign up – it is an invaluable way of distributing and managing your iOS (and soon Android!) applications and builds. And did I mention it’s completely free? You will need an account to complete this tutorial so get down there now!
When adding logic to Sencha Touch views we often need to grab references to internal Components to manipulate them.
We find ourselves having to either cache a reference to items by creating them individually or adding getter methods that performed a ComponentQuery or that delved into the items collection.
Using the Ux.locale.Manager extension
This blog post is going to discuss how to use the excellent Ux.locale.Manager extension (created by Sencha’s Mitchell Simoens) which allows us to easily integrate localisation into our Sencha Touch and Ext JS applications.
We will focus primarily on Sencha Touch in this tutorial but the principles and techniques can equally be applied to Ext JS 4 projects without too many tweaks.
By the end of the article we should have achieved the following:
- Integrated the extension with a blank Sencha Touch project.
- Explained the configuration options available.
- Demonstrated its use with an example
- Created our own overrides to customise it further
- Dealt with more complex situations such as DataViews
In previous releases of Ext JS complicated form layouts were quite difficult to achieve. This was due to the nature of the FormLayout, which was required to display labels and error messages correctly, and how it had to be combined with other nested layouts.
Ext.ux.TouchCalendar is an extension and series of related plugins that allow a calendar component to be integrated into Sencha Touch 1 and 2 applications.
Links to the repository, documentation and demos (along with some inline demos) can be found further down this post.
After a comment from Brandon looking for advice on adding form fields on the fly, I thought it would be worth a mini blog article to explain it.
What we want to do is add a button to our form that, when tapped, will add a new field to the form. By adding this functionality we can allow users to enter arbitrary amounts of data. This can be applied to situations such as, when entering ingredients for a recipe (we don’t want to restrict them to a set number, nor do we want to prepopulate the form with too many fields); adding qualifications to your CV (not everyone has the same number of qualifications so how do we allow them to enter the right number?).
Firstly, apologies for the lateness of this follow up post!
The aim of this post is to describe how we can use Select Fields (combo-boxes) to create a form whose options change based on the previous selections made by the user. So basically when a user makes a selection from the first Select Field we want the next one’s possible values to change, reflecting the choice made.
The scenario we will use is a simple form where the User can choose a Country and then a City from two Select Fields which could be used in a form where a User completes their Address.
When learning a new topic people often make the same mistakes and follow the same bad practices as each other. It usually follows by them realising that what they’ve been doing for a few days/weeks/months is a bad way of doing it and wondering how they didn’t realise earlier.
In this article we’ve put together a (non-exhausted!) list of a few of the things we’ve picked up and things we recommend you do when starting out with Ext JS (hey, even you veteran developers might learn something new!). These things have come up through our own experience; through seeing and replying to the same issues on the forums again and again; and just general good programming practices.
Hopefully this will jump you a few rungs up the ladder of learning Ext JS and help you avoid falling into the usual traps!
This plugin duplicates the functionality found in Twitter’s mobile apps where an options menu is exposed after swiping over an item in a list. The plugin was created as an ‘I wonder if that’s possible’ type project and serves to prove once again that anything native apps can do Sencha Touch can do too.
Downloadable demo of Ext.ux.touch.ListOptions.
The new Charting package that is shipping with the latest Ext JS 4 Preview is fantastic and really does dwarf the previous releases offering (which was also very good). I’m going to outline a few of the key features that make it so good.
Occasionally we will want to tailor the layout of our app to suit the device that the User is viewing it on. Generally we want to do this to take advantage of the increased screen real estate made available by devices such as tablets compared to the usual phone or iPod. For example, showing a list of search results alongside a map rather than having them one behind the other in a card layout.
This plugin allows you to have your map dynamically load points of interest as the user pans around the map allowing you to minimize the amount of data you have to fetch from the server and minimize the number of markers on the map speeding up performance by only dealing with points that are within the map’s visible area.
This demo loads randomly generated points onto the map as you pan and zoom. The markers are numbered based on the batch that they were loaded in to give an idea of the plugin working.
This tutorial is going to form a small series about creating dynamic forms that react to previous user input so you can keep your forms tidy and simple without the bloat of extra fields and so you can populate fields dynamically based on other selections.
In this tutorial we will start with the simple case of only wanting to show/enable fields when users have selected a specific value from, for example, a dropdown list.
I recently upgraded to Windows 7 and found that running a website using the ASP.NET Development Server on Visual Studio 2008 is really slow!
Having tried altering a few settings and playing with my anit-virus I turned to search and it lead me to reading this:
If you haven’t already read Part 1of this mini blog series then I recommend you do before reading any further, but if you’re fairly confident with the basics of plugins then you can probably manage alright!
You can read the full HOW TO: Create a Sencha Touch Plugin – Part 1 post here.
This plugin can be applied to panels to give a simple and flexible way of adding action buttons to a panel. It could be used as a simple close button or as the submit button on a form.
Although very simple we hope it might be of use to someone else who is looking for an alternative way of performing actions on floating panels.
What is a Plugin and why create one?
A plugin is a class that adds functionality/features to a parent component by adding or modifying its behaviour and/or look after its instatiation. By creating a plugin you can reuse it and apply its behaviour to any number of components without duplicating code and effort. To use a plugin in a component you simple instantiate it in the component’s ‘plugin‘ config option. An example of a plugin might be one which adds a help icon after each form field providing the user with help text on how to fill it in. If you didn’t create a plugin for it you would be required to manually code it for each form field which would be cumbersome and time consuming. So, hopefully I’ve convinced you of the merits of creating plugins to allow maximum code reuse and to make your lift a whole lot easier! Now how do we actually create one…?