Having an Issue with the SceneGroup

When I build my app I have a few textboxes on one of my scenes and i;m using a scrollview with all the textboxes in, now when I change the scene the textboxes don’t disappear like I thought they and I have no idea why. Does anyone know? My code looks like this and I’ve also attached my source documents.

[lua]


– home.lua


local composer = require( “composer” )

local scene = composer.newScene()

local widget = require( “widget” )

function scene:create( event )

local sceneGroup = self.view

– Called when the scene’s view does not exist.

– 

– INSERT code here to initialize the scene

– e.g. add display objects to ‘sceneGroup’, add touch listeners, etc.

– Scroll

local scrollView = widget.newScrollView

{

   top = - 28,

   left = 0,

   width = display.contentWidth,

   height = display.contentHeight + 20,

   horizontalScrollDisabled = true,

   scrollHeight = 480,

   listener = scrollListener,

   topPadding = 25

  }

–Scene Backgroud

local bg = display.newRect( 0, 0, display.contentWidth, display.contentHeight )

bg.anchorX = 0

bg.anchorY = 0

bg:setFillColor( 1 ) – white

scrollView:insert( bg )

–Scene Title

local title = display.newText( “Incident Reporting”, 0, 0, native.systemFont, 32 )

title:setFillColor( 0 ) – black

title.x = display.contentWidth * 0.5

title.y = -10

scrollView:insert( title )

–text1

local text1 = display.newText(“THIS FORM SHOULD BE USED BY STAFF AND STUDENTS TO REPORT ANY INCIDENT OR NEAR MISS. PLEASE PROVIDE AS MUCH INFORMATION AS YOU CAN. IN SOME CASES THE SAFETY, HEALTH & WELLBEING DEPARTMENT MAY CONTACT YOU FOR MORE INFORMATION. THE WE ENCOURAGE ALL STAFF TO REPORT INCIDENTS AND NEAR MISSES AND THE FACTUAL INFORMATION YOU TELL US WILL BE REVIEWED AND USED AS AN OPPORTUNITY TO LEARN AND IMPROVE.”, 

160, 150, display.contentWidth -25 , display.contentHeight * 0.5, native.systemFont, 12 )

text1:setFillColor( 0, 0, 0 )

scrollView:insert( text1 )

–divider

local divider = display.newImage( “divider.png” )

divider:translate( 160, 170 )

scrollView:insert( divider )

–textSectionA

local textSectionA = display.newText(“Section A: About the Incident”, 

172, 315, display.contentWidth, display.contentHeight * 0.5, native.systemFont, 20 )

textSectionA:setFillColor( 0, 0, 0 )

scrollView:insert( textSectionA )

–textDate

local textDate = display.newText(“Incident Date: (DD/MM/YY)”, 

175, 350, display.contentWidth, display.contentHeight * 0.5, native.systemFont, 13 )

textDate:setFillColor( 0, 0, 0 )

scrollView:insert( textDate )

–textBoxDay

local textBoxDay = native.newTextField( 54, 270, 75, 40 )

textBoxDay.size = 20

textBoxDay:addEventListener( “userInput”, textBoxDay )

textBoxDay.inputType = “number”

scrollView:insert( textBoxDay )

–forwardSlash

local forwardSlash = display.newImage( “forwardSlash.png” )

forwardSlash:translate( 105, 270 )

scrollView:insert( forwardSlash )

–textBoxMonth

local textBoxMonth = native.newTextField( 156, 270, 75, 40 )

textBoxMonth.size = 20

textBoxMonth:addEventListener( “userInput”, textBoxMonth )

textBoxMonth.inputType = “number”

scrollView:insert( textBoxMonth )

–forwardSlash

local forwardSlash = display.newImage( “forwardSlash.png” )

forwardSlash:translate( 207, 270 )

scrollView:insert( forwardSlash )

–textBoxYear

local textBoxYear = native.newTextField( 258, 270, 75, 40 )

textBoxYear.size = 20

textBoxYear:addEventListener( “userInput”, textBoxYear )

textBoxYear.inputType = “number”

scrollView:insert( textBoxYear )

–textTime

local textTime = display.newText(“Incident Time: (HH:MM)”, 

175, 430, display.contentWidth, display.contentHeight * 0.5, native.systemFont, 13 )

textTime:setFillColor( 0, 0, 0 )

scrollView:insert( textTime )

–textBoxHour

local textBoxHour = native.newTextField( 156, 350, 75, 40 )

textBoxHour.size = 20

textBoxHour:addEventListener( “userInput”, textBoxHour )

textBoxHour.inputType = “number”

scrollView:insert( textBoxHour )

–semiColon

local semiColon = display.newImage( “semiColon.png” )

