Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Free Learning
Arrow right icon
Arrow up icon
GO TO TOP
Appcelerator Titanium Smartphone App Development Cookbook Second Edition

You're reading from   Appcelerator Titanium Smartphone App Development Cookbook Second Edition Over 100 recipes to help you develop cross-platform, native applications in JavaScript

Arrow left icon
Product type Paperback
Published in Nov 2015
Publisher
ISBN-13 9781849697705
Length 368 pages
Edition 1st Edition
Languages
Arrow right icon
Toc

Table of Contents (16) Chapters Close

Preface 1. Building Apps Using Native UI Components FREE CHAPTER 2. Working with Local and Remote Data Sources 3. Integrating Maps and GPS 4. Enhancing Your Apps with Audio, Video, and Cameras 5. Connecting Your Apps to Social Media and E-mail 6. Getting to Grips with Properties and Events 7. Creating Animations, Transformations and Implementing Drag and Drop 8. Interacting with Native Phone Applications and APIs 9. Integrating Your Apps with External Services 10. Extending Your Apps with Custom Modules 11. Platform Differences, Device Information, and Quirks 12. Preparing Your App for Distribution and Getting It Published 13. Implementing and Using URL Schemes 14. Introduction to Alloy MVC Index

Dragging an ImageView using touch events


Now that we have allowed the user to select a funny face image from our four animated ImageView controls, we need to allow them to adjust the position of their own photo so it fits within the transparent hole that makes up the face portion of our funny face. We will do this using the touch events available to us in the ImageView control.

How to do it…

The simplest way to perform this task is by capturing the x and y touch points and moving the ImageView to that location. The code for this is simple; just add the following code after your declaration of the imageViewFace control, but before you add this control to your window:

imageViewFace.addEventListener('touchmove', function(e){
  imageViewMe.left = e.x;
  imageViewMe.top = e.y;
});

Now run your app in the emulator and, after selecting a funny face image, attempt to touch and drag your photograph around the screen. You should notice that it works but it doesn't seem quite right, does it? This is because...

lock icon The rest of the chapter is locked
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at $19.99/month. Cancel anytime
Banner background image