Strange behaviour in my android app (Android 2.3.5) - Things get inflated wrong - android-layout

I've been experiencing some very strange behavours in an app I'm developing. The app is not very advanced, it stores a couple of places in a sqlite database and is displayed in listviews, on a mapview etc. So, when browsing through my app after deploying it to my phone everything works great, but after a while one listview doesn't get inflated. A scrollbar appears as if the items were there but I can't see them. I push the back button to close the app. When revisiting the app my first view, which has two buttons, gets all messed up. The buttons fill the viewport and the background disappears etc. I can't figure out what's wrong.
Anyone else facing these problems? My phone is a HTC Desire HD with Android 2.3.5
The app is pretty "layout heavy", if you know what I mean. The listview items has custom background images, I'm using custom fonts etc. But the app is running smoothly up to the point when it freaks out and displays/don't display everything wrong.
My first thought is there is some kind of memory issue, ideas?
EDIT:
I believe this might have something to do with defining and using #00000000 as transparent color. Use #android:color/transparent instead.
SOLUTION:
So after doing some testing I found that what I previously mentioned in the edit really is the cause of this problem. I had defined the transparent color in my colors.xml as #00000000. This seems to work, sometimes... And other times it grabs a drawable instead, but not a drawable that is named "transparent", it grabs ANY drawable. Weird but true.

After some testing I finally found the cause of this problem. I had defined the transparent color in my colors.xml as #00000000. This seems to work, sometimes... And other times it grabs a drawable instead, but not a drawable that is named "transparent", it grabs ANY drawable. Weird but true.
So to fix this problem you should use #android:color/transparent instead when you want transparency on, for example, a view background.

If there are memory errors you should be able to catch them in logcat. You'll get "VM failed on xxxx byte allocation" messages (or the like).
Silly/stupid answer: often when I run into layout issues within my app, it's because I needed to do a clean build after having changed my layouts. You might want to start there.
Edit: You might also try the emulator, and if you suspect memory issues you could start the emulator with a small heap to force the issue to occur sooner. You can also check your heap usage in DDMS or with the Eclipse MAT to see if it's leaking.

I was experiencing the same problem on Galaxy tab even with #android:color/transparent. Was able to fix it only by replacing android:background="#color/transparent" with android:background="#null".

Related

Android Studio emulator screen collapse

I'm using the emulator with Android Studio, and I'm experiencing the phenomenon shown in the image below.
The problem occurs only when the screen is turned sideways.
It does not happen in the default screen.
I don't know how to solve this problem, and I was wondering if you could tell me something that would help me.
Thank you very much!
You can solve this in three ways:
disable screen rotation - add this to the manifest XML under the relevant activity
android:screenOrientation="portrait"
If you want to go the long and better route it seems to me that you are using a layout that is not constraint layout, the latter supports rotation better, and when constraint correctly what is shown here should not happen.
If all else fails you can use special layout when the screen is in landscape mode, you can read more here:
Android Studio: Creating landscape layouts

Section at bottom of screen that doesn't respond to onpress event, what's causing this?

I'm working on an existing React-Native app, and in the iOS version, there's a problem where a portion of the bottom of the screen does not respond. At first it was thought to be on a specific screen, but upon further investigation, it was found to be affecting other screens as well. The control used on the first screen where the problem was noticed is TouchableOpacity, but a rectangular section in the middle at the bottom of the screen does not respond, but in either corner at the bottom of the screen it does respond. Another screen has a ListView, and if you attempt to scroll from that same bottom middle area, it won't, but everywhere else, it will. This is evident in both the simulator and on the physical device. It acts like there's something in the road floating over the top of everything.
I've tried using the Accessibility Inspector to identify the cause, but this hasn't revealed anything.
The highlighted area in the screenshot above is where I'm referring to.
To complicate things further, this problem doesn't exist in the Android version.
Has anyone experienced this before, and if so, what was the cause and how do I fix it?
Edit: I've now determined the cause is an Animated View that's hanging about, it seems not all the child elements within it are having their opacity set to 0. I've attempted to address this using pointerEvents, but this just moves the problem to a different child element.
Anyone have any suggestions?
The issue turned out to be that the parent was having it's height changed during the show and hide events to avoid this same issue in Android, so we need to only change it if the platform is Android.
this.setState({height: (Platform.OS === 'ios') ? 50: 0});

Green square on game canvas using Phaser

Can someone please tell me why I'm getting a green square on my Phaser game canvas as below?
Without seeing any code I can tell you that you'll see that when an image can't be loaded by the Phaser framework.
Open developer tools in your browser of choice and refresh after opening the Network tab. You should see a 404 for one of your images.
I believe if you look at the standard browser console you may also see messages about the name of the asset that it failed to load.
I had a slightly different case. Images were being loaded in the init function, which apparently doesn't work. I renamed that function to preload and suddenly the green squares are gone and the images show up.
My case was also a little different too; it appeared that all my image resources were loaded, but I think I was trying to create the sprites a little too quickly - in order words, I was trying to create and add sprites to my scene before the scene was properly loaded.
I'm going to try waiting until 'scene.scene.isActive(key);' returns a boolean of true.....maybe that's what will solve my issue. Failing that, I might just put in some sort of sleep/await promise of 1 second or something (not ideal, but might work)
ALSO NOTE: Part of the reason I was able to create my sprites too quickly was because I was doing so in my own custom function, not the typical create() function. Actually, the best solution is probably to create my sprites in the create() function and not a custom function...

Glimpse screen takes up the whole page. How to resize it?

I have an irritating problem with Glimpse.
I wanted to see everything I can on a Glimpse tab so I maximised it's size on the page.
Now I cannot resize it back again. There is no edge I can drag down. I am sure there is a simple way of sorting this. I tried switching off Glimpse, but when I switched it back on again it was taking up the whole screen again. I don't want to install and uninstall, so how do I fix this easily?
I am using ie10
I find a way of fixing this, which is to go into Developer Tools and change the css settings dynamically by using the CSS top class, replacing another class like margin, and putting in 200px and then resizing from that.
Another option is launch the Glimpse as Standalone tool.

Components in module disappear when browser is resized (Flex 3)

We have this Flex app built on Builder 3 and we're using SuperTabNavigator from FlexLib to have some modules displayed. The thing is, whenever the user resizes the browser window all the contents on any tabs open simply disappear and there's no way to get them back. This only happens the first time, so if you close these 'broken' tabs and reopen them, you can resize all you want, but you still lost all you were doing in them and this is unacceptable. I've done some testing and found the module in that tab doesn't dispatch the resize events when this happens. It's dispatched when it opens (everything is set to 100% to fit the browser window, so it resizes on startup) and every other time you resize it without 'breaking' it. It gets weirder. I've also found that resizing works perfectly as long as you resize it to a size larger than the original (i.e. you open it in a browser window that is restored and then maximized), but even after doing that, if you change its size back to something even a pixel smaller than the original, the module just disappears. Everything else remains in perfect working conditions: any components outside tabs and the tabs itself work, but (summing up) anything within any tab open at the moment you first resize the browser window to a size smaller than the original just disappears.
I understand that this is a weird problem and hope some of you might be able to help me. Feel free to ask any questions if anything wasn't clear.
Thanks in advance.
I had this exact same problem with my application. The issue stemmed from the fact that the RemovedFromStage event was being fired when the window was sized smaller than its original size. I was catching the RemovedFromStage event and hiding my component, which resulted in this behavior. A more detailed explanation can be found here.

Resources