【问题标题】:How to make a loading scene in between two scenes while downloading. Corona sdk下载时如何在两个场景之间制作加载场景。电晕sdk
【发布时间】:2017-07-30 21:54:57
【问题描述】:

我正在使用 Corona 开发一个商业应用程序。该界面有点像 gmail 移动应用程序界面。你有一个带有表格的屏幕,当点击一行时,它会打开一个新页面。

接口说明: 应用从 json 对象中的索引元素获取文本和图像链接。对于 json 对象中的每个元素(jsonObject[i]),创建一行并从每个 json 元素中的“imagelink”字段中包含的链接下载图像,而从同一 json 中的其他字段获取文本元素。我正在使用套接字来获取图像并将它们存储在一个临时位置,这样图像就会在所有内容出现之前下载。并且当点击一行时,它会传递当前的json元素(jsonObject[i])以及下载的tempimage,在这个新页面上,会显示tempImage和其他一些没有在表格中使用的字段。

问题:当从场景中前后移动时,表格和页面在单击一行时显示,加载需要一些时间。可以理解,因为它必须下载图像,为此我创建了一个名为“加载”的场景来调用其他两个场景,现在它只有一个平面白框(屏幕大小),我希望它在下一个场景需要一些时间来加载,这样看起来应用程序不会被冻结。

我的问题:“加载”场景不起作用,我知道应用程序加载它,因为我删除了代码中转到下一个屏幕的部分,加载场景显示,但是当它被添加回来时,一切都会像以前一样转换,当前屏幕似乎被冻结,然后像“加载”场景不存在一样进入下一个屏幕。我能得到一些帮助吗?我尝试在“goto”之前使用“loadScene”,但出现了很多错误。谢谢!

我的代码:

ItemListPage.lua

local composer = require ( "composer" )
local widget = require( "widget" )
local json = require( "json" )

-- Load the relevant LuaSocket modules
local http = require( "socket.http" )
local ltn12 = require( "ltn12" )

local scene = composer.newScene()

--To help with navigation, these two variables are set on all scenes except loading
--nextScene is the scene I want loaded after the "loading scene"
--prevScene is the current scene which will soon become the previous.
composer.setVariable( "nextScene", "itemDisplayPage")
composer.setVariable( "prevScene", composer.getSceneName("current"))

--NavigationBar elements initiated
--Removed for readability


--Load Json from local file
local filename = system.pathForFile( "items.json", system.ResourceDirectory )
local decoded, pos, msg = json.decodeFile( filename )

if not decoded then
    print( "Decode failed at "..tostring(pos)..": "..tostring(msg) )
else
    print( "File successfully decoded!" )
end
local items=decoded.items 
--items being JsonObject explained in queston

--image handler
local function networkListener( event )
    if ( event.isError ) then
        print ( "Network error - download failed" )
    end

    print ( "event.response.fullPath: ", event.response.fullPath )
    print ( "event.response.filename: ", event.response.filename )
    print ( "event.response.baseDirectory: ", event.response.baseDirectory )
end



--Table stuff
local scrollBarOptions = {
    sheet = scrollBarSheet,  -- Reference to the image sheet
    topFrame = 1,            -- Number of the "top" frame
    middleFrame = 2,         -- Number of the "middle" frame
    bottomFrame = 3          -- Number of the "bottom" frame
}