semiColon:translate( 105, 350 )

scrollView:insert( semiColon )

–textBoxMinute

local textBoxMinute = native.newTextField( 54, 350, 75, 40 )

textBoxMinute.size = 20

textBoxMinute:addEventListener( “userInput”, textBoxMinute )

textBoxMinute.inputType = “number”

scrollView:insert( textBoxMinute )

–textWasThis

local textWasThis = display.newText(“Was this an incident that caused harm?”, 

212, 532, display.contentWidth, display.contentHeight * 0.5, native.systemFont, 13 )

textWasThis:setFillColor( 0, 0, 0 )

scrollView:insert( textWasThis )

–textEgPer

local textEgPer = display.newText(“eg personal harm or damage to property”, 

212, 547, display.contentWidth, display.contentHeight * 0.5, native.systemFont, 11 )

textEgPer:setFillColor( 0, 0, 0 )

scrollView:insert( textEgPer )

–checkbox1

local checkbox1 = widget.newSwitch

{

    left = 10,

    top = 410,

    style = “checkbox”,

    id = “checkbox1”,

}

scrollView:insert( checkbox1 )

–textWasThisA

local textWasThisA = display.newText(“Was this a Near Miss (No Harm)?”, 

212, 590, display.contentWidth, display.contentHeight * 0.5, native.systemFont, 13 )

textWasThisA:setFillColor( 0, 0, 0 )

scrollView:insert( textWasThisA )

–checkbox2

local checkbox2 = widget.newSwitch

{

   left = 10,

   top = 460,

   style = “checkbox”,

   id = “checkbox2”,

}

scrollView:insert( checkbox2 )

–divider

local divider = display.newImage( “divider.png” )

divider:translate( 160, 515 )

scrollView:insert( divider )

–textWhoWas

local textWhoWas = display.newText(“Who was affected by or at risk by the incident?”, 

172, 655, display.contentWidth, display.contentHeight * 0.5, native.systemFont, 20 )

textWhoWas:setFillColor( 0, 0, 0 )

scrollView:insert( textWhoWas )

–textStaff

local textStaff = display.newText(“Staff”, 

212, 720, display.contentWidth, display.contentHeight * 0.5, native.systemFont, 13 )

textStaff:setFillColor( 0, 0, 0 )

scrollView:insert( textStaff )

–checkbox3

local checkbox3 = widget.newSwitch

{

   left = 10,

   top = 590,

   style = “checkbox”,

   id = “checkbox3”,

}

scrollView:insert( checkbox3 )

–textStudent

local textStudent = display.newText(“Student”, 

212, 770, display.contentWidth, display.contentHeight * 0.5, native.systemFont, 13 )

textStudent:setFillColor( 0, 0, 0 )

scrollView:insert( textStudent )

–checkbox4

local checkbox4 = widget.newSwitch

{

   left = 10,

   top = 640,

   style = “checkbox”,

   id = “checkbox4”,

}

scrollView:insert( checkbox4 )

–textPublic

local textPublic = display.newText(“Public/Visitor”, 

212, 820, display.contentWidth, display.contentHeight * 0.5, native.systemFont, 13 )

textPublic:setFillColor( 0, 0, 0 )

scrollView:insert( textPublic )

–checkbox5

local checkbox5 = widget.newSwitch

{

   left = 10,

   top = 690,

   style = “checkbox”,

   id = “checkbox5”,

}

scrollView:insert( checkbox5 )

–textContractor

local textContractor = display.newText(“Contractor”, 

212, 870, display.contentWidth, display.contentHeight * 0.5, native.systemFont, 13 )

textContractor:setFillColor( 0, 0, 0 )

scrollView:insert( textContractor )

–checkbox6

local checkbox6 = widget.newSwitch

{

   left = 10,

   top = 740,

   style = “checkbox”,

   id = “checkbox6”,

}

scrollView:insert( checkbox6 )

–Scene Group

sceneGroup:insert( scrollView )

end

function scene:show( event )

local sceneGroup = self.view

local phase = event.phase

if phase == “will” then

– Called when the scene is still off screen and is about to move on screen

elseif phase == “did” then

– Called when the scene is now on screen

– 

– INSERT code here to make the scene come alive

– e.g. start timers, begin animation, play audio, etc.

end

end

function scene:hide( event )

local sceneGroup = self.view

local phase = event.phase

if event.phase == “will” then

– Called when the scene is on screen and is about to move off screen

– INSERT code here to pause the scene

– e.g. stop timers, stop animation, unload sounds, etc.)

elseif phase == “did” then

– Called when the scene is now off screen

end

end

function scene:destroy( event )

local sceneGroup = self.view

– Called prior to the removal of scene’s “view” (sceneGroup)

– 

