[Jossimaru]

Hi all!
I was trying to implement ‘drag and drop’ on some images, and it worked wonderfully (many thanks to Cincyplanet);
but on the test center the images and panels (the panels are supposed to represent the active dropping area) shift position upwards for no specific reason. I have made many attempts to find a solution with no luck, but it does mean a lot for me if it worked! 🙂

I have attached all related files in this post, and any help and comments are more than welcomed.
Many thanks in advance.

Attachments:

You must be logged in to view attached files.

[paulD]

You need to set the auto resize properties for your content so it resizes properly when the screen orientation changes or the device screen size if different. Try using panels as parent containers for content, that trick works very well for getting a layout to suit your app.

http://www.genuitec.com/mobile/docs/advancedUIDesign/advancedUIDesign.html

Hope that helps

Paul

[Jossimaru]

Hi Paul!
Thanks for the quick response.
I’ve tried creating a parent container (a panel) and tried resizing with every possible combination.
No effect was observed upon any of the objects when auto-resizing was toggled in any direction (“the arrows”).

Could it be the ‘drag and drop’ javascript file which is causing those abnormal behaviours??

I’ve attached my project again with a panel as a parent container, but this time I’ve increased the ‘content area height’ of the scroll function to fit the objects in the positions I want them to be, and maybe remove the scroll function while keeping the area height?? 🙂

Many thanks in advance for any recommendations and solutions.
Jossi

Attachments:

You must be logged in to view attached files.

[paulD]

Hi Jossi

The trick is with this sort of stuff is use multiple panels as containers. I’ve done a very quick demo with your file so you can get the idea. It took me a while to get my head around using panels as position aids. But once it clicks its a lifesaver!

Hope it helps

Paul

Attachments:

You must be logged in to view attached files.

[Jossimaru]

Hi Paul!

Since I’m trying to apply a ‘drag and drop’ feature, it’s quite essential to have all my objects in one page, otherwise they won’t drop into the required object in a different panel. Tried it for hours with no luck…

As the objects keep shifting upwards, do you reckon there’s a way to:
increase the background panel size then -> place objects deep down the panel accordingly, then -> remove scrolling feature while maintaining ‘content area height’??

I think this might do it, but I just need to know how to remove the scroll feature while keeping ‘content area height’ of a panel..
I really appreciate your comments, you don’t know how much it means to me if this worked!! 🙂
Jossi

[paulD]

Personally I would seriously consider locking down your screen rotation to either portrait or landscape. It would make building the app much simpler and easer to use for the end user. I am a great fan of the KISS principle (Keep It Simple Stupid). If its a web app you are building you can not lock the screen orientation, but you can do this –

http://www.genuitec.com/support-genuitec/viewtopic.php?f=14&t=1372&hilit=lock+orientation

I think you would be able to add a nested IF statement to just add this to the specific page.

Hope that helps

Paul

[Jossimaru]

I apologise for not being a bit more specific.
It’s going to be an iPad app (probably optimized for iOS 7) for children in landscape orientation, and I’m using MobiOne 2.5.0.

Did you mean I could use a nested IF to disable the scroll functionality for that specific page while maintaining the large ‘content area height’?

I’ve tried using the tween greensock ‘drag and drop’ as well, the dragging part worked whilst the ‘drop’ part didn’t…
I’ll update you guys if I get it working…
Thanks for the quick replies Paul…
Jossi

[paulD]

Ok you lost me slightly 🙂 If its an IPAD app with one orientation why do you need the scroller?

Just had a very quick look and came across this using Jquery UI http://jqueryui.com/droppable/ Seems really easy to implement for the drop target?

If you get it sorted please post your result, I would be great to see how you sorted it!

Paul

[Jossimaru]

I don’t know if you’re experiencing the same thing, but the images and panel shift in a very weird pattern upwards; however, there’s a trend to it.. It seems like the objects shift more upwards if they’re lying on the right hand side, and so I can’t use the bottom right side of the page due to this ‘shifting’ effect.

I thought the easiest way to get things on the bottom right side is to have a panel with a large ‘content area height’, then carefully place my objects accordingly so that they all fit on the page, then remove the scrolling function to restrict movement onto only that page…

Seems like a hack, but if it works I’ll be over the moon… 🙂
I’ll definitely post any solutions I find…
Jossi

[Author]

Posts