background preloader

Getting started with PhoneGap in Eclipse for Android

Getting started with PhoneGap in Eclipse for Android
Note: Be sure to change the version number of the Cordova JavaScript file to match the version of PhoneGap/Cordova that you are using. Eclipse is an open source integrated development environment (IDE) that supports many technologies, but this article is focused on its support of Java, the native language for Android applications. Android is Google's open source mobile operating system. Android is the operating system for many smartphone and tablet devices, including the Samsung Galaxy line of phones and tablets, the Amazon Kindle Fire tablet, and the Barnes and Noble Nook tablet, as well as many other devices from numerous manufacturers. PhoneGap is an open source application platform that enables you to create natively-installed mobile applications using HTML and JavaScript. The first step in setting up your development environment for PhoneGap applications on Android is to download and install the Eclipse IDE. Android development with PhoneGap can be done in Windows, OS X, or Linux. <!

Apache Cordova API Documentation This guide describes how to set up your development environment for Cordova and run a sample application. Note that Cordova used to be called PhoneGap, so some of the sites still use the old PhoneGap name. 1. Requirements Eclipse 3.4+ 2. Download and install Eclipse ClassicDownload and install Android SDKDownload and install ADT PluginDownload the latest copy of [PhoneGap and extract its contents. 3. Launch Eclipse, and select menu item New Project Then specify new application project Then speciy an Application Name, a Project Name and Package Name with Namespace Then select a graphic Then Create a Blank Activity Make sure the activity doesn't inherit from anything. 4. Create and open a new file named index.html in the assets/www directory. 5A. Right click the project and go to Run As > Android ApplicationEclipse will ask you to select an appropriate AVD. 5B. Make sure USB debugging is enabled on your device and plug it into your system. Done!

Responsive Slideshows If your website relies heavily on images, then having an image gallery is a great way to showcase your content on your website. Having said that, this idea may also backfire if visitors are coming from a mobile or touch device. Mobile users deserve some love too, hence the purpose of today’s post. There are a variety of responsive image galleries, slideshows and sliders to better manage your photos, screenshots and other forms of images on your site. To make it easier for you to find the right pick for your website’s needs, we have put together a showcase of the best 10 galleries, slideshows and sliders we know of. FlexSlider – [demo | download] An image carousel complete with slide effects and fade animations created by Woothemes, FlexSlider 2 showcases photos and/or videos, and works on all major browsers. Elastislide – [demo | download] “Inserting the carousels structure into a container with a fluid width will also make the carousel fluid.” Responsive Image Gallery – [demo | download]

Using the Android Emulator The Android SDK includes a virtual mobile device emulator that runs on your computer. The emulator lets you prototype, develop and test Android applications without using a physical device. The Android emulator mimics all of the hardware and software features of a typical mobile device, except that it cannot place actual phone calls. It provides a variety of navigation and control keys, which you can "press" using your mouse or keyboard to generate events for your application. It also provides a screen in which your application is displayed, together with any other active Android applications. To let you model and test your application more easily, the emulator utilizes Android Virtual Device (AVD) configurations. The emulator also includes a variety of debug capabilities, such as a console from which you can log kernel output, simulate application interrupts (such as arriving SMS messages or phone calls), and simulate latency effects and dropouts on the data network. Overview

20+ fresh jQuery Animation Tutorials jQuery is a lightweight JavaScript library that makes interaction between JavaScript and HTML. In older days when people see something animated on website they will categorized the website as a flash website. But now because of jquery animations many people think that there is no need of flash when jQuery contains such an amazing animation effect which are very light in weight in comparison of flash. However if you are a begginer designer and want to learn new techniques of jquery then this post is for you because it contains 20+ fresh and awesome jquery animation tutorials. 1- How to Make an Impressive Animated Landscape Header with jQuery It’s a cartoon themed landscape with elements which slide out to reveal additional content. View Tutorial 2- Puffing Smoke Effect in jQuery Gaya Kessler features a beautiful animation effect of puffing smoke in this tutorial. View Tutorial 3- Animated Drop Down Menu with jQuery View Tutorial 4- BBC Radio 1 Zoom Tabs View Tutorial View Tutorial View Tutorial

Building an iOS Photo-sharing and Geolocation Mobile Client and API ios mobile This article is a work in progress, or documents a feature that is not yet released to all users. This article is unlisted. Only those with the link can access it. Table of Contents Location-based mobility apps are a central part of any modern product’s strategy more than ever before. This article will guide you through the process of developing a photo sharing service with a native iOS client and Rails backend. Code for the Rails application and the iOS Client is available on GitHub. Prerequisites Basic Objective-C knowledge, including a development environment running Mac OS X with Xcode 4.2 installed. Deploy API to Heroku Because of the scope and complexity of the project being created you may find it useful to clone and deploy the code now, and use it as a reference as you read along. Write Your Rails application Following the client-server model, this guide implements both a Rails application on the server, and an iOS client that communicates with it. Deploy to Heroku .env Podfile

jQuery.parallax Download git clone github.com/stephband/jparallax Instantiation jQuery( '.parallax-layer' ).parallax( options ); What does jquery.parallax do? jParallax turns nodes into absolutely positioned layers that move in response to the mouse. With a bit of CSS you can either set up windows to see these layers through, or leave them free to roam about. The diagram on the right illustrates what jParallax does to the html: and here's a demonstration with some images: More demos demos/index.html demos/stalkbuttons.html - multiple parallax. demos/remotecontrol.html - parallax by remote control. demos/thumbnails.html - beautiful interactive thumbnails. demos/target.html - demonstrates how smoothly jParallax handles window resizing. Using jParallax The default behaviour of jParallax is to show the whole width of a layer in response to the mouse travelling the whole width of the mouseport. There are various ways to style jParallax effectively. Options Layer Options Events

Writing HTML5 Mobile Web Apps using Backbone.js Effet de coin de page en CSS 3 / Benjamin PREVOT De nombreux sites ont mis en place un effet de coin de page (Peel effect en anglais) pour des publicité, donner des informations complémentaires... Vous pouvez en voir des exemples ici : Comme vous l'aurez remarqué, cet effet est mis en place en utilisant une animation Flash ou du JavaScript. Nous allons voir dans cet article comment réaliser le même effet en CSS 3 sans script complémentaire. Démo Arborescence du site Avant toute chose, voici comment sont ordonnés les fichiers. img : répertoire contenant les imagesindex.php : fichier principal contenant la structure HTMLstyle.css : feuille de style Mise en place de la structure HTML Dans un premier temps, nous allons mettre en place notre page HTML afin de définir les différents composant dont nous avons besoin. index.php <! Cette page contient un lien (id="peel") représentant notre coin de page cliquable ; il aura comme arrière-plan l'information que nous souhaitons mettre en place. L'image qu'il contient est en fait le coin de page plié. style.css

Android niceties Installer Cygwin - Astuces cygwin, configurer cygwin, commande cygwin windows, comment installer cygwin, comment cygwin windows, comment utiliser cygwin windows, sigwin, repertoire installation ouvrir, arret du telechargement cygwin, installer cygwin Il était grand temps que je mette un peu de libre dans mon Windows Seven, pour cela j'ai décidé d'installer cygwin pour retrouver tous les beaux utilitaires que j'adore sous Linux. Téléchargement La première chose à faire avant de configurer cygwin est de télécharger le fichiersetup.exe. Installation de cygwin Pour le processus d'installation je vous donne une série de screenshot pour voir les paramètres que j'utilise.L'écran de démarrage de l'installation qui donne la version de cygwin à installer. On choisit d'installer les packages via Internet J'installe Cygwin dans le répertoire C:\Cygwin Pour le répertoire contenant les packages je choisi arbitrairement C:\Cygwin\Packages Je choisi le site cygwin.cict.fr qui est le seul miroir français. C:\Cygwin\bin /home/pcr devient

QUOjs - Micro JavaScript Library CodeIgniter Library: 77 Free Scripts, Addons, Tutorials and Videos | RLM CodeIgniter is the brainchild of Ellis Labs and one of the more popular PHP frameworks available. It's gained a reputation as a lean, mean, easy-to-learn framework that anyone comfortable with PHP can get up and running with in a few days. CodeIgniter is fixin' to blow up even more with the release of ExpressionEngine 2.0, currently in Beta, which is built on top of the CodeIgniter framework. Sounds great and all, but ExpressionEngine ain't cheap…$299 for the commercial version…so while you sit around wondering if ExpressionEngine is a CMS you want to get in to, why not get familiar with it's CodeIgniter foundation using these 802 77 totally free scripts, addons and tutorials? Free/Open Source CodeIgniter Scripts CodeIgniter is a great, open source, PHP framework for building web applicationsBackEndProBackEndPro is a control panel for developers written in PHP for the CodeIgniter framework. Plugins, Modules & Libraries Text Tutorials Video Tutorials

What You Need to Begin iOS Programming - AppCoda Update: The post is updated to make it compatible with Xcode 5 and iOS 7. So far over 600 6000 readers have signed up the free iOS tutorials. First, thanks for those joining our community. Before we begin to talk about iOS programming, let’s go through the tools you need to build your first app. 1. Yes, you need a Mac. 2. Don’t mix this up with the paid iOS Developer Program that we’re going to talk about in later section. You can go to Apple’s developer website for registration. 3. To start developing iPhone and iPad apps, Xcode is the only tool you need to download. To download Xcode, launch Mac App Store on your Mac. In the Mac App Store, simply search “Xcode” and click “Free” button to download it. Once you complete the installation process, you’ll find the Xcode folder in the Launchpad. At the time of this writing, the latest version of Xcode is 5.1.1, which adds the support of iOS 7.1. 4. The simulator is powerful, however, it doesn’t simulate all features of iPhone. Got a question?

Related: