I am navigating from tableview1.row to a tableview2 which has a LOT of rows being fetched. Given the load time is around 3 seconds, I want the navigation to slide into tableview2 as soon as the tableview1.row is selected, and then display a UIActivityIndicatorView above tableview2 whilst the data is fetched and then rendered in its underlying table view. Note, tableview2 is actually a subview of the parent UIView (as opposed to the parent being a UITableView).
I've seen this post: Activity indicator should be displayed when navigating from UITableView1 to UITableView2
... which gives instructions to add the activity indicator start and stopAnimating calls around the data fetch into viewDidLoad of tableview2.
Thing is, I'm not sure how the above solution could work as viewDidLoad runs and completes before tableview2 visibly slides into view.
Separately, I also tried adding an activity indicator over tableview2 in IB and added the IBOutlet indicator's start/stop animating code into viewDidAppear. What happens is the data fetch runs and I can see the indicator spinning but at the end of the fetch, the table view is empty. Seems like viewDidAppear is too late to add data to the table view as cellForRowAtIndexPath etc has already fired.
Can anyone please suggest any pointers? I could very well be missing something obvious here (its nearly 5am where I am and think my brain is mush). Should I re-trigger cellForRowAtIndexPath etc from viewDidAppear? Is the issue that my table view is a subview and not the parent view?
Thanks
I took another look at my own question and the answer is actually pretty straight forward. Any very intensive processing should generally not be run on the main thread. I was attempting to do my data intensive fetch AND UI display of the activity indicator on the same thread and so these were being processed in sequence, one after the other.
Solution is to enter my new view controller and a) kick off the activity indicator animation on the main thread and then b) run the data intensive fetch on another thread (using performSelectorInBackground). Any UI related updates cannot be applied from the background thread. These should be handed back to the main thread.
Plenty of SO posts on this already (example here), my bad for not picking up on these from the start :)
Related
I am writing an application in Meteor with React. I am trying to achieve an infinite scroll feature.
What I am doing is subscribing to a publication with a limit which is tracked by my component's state. When the component detects that it has reached the bottom, it increments the limit in its state.
This triggers a re-render and a subscription to more data.
The issue I have is the whole component being re-rendered. It loses scroll position and takes you to the top.
How do I achieve infinite scroll with pub/sub based on the limit saved in state and only adding extra rows in the component instead of rendering the whole thing?
Subscribing to the whole list with no limits is not an option for me
So, I couldn't find a way to do it with pub/sub so I had to use Meteor.call, that does a mongo's skip() and limit() based on a page to fetch data from the database and then save that data in the component's state.
This way it does not re-render the entire thing but only adds nodes for the new data it receives.
This also means there is none of the automatic socket stuff happening, which is fine for my use case.
One benefit I do get is it's easy to know whether there is more data left in the database to fetch. Surprisingly tricky with pub/sub unless you add a package.
You have to store your data in some stack and enlarge it. React will render only new elements of your stack instead of re-rendering whole component.
I am using the a ViewStack controlled with visibility of selected NavigatorContent being dependent on user selection of an option from a drop down menu.
Each View of the ViewStack has its own separate UI elements including 2-3 DataGrid, charts etc - think of it as a simple school application where each view binds to a course and shows performance of students for that course (while listing students in grid)
Sometimes, there is a problem with showing the data though - before the Rendering completes, the data is ready to be populated; this throws a null exception as the UI element where the data needs to be populated has not been created yet.
For this, I made the 'creationPolicy' set to 'all'. All works just fine after this property is set.
But there certainly are tonnes of performance issues:-
Even if the user never ever visits beyond the 1st visible view, the other views do get rendered (UI elements initialized and created).
Performance hit at startup - startup time is large and grows with the number of views I have (right now I have 9 views with creationPolicy set to all)!! Application was quick to load when only the 1st view was visible by default and creationPolicy was set to default/auto
UI kind of hangs/becomes unresponsive while application starts (as it all happens in the same thread)
What could be a possible solution to this.
These are the solutions that I had in mind, and which didn't work for a reason or two:-
For the first time a view is selected via the dropdown controller (i.e. when the rendering cum UI creation is yet to take place), I can show a preloader or sometime. I tried doing this, but the UI still hangs/becomes unresponsive.
CallLater can it help? Not really, as I would still be creating all views even if they are not required.
So, I need an elegant way of displaying the views (and show some sort of progress or loader) when they are created/instantiated.
Update
I get the Null errors when there is a sort of race condition - when the processing (which returns data to be filled into UI components, lets say a grid) completes before the rendering of the UI element completes - I have recognized why it happens. Initially, I had creationPolicy set to default, so whenever I use to select a view, it was created at that time; and in case the data to be populated was returned before the elements of the view were created there were null pointer (as the UI element I use to refer to were still be created and thus were null at that instance).
Now I am being forced to set the creationPolicy to all so that UI is created for all views and I fire the data processing on selection of that view from the dropdown.
What I'd rather like to do is to have a way to create the UI on demand (and not all of the UI even if it is not being used).
Maybe you shouldn't have the data processing push the results, but vice-versa, have the UI pull the data from the model once the UI controls are ready?
For example, have the data reside in ArrayCollections that you bind to DataGrids. That way, it doesn't matter who finishes first. Data generator doesn't even have to know who or where displays it, and the UI will show the data as soon as ArrayCollection signals that the data has changed.
I would suggest you use modules instead of view stack.
When modules are used separate swf files are created, and not loaded when the application is loaded. A module file is loaded only when it is called through moduleloader.load(module) method.
I am trying to figure out ways to authenticate a user and load the application (while showing a preloader) in Adobe Air [desktop application, and not web based flex app].
This is what I have been able to achieve so far:- A window asks for login details, once validated I make the login window invisible and open an instance of the application's main window. There are 2 problems with this:-
I have to open a new window (2 windows in total). It would rather look better if I was able to simply show the login form in one state and the main application view in another state. I tried that too, but the problem is that besides the view component, flash does execute all the actionscript and keeps the other state ready. There is some application view centric actionscript which starts throwing null reference errors etc. On top of that, the whole things takes a while to show up as both views are created, though only 1 of them is shown
I'd like to show a preloader once the user is authenticated, until the main application view is loaded
In a nutshell, this is what I am trying to do:-
Load the login window as fast as possible and stop there (actionscript in other parts of the application should not run)
Post authentication, load the main view of the application. Show a preloader until the loading is done
Load the main view in the same window (rather than opening a new window and making the login one invisible)
Need help and direction as to how this could be executed.
Thanks!
UPDATE 1
Ok, so now I've managed to consolidate the functionality in a single window. however, the transition between states is not a smooth one.
State 1 is the login screen. If the user enters the correct login credentials, State 2 of the view becomes active.
Now for State 2 to load (its a bunch of UI components and a grid with loads of data) it takes time. Until then, the application blanks out and then all of it is shown in a jerk. Can the transition be made much smoother? Just showing 'Loading...' would suffice. Because State 2 won't show up until all of it has been constructed and State 1 dies away as soon as I change the current state to State 2. Is there any way to monitor the progress and changing the state only when the next state has been loaded!
UPDATE 2
Ok, I got the transition animation to work between states. However, there still exists a problem with the transition switch. The problem is that the state I switch to after login has been verified has a lot of components and shows a lot of data.
Is there a way I can attach Listeners (if any), which I can fire when the state loading is complete and view has been generated! The current jerk like effect in the transition is because the state has changed but the view has not completed yet.
State Change to State 2 is not smooth as State 2 loads about 10000 rows of data from database. Is there a way I can change the state visibly for the user, after state 2 has been completely drawn out and has pulled in all data? creationComplete doesn't help much here.
In short, is there a way to start loading a state from an initial state and make it visible only when its complete loaded? i.e. can I fire an event from state 1 to load state 2, but to visibly transition to state 2 only when state 2 is completely loaded..
UPDATE 3
After a week of firefighting, posting a bounty and scavenging through the web I have still not been able to fix this! My application window becomes unresponsive for the time the UI is created and data is loaded. In Windows, it even shows 'Not Responding' at the window title bar for about 5 seconds. So its the UI getting stuck because the data is taking some time to be fetched and loaded - all of this happens in a single thread by default.
How do people who develop based on Adobe Air do this? I've mostly always seen a loading screen before the actual game is loaded - and when its loaded, its fully functional. There has to be a way!
The time consuming problem of loading 10000 rows in a grid can come in any web based language in any web application because web application needs to run in the environment of a web browser which has its own resource limitation.
So what I would suggest is that you don't load all 10000 records at loading the view. Instead load 1000 records first and then keep a link or button with label "Next" or "Show More" like and on that click bring the next bunch of 1000 records from the database. This way you can accomplish your task.
Thanks,
Jigar Oza
I have a very simple Flex application for mobile phones which uses 3 tabs (with the TabbedViewNavigatorApplication).
It seems that everytime I switch tabs, the selected view is reloaded.
I've set a creationComplete command to do something and everytime I click on the tab it executes the function.
Isn't it possible for the views to get loaded 1 time and that's it?
Seems to me that this behaviour is exactly the point on mobile devices since you want to keep memory / cpu usage as low as possible.
This effectively means destroying all non-active views and all related view components / objects.
However you can override this default behaviour by setting the destructionPolicy on every view to destructionPolicy="never".
This blog post will explain the basic understanding you will need to obtain.
Cheers
OK I've got a little more research on this done so I'm going to totally rephrase the question:
I have two trees, I want to be able to drag items from one tree to the other. In the receiving tree I have some logic that allows or denys the drop. I am using the native cursor feedback Like this :
DragManager.showFeedback(DragManager.COPY);
DragManager.showFeedback(DragManager.NONE);
When the logic determines NONE it properly rejects the item except the drop position indicator sticks like in the screenshot.
I know now that neither dragComplete, nor dragDrop are being fired in this situation, so I have no function to put code into that would clean that up. So how can I listen for this drag rejection?
ScreenShot shows app After drop
alt text http://img687.imageshack.us/img687/2245/treeindicatorstuck.png
Thanks
~Mike
PS with my other question: how-do-i-detect-that-drag-and-drop-operation-ended We have a way of getting an event to fire so we can clean up the tree control. I'm attaching an event listener to the stage so that as the mouse is moved (maybe I'll put it on a timer)it will constantly check if dragmanager.isdragging if it's not it will fire the tree.hideDropFeedBack. This still begs the question, what event is changing the isDragging Boolean and how do I listen for it?
You need to call tree.hideDropFeedback(); or event.target.hideDropFeedback(); to remove the drop indicators.