Icon View Thread

The following is the text of the current message along with any replies.
Messages 1 to 10 of 29 total
Thread Pinch Zoom
Fri, Nov 6 2015 3:25 PMPermanent Link

Douglas Lyman

Has anyone had success getting pinch-zoom to work using EWB2 on tablets.  In EWB1 we could achieve this by changing the html file as follows:

    <meta name="viewport" content="user-scalable=yes,
          width=1024,
          initial-scale=1,
          minimum-scale=0.5,
          maximum-scale=1.5">

This doesn't seem to help in EWB2.
Fri, Nov 6 2015 4:08 PMPermanent Link

Tim Young [Elevate Software]

Elevate Software, Inc.

Avatar

Email timyoung@elevatesoft.com

Doug,

<< Has anyone had success getting pinch-zoom to work using EWB2 on tablets.  In EWB1 we could achieve this by changing the html file as follows: >

EWB 2.x handles all of the touch events manually, so you're not going to be able to do pinch-zoom without either specifically handling the touch events (touch start, touch move, etc.) for the target control, or wait until I add it as an "interpreted" touch event for the controls.

Tim Young
Elevate Software
www.elevatesoft.com
Fri, Nov 6 2015 11:22 PMPermanent Link

Frederick Chin

Tim,

/*
EWB 2.x handles all of the touch events manually, so you're not going to be able to do pinch-zoom without either specifically handling the touch events (touch start, touch move, etc.) for the target control, or wait until I add it as an "interpreted" touch event for the controls.
*/

Can you direct me to example code on how to handle the pinch, zoom and swipe gestures via the touch events? I couldn't find them in the user's manual.

Frederick
Mon, Nov 9 2015 5:16 AMPermanent Link

Tim Young [Elevate Software]

Elevate Software, Inc.

Avatar

Email timyoung@elevatesoft.com

Frederick,

<< Can you direct me to example code on how to handle the pinch, zoom and swipe gestures via the touch events? I couldn't find them in the user's manual. >>

That's because they don't exist.

There is no way to control the browser zoom level from *any* JS code and, in general, you *shouldn't* use pinch/zoom with an entire mobile EWB web *application* (as opposed to a web site with static content).  So, unless you specifically need pinch/zoom for something special in terms of zooming/un-zooming the content of a control on a form, such as is the case with Google Maps, you won't be able to do what you want.  In other words, an EWB application acts like a native desktop/mobile application in this respect.

As for swiping, I'll see if can add in a specific event for this, since writing up an example is basically the same amount of work as just implementing the logic in the UI event manager.  The basic logic is covered here in this link:

http://www.javascriptkit.com/javatutors/touchevents2.shtml

Tim Young
Elevate Software
www.elevatesoft.com
Mon, Nov 9 2015 11:31 AMPermanent Link

Frederick Chin

Tim,

/*
That's because they don't exist.

There is no way to control the browser zoom level from *any* JS code and, in general, you *shouldn't* use pinch/zoom with an entire mobile EWB web *application* (as opposed to a web site with static content).  So, unless you specifically need pinch/zoom for something special in terms of zooming/un-zooming the content of a control on a form, such as is the case with Google Maps, you won't be able to do what you want.  In other words, an EWB application acts like a native desktop/mobile application in this respect.

As for swiping, I'll see if can add in a specific event for this, since writing up an example is basically the same amount of work as just implementing the logic in the UI event manager.  The basic logic is covered here in this link:

http://www.javascriptkit.com/javatutors/touchevents2.shtml
*/

I am creating the application for three devices; desktop, tablet and smartphone.

There is no issue with the the desktop as the size of the form fits within the screen boundaries.

As for the tablet, I would like the web browser together with the application to shrink and fit within the tablet's screen by pinching.

There's not much I can do with the smartphone (only 4") as the font would be too small to see by pinching. So, I would like to be able to swipe the buttons into view.

How do I approach these scenarios?

Frederick
Mon, Nov 9 2015 12:00 PMPermanent Link

Tim Young [Elevate Software]

Elevate Software, Inc.

Avatar

Email timyoung@elevatesoft.com

Frederick,

<< As for the tablet, I would like the web browser together with the application to shrink and fit within the tablet's screen by pinching. >>

You can't do that with EWB, at least not without hacking the emitted HTML and disabling a lot of built-in code for the touch handling.

<< There's not much I can do with the smartphone (only 4") as the font would be too small to see by pinching. So, I would like to be able to swipe the buttons into view. >>

For now, you'll have to just use a hamburger button, or something similar, to slide the buttons into view.

Tim Young
Elevate Software
www.elevatesoft.com
Mon, Nov 9 2015 12:04 PMPermanent Link

Matthew Jones

Frederick Chin wrote:

> and fit within the tablet's screen

Wouldn't a responsive design be better? Simple scrollability to display
the info, perhaps hiding unimportant things like graphics?

I basically did this when I squeezed one EWB1 application down from
tablet support to 3.5" phone support. It isn't great, but it worked.
With EWB2's better responsive layout, it should be possible to make it
quite nice.

--

Matthew Jones
Tue, Nov 10 2015 10:41 AMPermanent Link

Frederick Chin

Tim,

/*
You can't do that with EWB, at least not without hacking the emitted HTML and disabling a lot of built-in code for the touch handling.
*/

Would an EWB application be suitable for a tablet then given that the web browser takes up screen space as well and the application cannot compress to fit? I don't see that happening if a form with lots of controls or a grid is included.

Frederick
Tue, Nov 10 2015 10:51 AMPermanent Link

Frederick Chin

"Matthew Jones" wrote:

/*
Wouldn't a responsive design be better? Simple scrollability to display
the info, perhaps hiding unimportant things like graphics?

I basically did this when I squeezed one EWB1 application down from
tablet support to 3.5" phone support. It isn't great, but it worked.
With EWB2's better responsive layout, it should be possible to make it
quite nice.
*/

I'm not sure if this workaround will give me a practical application since I expect to have forms with a number of controls within them.

How would you display a form 800 pixels wide x 600 pixels high that contains a grid that extends almost to the top and bottom with four buttons in the top right inside a web browser within a smartphone with a 4" screen without scrollbar support or the ability to resize?

Frederick
Tue, Nov 10 2015 11:41 AMPermanent Link

Matthew Jones

Frederick Chin wrote:

>  tablet then given that the web browser takes up screen space

If you make a bookmark on the home screen, the browser part should
hide. Pretty sure it does/did on the iPad anyway.

--

Matthew Jones
Page 1 of 3Next Page
Jump to Page:  1 2 3
Image