Hello and thanks for your time.
I have an image disappearing upon touchend.
The touchstart (button down) image is appropriately preloaded and is visible, however when the original button image is loaded, it disappears. This only happens the first time the imageview is pressed.
Here is a slow-motion video of the effect: http://youtu.be/cnH8NuxWrIE
Is this an example of garbage collection and it needs to be reloaded? Any way to hold that image in cache?
Here is a sample of the offending code:
xml:
<Alloy> <View formFactor="handheld" class="registrationChooseIndustryContainer" id="registrationChooseIndustryContainer"> <View id="row1"> <View id="choice1"> <ImageView id="choice1Image" formFactor="handheld" image="/images/handheld/1_harley_icon_handheld.png"></ImageView> <ImageView id="choice1Image" formFactor="tablet" image="/images/tablet/1_harley_icon_tablet.png"></ImageView> <Label id="choice1Label" class="row1Label">Harley-Davidson</Label> </View> ...tss:
"#choice1[formFactor=handheld platform=android]": { width: "115dp", height: "95dp", left: "48dp", color: "white" }, "#choice1Image[formFactor=handheld platform=android]": { top: "0dp", width: "106dp" }, "#choice1Label[formFactor=handheld platform=android]": { top: "75dp", font: { fontSize: 14 } }, ...js:
$.choice1.addEventListener( 'click', function(){ Alloy.Globals.state.setIndustry( 'harley' ); Ti.App.fireEvent( 'app:registration:industry:harley' ); } ); //button over states and their reverse values $.choice1.addEventListener( 'touchstart', function(){ $.choice1Image.image = "/images/tablet/1_harley_press_icon_tablet.png"; } ); $.choice1.addEventListener( 'touchend', function(){ $.choice1Image.image = "/images/tablet/1_harley_icon_tablet.png"; } );