App interface seriously Flickers & Refreshes on Click / Transition

Hi,

Thank you for your sharing. I tested it on Samsung S2 & Note4. Also, the Drupalgap SDK App cannot be exited by pressing the back button on phones. I have to end it forcibly under App manager each time.

The said https://github.com/adappt/drupalphonegap SDK is provided by this module https://www.drupal.org/project/phonegap . However, I just compiled the SDK to see if any flicker / refresh / white waiting screen noticed, yet tested it with its phonegap module which seems having been discontinued in development.

I just finished assembling a fully Email-driven Ticketing System on Drupal and now looking into building a simple mobile app interacting with it with push notification and found this https://www.drupal.org/project/drupalgap_mobile_notifications

Drupalgap is resourceful with great suppport. I'll try to figure out the interface and post finding here once identified. Thanks

Hi,
Finally I tested https://www.drupal.org/project/phonegap with https://github.com/adappt/drupalphonegap , I'm able to login, retrieve the content view list and also post content. After login, the app interface still works nice with NO flickering / refresh / white screen on click / transition / retrieving / posting. Perhaps it's much simpler & light-weight if compared to drupalgap.

Hi,
I traced out the cause after experimenting http://www.w3schools.com/jquerymobile/tryit.asp?filename=tryjqmob_trans_... . Indeed, it's the default fade transition effect causing flickering.

I added "data-transition": "none" in settings.js for all links. However, it does not work because you use onclick javascript.

Then I was told to add the following between<script src="jquery-1.9.1.min.js"></script> and <script src="jquery.mobile-1.4.2.min.js"></script> to disable the default transition effect in global scope.

<script type="text/javascript">
	$(document).bind("mobileinit", function() {
	    $.mobile.defaultPageTransition = "none";
	    $.mobile.defaultDialogTransition = "none";
        });			
</script>

It works well without flickering anymore as web app and also on phone (android). However, on phone, after I click Create Content and the page shows, all the links become unresponsive and no longer functioning. I also tested it with emulator resulting in the same.

Now I solved the flickering but it crashed with Create Content page on phone / emulator. Any ideas ? Thanks

@WillsCreative

JQuery Mobile is set with Fade transition by default, just disable it as mentioned in #4, flicking will be gone then. However, I noticed that after disabling using

<script type="text/javascript">
	$(document).bind("mobileinit", function() {
	    $.mobile.defaultPageTransition = "none";
	    $.mobile.defaultDialogTransition = "none";
        });			
</script>

if your form contains unsupported field types by drupalgap, the form will become unresponsive during submission. I don't know why the codes can become conflicting with drupalgap.

@d0t101101

The codes must be put between <script src="jquery-1.9.1.min.js"></script> and <script src="jquery.mobile-1.4.2.min.js"></script> in index.html. Otherwise it won't work.