– INSERT code here to cleanup the scene

– e.g. remove display objects, remove touch listeners, save state, etc.

end


– Listener setup

scene:addEventListener( “create”, scene )

scene:addEventListener( “show”, scene )

scene:addEventListener( “hide”, scene )

scene:addEventListener( “destroy”, scene )


return scene

[/lua]

Thanks,

Matt. :slight_smile:

Hi @sulmaxcp,

What kind of scene change transition are you using? A moving (scrolling) type or otherwise? When you say the text fields “don’t disappear”, do you mean they remain on the screen completely, never moving or anything whatsoever when the scene changes?

Thanks,

Brent

I have 3 pages Home, Forms and Settings

I’m on the Forms Page which has 3 forms on it which all have their own pages.

My currently using one called Incident Report, which has my textboxes on, there are many things on this scene including my textboxes which is why I needed to use a scrollview. The textboxes will move up and down the page when i’m on the Incident Report scene but if I click to a different scene when I’m on the Incident Report page and the textboxes are on the scene the follow onto which ever other scene I click on such as Home, Forms or Settings.

Thanks,

Matt.

Hi Matt,

I don’t know what is happening in your code. I tested using native text fields in a scrollView, with that scrollView inserted into the Composer scene, and when I change/remove that scene, the text fields go with it. I can only suggest that you carefully check your code and ensure that you have not accidentally inserted the scrollView (and thus the native fields) into a group that’s not part of the scene’s view.

Best regards,

Brent

This is a simpler version of what I want to do I has 12 textbox fields and they are all in a scrollView and I have then put the scrollView in the sceneGroup. However, I still get the same result?

[lua]


– textboxes.lua


local composer = require( “composer” )

local scene = composer.newScene()

local widget = require( “widget” )

function scene:create( event )

local sceneGroup = self.view

– Scroll

local scrollView = widget.newScrollView

{

   top = - 28,

   left = 0,

   width = display.contentWidth,

   height = display.contentHeight + 20,

   horizontalScrollDisabled = true,

   scrollHeight = 480,

   listener = scrollListener,

   topPadding = 25

  }

local bg = display.newRect( 0, 0, display.contentWidth, display.contentHeight )

bg.anchorX = 0

bg.anchorY = 0

bg:setFillColor( 1 )

scrollView:insert( bg )

–textBox1

local textBox1 = native.newTextField( 160, 10, 300, 40 )

textBox1.size = 20

textBox1:addEventListener( “userInput”, textBox1 )

textBox1.inputType = “number”

scrollView:insert( textBox1 )

–textBox2

local textBox2 = native.newTextField( 160, 60, 300, 40 )

textBox2.size = 20

textBox2:addEventListener( “userInput”, textBox2 )

textBox2.inputType = “number”

scrollView:insert( textBox2 )

–textBox1

local textBox3 = native.newTextField( 160, 110, 300, 40 )

textBox3.size = 20

textBox3:addEventListener( “userInput”, textBox3 )

textBox3.inputType = “number”

scrollView:insert( textBox3 )

–textBox4

local textBox4 = native.newTextField( 160, 160, 300, 40 )

textBox4.size = 20

textBox4:addEventListener( “userInput”, textBox4 )

textBox4.inputType = “number”

scrollView:insert( textBox4 )

–textBox5

local textBox5 = native.newTextField( 160, 210, 300, 40 )

textBox5.size = 20

textBox5:addEventListener( “userInput”, textBox5 )

textBox5.inputType = “number”

scrollView:insert( textBox5 )

–textBox6

local textBox6 = native.newTextField( 160, 260, 300, 40 )

textBox6.size = 20

textBox6:addEventListener( “userInput”, textBox6 )

textBox6.inputType = “number”

scrollView:insert( textBox6 )

–textBox7

local textBox7 = native.newTextField( 160, 310, 300, 40 )

textBox7.size = 20

textBox7:addEventListener( “userInput”, textBox7 )

textBox7.inputType = “number”

scrollView:insert( textBox7 )

–textBox8

local textBox8 = native.newTextField( 160, 360, 300, 40 )

textBox8.size = 20

textBox8:addEventListener( “userInput”, textBox8 )

textBox8.inputType = “number”

scrollView:insert( textBox8 )

–textBox9

local textBox9 = native.newTextField( 160, 410, 300, 40 )

textBox9.size = 20

textBox9:addEventListener( “userInput”, textBox9 )

textBox9.inputType = “number”

scrollView:insert( textBox9 )

–textBox10

local textBox10 = native.newTextField( 160, 460, 300, 40 )

textBox10.size = 20

textBox10:addEventListener( “userInput”, textBox10 )

textBox10.inputType = “number”

scrollView:insert( textBox10 )