local function onRowRender( event )

    -- Get reference to the row group
    local row = event.row
    local params=event.row.params
    local itemRow=3;

    -- Cache the row "contentWidth" and "contentHeight" because the row bounds can change as children objects are added
    local rowHeight = row.contentHeight
    local rowWidth = row.contentWidth

    row.rowTitle = display.newText( row, params.topic, 0, 0, nil, 14 )
    row.rowTitle:setFillColor( 0 )
    row.rowTitle.anchorX = 0
    row.rowTitle.x = 0
    row.rowTitle.y = (rowHeight/2) * 0.5

    --Other elements removed for readabilty (it's all just text objects)

    --Download Image
    --params referring to items[i]
    local imagelink =params.imagelink

    -- Create local file for saving data
    local path = system.pathForFile( params.imagename, system.TemporaryDirectory )
    myFile = io.open( path, "w+b" ) 

    -- Request remote file and save data to local file
    http.request{
        url = imagelink, 
        sink = ltn12.sink.file( myFile )
    }

    row.Image = display.newImageRect(row, params.imagename, system.TemporaryDirectory, 25, 25)
    row.Image.x = 20
    row.Image.y = (rowHeight/2) * 1.5

    row:insert( row.rowTitle )
    row:insert( row.Image )
end

local function onRowTouch( event )
    local row = event.target
    local params=event.target.params

    composer.removeScene(composer.getSceneName("current"))
    composer.gotoScene( "loading" , {params=params})

end

-- Table
local tableView = widget.newTableView(
    {
        left = 0,
        top = navBar.height,
        height = display.contentHeight-navBar.height,
        width = display.contentWidth,
        onRowRender = onRowRender,
        onRowTouch = onRowTouch,
        listener = scrollListener
    }
)

function scene:create( event )
    local sceneGroup = self.view

    -- create a white background to fill screen
    local background = display.newRect( display.contentCenterX, display.contentCenterY, display.contentWidth, display.contentHeight )
    background:setFillColor( 1 )    -- white

    -- Insert rows
        for i = 1, #sermons do
            -- Insert a row into the tableView
            tableView:insertRow{
                rowHeight = 100,
                rowColor = { default={ 0.8, 0.8, 0.8, 0.8 } },
                lineColor = { 1, 0, 0 },
                params=items[i]
            }
        end

    -- all objects must be added to group (e.g. self.view)
    sceneGroup:insert( background )
    sceneGroup:insert( tableView )
end

-- other functions and elements unused and removed for readability

loading.lua

local composer = require ( "composer" )
local widget = require( "widget" )
local json = require( "json" )
local scene = composer.newScene()

local nextParams

function scene:create( event )
local sceneGroup = self.view

nextParams=  event.params  

-- create a white background to fill screen
local background = display.newRect( display.contentCenterX, 

display.contentCenterY, display.contentWidth, display.contentHeight )
    background:setFillColor( 1 )    -- white

    -- all objects must be added to group (e.g. self.view)
    sceneGroup:insert( background )
end

local function showNext(event)
    --go to next scene
    composer.removeScene(composer.getSceneName("current"))
    --Goes to next scene with parameters passed from previous scene
    composer.gotoScene(composer.getVariable( "nextScene" ), {params=nextParams})
    return true
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
        showNext()
    end 
end

-- other functions and elements unused and removed for readability

ItemDisplayPage.lua

local composer = require ( "composer" )
local widget = require( "widget" )
local json = require( "json" )
local scene = composer.newScene()

--To help with navigation, these two variables are set on all scenes except loading
--nextScene is the scene I want loaded after the "loading scene"
--prevScene is the current scene which will soon become the previous.
composer.setVariable( "nextScene", composer.getVariable( "prevScene" ))
composer.setVariable( "prevScene", composer.getSceneName("current"))

--NavigationBar elements initiated
--This creates the "back button", when clicked it returns to the previous scene, in this case "itemListPage"
--it takes, no parameters
local function handleLeftButton( event )
   if ( event.phase == "ended" ) then
        composer.removeScene(composer.getSceneName("current"))
        composer.gotoScene( "loading" , {params=nil})
   end
   return true
end
--Remaning navbar elements removed for readability

function scene:create( event )
local sceneGroup = self.view
local params=event.params

-- create a white background to fill screen
local background = display.newRect( display.contentCenterX, display.contentCenterY, display.contentWidth, display.contentHeight )
background:setFillColor( 1 )    -- white

--creating header bar
local bar = display.newRect( navBar.height + (headerBarHeight*0.5), display.contentCenterY, display.contentWidth, headerBarHeight )
bar:setFillColor( 1 )

-- create stuff
local title = display.newText(params.topic, 0, 0, nil, 14 )
title:setFillColor( 0 )
title.anchorX = 0
title.x = margin
title.y = ((2*headerBarHeight/2) * 0.5)+navBar.height

local Image = display.newImageRect(params.imagename, system.TemporaryDirectory, 25, 25)
Image.x = 50
Image.y = display.contentCenterY


-- all objects must be added to group (e.g. self.view)
sceneGroup:insert( background )
sceneGroup:insert( title )
sceneGroup:insert( Image)

end
-- other functions and elements unused and removed for readability

【问题讨论】:

    标签: android json lua coronasdk scene


    【解决方案1】:

    如果我理解正确,您的场景按以下顺序显示: ItemListPage -> loading -> ItemDisplayPage

    但是加载场景没有任何繁重的工作要做 - 所以它是多余的。

    ItemListPage.lua 上,您在onRowRender 回调中加载图像。当您在scene:create 中调用tableView:insertRow(...) 时会调用此回调。于是就有了freese的根源

    我建议您在ItemListPage 场景create 事件上创建加载叠加层。在向用户显示加载叠加层后,应运行创建表的部分代码 - 在 ItemListPage scene:show 事件中

    function scene:show( event )
      local sceneGroup = self.view
      local phase = event.phase
    
      if phase == "will" then
      elseif phase == "did" then
        composer.showOverlay( "loading", { isModal = true })
        -- Insert rows
        for i = 1, #sermons do
         --put your code here
        end
        composer.hideOverlay( "fade", 100 )
      end 
    end
    

    【讨论】:

    • 谢谢,我现在就试试这个
    • 您好,我似乎遇到了问题,您能否给我指一个页面,该页面解释了如何创建您所说的叠加层
    • @DrewU 首先你可以试试overlay scene。打开您的加载场景,因为覆盖应该可以工作 - 只需从中删除 showNext 方法。我编辑了我的答案。
    • 嘿,伙计,所以我试了一下,我不知道覆盖是否正常工作,但每当我按下后退按钮转到“itemlistPage”后,它仍然会冻结在“itemDisplayPage”上冻结了一点,它只是在表格中立即显示“itemlistPage”以及所有这些,关于如何处理这个问题有什么帮助吗?
    • 我添加了打印语句,所以我知道它进入了加载场景,它没有显示任何内容
    猜你喜欢
    • 1970-01-01
    • 2015-04-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多