ScrollView rendering takes a lot of time on iOS using Appcelerator - ios

One of our Appcelerator apps is experiencing rendering delays on IOS platform for the screens where there are multiple widgets (customised textfields to meet client UI requirement) being displayed inside the scrollview.
The screens are making use of ScrollView where these custom controls (Widgets) are displayed inside the views. We are seeing the delay in the following scenarios:
When the screen is having quite a few controls displayed (around 10-15 controls).
It is observed that the rendering time it takes and any changes to this control properties while the page is loading (such as setting some properties by calling the methods on the widget) is resulting in extra 2-3 secs delay.
When these controls are dynamically added into the page - say in response to the question by the user we display additional controls to capture the information.
We have seen a clear lag in this case which is not good from the user experience perspective.
Note:
All of these issues are only on IOS platform whereas the same code works pretty good (without any lag) on Android platform.
Tried out using the tableview in place of scrollview but the result is no different.
Using tableview also results in poor scrolling performance.
As some complex views are created and added dynamically, using listView would be challenging.
Can anyone let me know if any of you are aware of such issue and how it was resolved (in any appcelerator project)? Is there any way on the native front setting some property/native code through a module that would help speed up the rendering on IOS?
We are only developing for iPads and iPad Minis using iOS 7.1.1+ using Titanium SDK version 5.1.2 (We have tried latest SDKs, but they haven't solved our problem).

Related

How to prevent diagonal scrolling in mobile Chrome/Safari

Is there a way in Chrome and Safari on iOS to restrict scrolling to one direction at a time? In other words, if I start scrolling an element vertically, I want to turn off the user's ability to scroll horizontally until the vertical scrolling is complete. And vice versa.
In iOS native code this is called directionalLockEnabled, and in Microsoft browsers it's -ms-scroll-rails.
Does something like this exist in CSS that Chrome for iOS (or Safari for iOS, because they use the same rendering engine under the hood) will recognize?
If not, is there a javascript solution available, ideally a React-compatible npm package?
If you're after a pure CSS solution, unfortunately there is nothing in the spec for locking scroll to a single axis at a time.
There are some great points on this thread, including some vanilla JS solutions if your use case requires locking the scroll behaviour to one axis at a time.

quartz core generating loads of VM: UILabel(CA Layer)

I have an app which drags messages dynamically from server, as scrolling to top, old messages will be retrieved and display on the screen like other messaging apps, but my app keeps generating UIlabel, even though no more old messages presents after all the old messages are retrieved, the UIlabel will still be generated if the list is being scrolled, and the source is from QuartzCore, responsible caller is CA::Render::Shemem::new_shmem(unsigned long).
Can anyone help me, I'm quite new at developing ios, and im using objective-C, the memory issue cause my app crashed on every version of iphones as the UILabel stacks and seems like it will never release unless I switched to other chatrooms. Thanks for any help!!
It sounds like you are adding labels to a scroll view. Change your app to use a table view or a collection view to display messages. These classes automatically remove and reuse cells that are scrolled off the screen.

Understanding the use of views in a Multi-Device Project

This is the first time I have really attempted a Project using Firemonkey, with the Target Platform been Android.
I am finding it difficult trying to understand the workflow with the use of views been somewhat trivial, I just can't seem to grasp the concept at the moment.
I have successfully managed to get the Delphi IDE to recognise my device (Xperia Z2) so when building and running the Project I can see the app on my phone (although so far I am not too impressed, long black screens before anything showing and sometimes the app wont show at all, not to mention slow compilation and linking time).
The first problem I ran into is that controls dont appear on the Android device in the correct places. I added Android 5" Phone as a view as that would be the closest thing to my device, the controls on the Form Designer are aligned to how I want them, for simple testing I just dropped a couple of buttons that are centered in the middle of the form horizontally. When running and viewing the app on my phone however, the buttons are wider than the visible area of the phone, I tried the same with other views such as Android 4" Phone and it's the same. The controls appear lined up correctly on the Delphi Form Designer, but when running and viewing them on my phone they are not lined up at all, it feels like I need to guess where the controls should appear making views seem pointless, after all I cannot test on a multitude of devices and therefore if they don't appear on my phone as they do on the Delphi Form Designer what hope do we have? I expected that how the controls appeared in the view window is exactly how it should appear on my Android deivce but this does not seem the case.
The other view related question is, what is the purpose of the Master View? From my vague understanding you need views to design the layout for each Android device, does this mean then for each device view we have to constantly reposition and move controls independantly for each view? What purpose does the master view have, other than from what I can tell you can only delete controls from the master view and from each view use the Revert to Inherited context menu.
It feels like I need to guess where the controls should appear, the device view at Design Time seems rather inaccurate, surely how you look at the device view on the Form Designer is exactly how it should appear on your Android device?

Vertical Scrolling for iPhone in ActionScript 3

I am working on a project for iPhone (flash builder 4.6), in which I have to implement a custom scroll component.
Basically I have to show the Facebook users in a list render-er, scrolling is working fine initially but when the number of friends increases (more than 300) the scrolling freezes (mainly tapping not working, swipe is still working, I mean to say that MOUSE_MOVE event is not working properly here).
If any one have any idea about it, please share with me.
You need to create (or use an existing) list component that uses a virtual list. i.e. only creates enough cells (or renderers) needed to fill a screen. It then recycles the renderers as you scroll.
Have a look at this:
http://madskool.wordpress.com/2011/06/30/tutorial-3-lists-and-pickers/
Or if you are using stage 3D, http://feathersui.com/examples/components-explorer/

How can I prevent iPad web app from moving whilst allowing internal elements to scroll?

I've been developing an iPad web app over the past three days, and I'm trying to have internal horizontal scrolling, without allowing the rest of the page to move/zoom in ect. Essentially I want to lock it to specific co-ordinates, whilst allowing certain elements to scroll. If you're on an iPad you can see it here: http://streamerforipad.webs.com/app.html. It'll look kinda weird on a desktop. Also, sorry for my abysmal coding skills, I plan to clean it up with external CSS at some point.
P.S. Remember this is a web app so native code is a no-go.
Thanks!
You can disable scrolling within certain element areas using the following:
$("element,element2").bind("touchmove",function(e){
e.preventDefault();
});

Resources