–textBox11

local textBox11 = native.newTextField( 160, 510, 300, 40 )

textBox11.size = 20

textBox11:addEventListener( “userInput”, textBox11 )

textBox11.inputType = “number”

scrollView:insert( textBox11 )

–textBox12

local textBox12 = native.newTextField( 160, 560, 300, 40 )

textBox12.size = 20

textBox12:addEventListener( “userInput”, textBox12 )

textBox12.inputType = “number”

scrollView:insert( textBox12 )

sceneGroup:insert( scrollView )

end

function scene:show( event )

local sceneGroup = self.view

end

function scene:hide( event )

local sceneGroup = self.view

end

function scene:destroy( event )

local sceneGroup = self.view

end


– Listener setup

scene:addEventListener( “create”, scene )

scene:addEventListener( “show”, scene )

scene:addEventListener( “hide”, scene )

scene:addEventListener( “destroy”, scene )


return scene

[/lua]

Thanks,

Matt.

Hi Matt,

Before I continue to assist you, can you edit/close this thread or the other thread which seems to be talking about the same thing? I think you have two threads in the forums on this exact same topic, so I’m not sure what the status of your situation is.

Thanks,

Brent

Just closed the other thread, so this one is the only thread now which is up to date.

Thanks,
Matt.

Hi Matt,

Can you answer the questions that Rob and I have asked you previously? For example, do the native fields do anything at all? Or do they absolutely stay locked in place on the screen on scene transition? Also, what kind of transition are you using? Fade, slideIn/Out, crossFade?

Brent

I’m not using any scene transitions, when I click one of my tab buttons to change scene everything disappears from the current scene and everything appears from the new scene at the same time in a slit of a second. The native fields move in the scrollview when on the correct scene, but when the scene is changed they stay on screen and do not move but can still be opened and used.
Hope this helps.

Matt.

Hi Matt,

What is the “tab button” you refer to? Where do you create your tabs? When clicked, what is the action you take?

Thanks,

Brent

The tab buttons are in my main.lua and the when click action is simply composer.goto(“home”) etc

Thanks,
Matt.

Hi Matt,

Can I ask you to test something? When you switch to a new scene, add a scene transition effect like this…

[lua]

composer.gotoScene( “home”, { effect=“slideUp”, time=800 } )

[/lua]

…and tell me if the behavior is any different for the native fields.

Brent

This has worked to a certain degree, I have two sets of native fields at the top of the scene and one at the bottom (which is of the screen in the scrollview at the bottom). Rather than them staying on the screen when I change the scene it now removes the top two if on screen and moved the last up the screen if it wasn’t on screen. But if the bottom native field is on the screen and I change the scene then it worked perfectly. So this worked but still left one of the three native fields on screen if the scrollview was at the top of the screen.  

Thanks,

Matt.

Hi Matt,

This is interesting. So basically, the behavior depends on whether the native field is on-screen or off-screen? They don’t move in unison with each other?

I made a quick example of how I think it is working at the moment.

a.1

On Forms Screen - When the page is first opened and the scrollview is at the top of the page, where the two native fields are at the top and on screen but the one at the bottom is off screen.

a.2

On Home Screen - Home button in tab has been pressed and all the native fields have moved up the screen. So the two native fields at the top are now off screen and the bottom one is now on screen.

b1.

On Forms Screen - When the page has been scrolled down to the so that the top two native fields are off screen and the bottom one is now on the screen.

b.2 

On Home Screen - Home button in tab has been pressed and now the all the native fields have moved up after the scrollview has been scrolled so that no native fields are on screen any longer. 

Hope this helps to fix this issue

Thanks,

Matt.

Hi Matt,

I probably need to look at your sample project at this point. Something is amiss, but it might be an obvious thing I’m just not detecting without seeing the code. Do you have a somewhat isolated project to zip up?

Brent

Yes that’s not an issue I have attached a copy into the attachments, bear in mind that the only way for the issue with the native fields is to build it and upload it to a device. As when I tried testing it in the simulator it looks as if there is no problems.

Thanks again,

Matt.

Hi Matt,

I experimented a bit with your project, and the results are a little odd. I had better luck, however, when I used left or right-direction scene transitions, versus up or down. When doing so, the fields didn’t seem to get “left behind” when moving around scenes. Could you test that out a bit and see if you get the same results?

Brent

Hi Brent,

It seems as if it has been the best method so far, it looks clean and simple which is great the native fields no longer stay on the screen as well. However, if you change between the scenes slightly too fast after changing scene it makes the opened scene go blank which is odd.

Thanks,

Matt. 

Hi Matt,

This sounds potentially unrelated to the other stuff. Are you getting any error messages in the console/Terminal?

Brent