I have a simple RN app, when I call navigator.push({...}) to navigate to a different scene, the current scene slides out towards left, and the new scene slides in from right. The problem is the current scene slides much slower (seems it only moves about 1/4 of the screen width) than the new scene, so the new scene actually catches up and overlaps with the current scene before the current scene disappears.
Any idea on how to fix this?
RN version: 0.34
Navigator (not NavigatorIOS)
I am running the app in simulator.
Thanks in advance.
When testing animations and performance you should ensure that you are not using chrome debugger or devtools. The reason it is slow is because you are running the app JavaScript on a completely different machine and there is a lot of overhead to passing messages back and forth.
https://github.com/facebook/react-native/issues/5632
You can also set Development mode to false and see if it makes a difference.
JavaScript thread performance suffers greatly when running in dev mode. This is unavoidable: a lot more work needs to be done at runtime to provide you with good warnings and error messages, such as validating propTypes and various other assertions.
https://facebook.github.io/react-native/docs/performance.html
OK, I figured this out and it's my own fault -
I turns out the scene on its way out is supposed to move about 1/4 screen width. The scene on its way in 'catches up' and cover the scene on its way out.
My problem was that my second view does not have backgroundColor set, so it became transparent so the content of both scenes 'blended' and looks wrong.
Related
I'm looking for some suggestions to on how to approach an animation/functionality in an iPad app.
My client has tasked me with rebuilding an old app of theirs. They don't have the original code, only the app installed on a simulator on their Mac. The video below was made using the old app on a simulator.
The best way to describe what I'm trying to do is to simply show you a short clip, here: https://youtu.be/odft0pNGdvg
Basically, I need to slide the background/scene/sprite/whatever it may be, over to reveal another panel. Then move tiles over from the new panel onto the main panel. The main panel, while moved somewhat over, can also still be interacted with.
I have a good portion of the app built with SpriteKit already, this last big features alludes me though, lol. Any ideas on how to approach this? One idea I had was stacked SKViews or SKScenes, but I can't really figure that out.
Thanks in advance for any ideas!
Speaking about UIKit structures, I can see a "slide menu" where the left view have a double animation of scaling and fading. Speaking about sprite-kit, if you want to realize something similar to that video, you can make an SKScene with two SKNode, a couple of buttons on the top of the first SKNode to change its behaviour, each node should have a "background" sprite where the left node should have 55% or 60% of the full scene size width, the second node should have the full size of the scene.
The first situation will be: the left node hided and zoomed out and the right node covering the full screen with a zPosition greater than the left node.
Then you should implement the swiping gestures and animating the nodes following your demonstration video, so the left node should move to the right with a right swipe and in the same time left node should appear , scaling and fading to the left part of the screen. It should simple to making.
The current version of my app, running on Android 4.0.4 on an ancient Galaxy Tab has an odd issue when it's running in landscape orientation. I have the CPU usage developer option turned on, and I can see that a single core is being fully utilised when the app is sitting idle, even at it's login screen.
I'm using jQM 1.4.4, WL 6.2.0.01-20141027-1531.
When it's clear that CPU usage idling high for my app, I change to portrait and the CPU usage completely goes away, and the app is responsive again.
Step (CPU usage after a few seconds)
Login Screen (high)
Tap in text field, keyboard appears (none)
Hide keyboard (none)
Switch to portrait (none)
Switch to landscape (high)
On top of that, when I switch from Portrait to Landscape, the view doesn't redraw under the new aspect. The view is constrained to an area (square-ish) as wide as the screen is tall (or wide in portrait). The fixed header disappears but the view is interactive. To fix this, you can tap into a text field which brings up a keyboard. The view updates to fill the screen, and CPU usage is down again.
Other thing to note is that this issue did not exist in the previous version of the app. I've reviewed all changes between the versions and nothing stands out to me that should cause an issue like this.
Suspects:
the page or pagecontainer, popup or fixed header is doing a lot of work that usually should only occur on window resize (no direct changes to the logic here);
the CSS, in particular some responsive queries (there's a breakpoint between landscape and portrait) (no responsive CSS changes)
Other info:
Not a single problem was reported with Samsung Tab 3 running 4.2.2 or a Nexus 7 on 4.4.4 with this version
Tried using weinre to profile this issue except it loses connection soon after opening the app (again, previous version it was fine)
Minor differences between two identical target devices (Samsung Galaxy Tab 10.1): one tablet always performs fares better
I'm about to roll back to the older codebase and iteratively add code back in to see where the issue comes in.
Thanks for reading. Any pointers or suggestions are obviously greatly appreciated.
Update 1
I profiled from within Eclipse (turns out the Timeline inspector tab is pretty useless in weinre).
https://www.dropbox.com/s/ke0a9c2z9krhucu/highThreadUsage.PNG
Doesn't mean much to me. I suspect all that profile really says is 'the webview is doing all the work'.
I've created a new Hybrid app in the same project, and copied everything into it. I'm going to start stripping out chunks of code/functionality to see resolves the issues first.
This is a preliminary answer. I'm still doing the legwork and trying to see what exactly is happening in this situation.
The culprit appears to be a specific panel. A panel I haven't even touched in weeks. The only thing that I can even think of is that I changed the padding-top on .ui-tabs-panel from 1em to 0.5em...
There are two panels that are immediately init'd on app load. The one that slides from the right is the culprit: if I remove the init call and the HTML for it, the app is fine. Putting it all back, and prematurely opening the panel via weinre resolves the issue. Next step, is changing that padding-top back to 1em.
Problem doesn't show up. I repeat this several times over: make a build with 0.5em padding, and another with 1em. Repeat. The 0.5em build always has the issue, the other does not.
I'm going to chalk this up to the most coincidental (read: unlucky) bug, ever.
I'm planning on hardcoding the panel contents to display:none and showing them when the panel is opened. See if that works.
I am an experience programmer, but a newbie to IOS trying to finish off a game and am having trouble with memory running away.
The problem I am seeing can be reproduced simply with al,most no custom code: To simplify, I started with the out-of-the box apple sample project: openGlGame, which produces a single view of spinning cubes. I then added a startup view/controller in front of the spinning cube view/controller. I then added a button on each screen with a segue and an unwind, respectively, so I could go back and forth between a blank startup view, and the spinning cubes.
When profiling this project (using "Allocations"), every time I go back and forth between the views, the memory allocated for the coreAnimation object increases by over 10MB !!
This is roughly the same thing that is happening in my game.
Why is this memory running away? Is there something overlooked in the sample project? Is there something I am overlooking?
Thanks in advance.
In our project we are developing an architecture based on plugins.
Each game is set up as a separate plugin and is responsible for establishing the right environment (SceneManager, SceneNodes, Entities, Lights, ...Cameras,..)
In our last game using a charger scenes, each scene is set up as a separate file (format .dotscene) with all resources defined graphics.
Within this videjuego CEGUI configure as GUI and this works flawlessly. But to go out and load another game we found CEGUI strange behavior .
The cursor position is updated fine but the icon above position is not clear screen, this causes it to accumulate on the screen
[Sceenshot 1] https://www.dropbox.com/s/6kuw0yat7r4s2as/ErrorCEGUI.png
Any idea of the cause and how to fix it?
Very thanks,
Miguel
Solved!
For some internal bugs we were creating additional cameras and CEGUI does not work correctly.
After removed those camera and leave on 1 camera and works!
iOS 6 SDK. Xcode 4.5.
Using storyboard and arc. I am making an application that consists of a number of calculators that compute various formulas. On one scene, I'm using 8 UIButtons that have a PNG file as a background image, and they are labelled as different formula categories to allow the user to navigate to 8 different formulas which are contained in 8 different scenes.
I'm using modal segues and am utilizing the [self.presenting dismissViewController] method to dismiss each scene. That all works fine.
On one calculator in particular, I've set up the scene to resemble an actual calculator. I used a UIImageView with a UILabel on top of it to act like a display. Even without code attached to it, when running on my device, I notice that the transition gets hung up when segueing to that scene. I'm not sure why. Also, whenever I hit a button I get a receives memory warning in the console. I'm also showing a leak in instruments.
This app works perfectly in the simulator but not on the actual phone. I'm not sure what's wrong. Could it be my compiler settings? Or is it the fact that I'm not programmatically setting up the button images? Even when there is just a UIImage with a blue picture PNG and a label on top of it, no buttons or a viewcontroller for this view, it still gets hung up.
I'd appreciate any tips or tutorials or just plain tell me what I'm doing wrong lol.
Thanks.
I found out what was wrong. I was using a very high resolution image on each of those buttons. When I replaced it with a low resolution image the memory issue went away