Прокрутка меню в Corona SDK

#lua #menu #coronasdk

Создаю прокрутку для меню в Lua CORONA SDK.

Исходник файла menu.lua

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

local scene = composer.newScene()

local function onButtonRelease( event )
composer.gotoScene( event.target.id:lower(), { effect="fade", time=300 } )
--composer.recycleOnSceneChange = true
end

function scene:create( event )

local sceneGroup = self.view

local sceneTitle = display.newText( sceneGroup, "Выберете уровень", display.contentCenterX,
10, composer.getVariable( "appFont" ), 20 )

-- Создание массива из кнопок меню
local menuButtons = { "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12",
"13", "14", "15", "16", "17", "18"  }

-- Создание цикла для кнопок меню
local rowNum = 0
for i = 1,#menuButtons do

    rowNum = rowNum+1
    local button = widget.newButton(
        {
            label = menuButtons[i],
            id = menuButtons[i],
            shape = "circle",
            radius = 20,
            font = composer.getVariable( "appFont" ), 
            fontSize = 16,
            fillColor = { default={ 0.12,0.32,0.52,1 } ,over={ 0.132,0.352,0.572,1
} }, -- цвет кнопки и нажатия на кнопку
            labelColor = { default={ 1,1,1,1 }, over={ 1,1,1,1 } }, -- цвет шрифта
на кнопках
            onRelease = onButtonRelease
        })

   mod = math.fmod(i, 2) -- определение кратности

    if (i*mod >= 1 ) then -- если кратно 1
        button.x = display.contentCenterX -50
        elseif (i*mod == 0) then  -- если кратно 0 
            button.x = display.contentCenterX + 50 
        end     
    button.y = 65 + ((rowNum-1)*35) -- растояние по y между кнопками

    sceneGroup:insert( button ) -- обновление сцены после нажатия на кнопку
end

end

scene:addEventListener( "create", scene ) -- слушатель на создание сцены


--обработка касаний
function scene:touch(e)
-- body
if(e.phase == "began") then
        print("начало a");
    elseif (e.phase == "moved") then
        scene.x = e.x;
        scene.y = e.y;
        print("двигаю a");
    elseif(e.phase == "ended") then
        print("отпустил a");
end
end

 scene:addEventListener("touch", scene);

return scene


Для наглядности прикрепляю изображение



По обработке касаний, пробовал как со сценой, так и с меню, и с массивом кнопок.

Подскажите, пожалуйста, решение моей проблемы.
    

Ответы

Ответ 1

Для выполнения поставленной цели, нужно создать scrollView и переместить в функцию
код на создания кнопок в цикле из function scene:create в function showSlidingMenu
и слушать события каждый раз в Runtime. Для реализации прокрутки меню сразу при переходе
в меню, функция вызывается в scene:create   

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

local scene = composer.newScene()

local function onButtonRelease( event )
composer.gotoScene( event.target.id:lower(), { effect="fade", time=300 } )

end

function scene:create( event )

sceneGroup = self.view
composer.recycleOnSceneChange = true;

local sceneTitle = display.newText( sceneGroup, "Выберете уровень", 
display.contentCenterX, 10, composer.getVariable( "appFont" ), 20 )

end 

local function ButtonListener( event )
if ( event.phase == "moved" ) then
    local dx = math.abs( event.x - event.xStart )
    if ( dx > 5 ) then
        scrollView:takeFocus( event )
    end
elseif ( event.phase == "ended" ) then
    print( "клик по объекту" )

    timer.performWithDelay( 10, 
    function() 
    scrollView:removeSelf(); 
    scrollView = nil; 

    Runtime:removeEventListener("touch",showSlidingMenu)
    end )

  end
  return true
 end

function showSlidingMenu( event )
if ( "ended" == event.phase ) then

    scrollView = widget.newScrollView
    {
        width = _W, 
        height = _H,
        scrollWidth = width,
        scrollHeight = height,
        horizontalScrollDisabled = true
    }
    scrollView.x = display.contentCenterX
    scrollView.y = display.contentCenterY       

local  menuButtons = { "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12",
"13", "14", "15", "16", "17", "18"  }
    rowNum = 0
    for i = 1,#menuButtons do

    rowNum = rowNum+1
    local button = widget.newButton(
        {
            label = menuButtons[i],
            id = menuButtons[i],
            shape = "circle",
            radius = 20,
            font = composer.getVariable( "appFont" ), 
            fontSize = 16,
            fillColor = { default={ 0.12,0.32,0.52,1 } ,over={ 0.132,0.352,0.572,1
} }, -- цвет кнопки и нажатия на кнопку
            labelColor = { default={ 1,1,1,1 }, over={ 1,1,1,1 } }, -- цвет шрифта
на кнопках
            onRelease = onButtonRelease
        })

   mod = math.fmod(i, 2) -- определение кратности

    if (i*mod >= 1 ) then -- если кратно 1
        button.x = display.contentCenterX -50 -- смещение относительно центра влево

        elseif (i*mod == 0) then  -- если кратно 0 
            button.x = display.contentCenterX + 50 -- смещение относительно центра впрово
            end     
    button.y = 30 + ((rowNum-1)*35) -- координаты первой кнопки и растояние по y
между кнопками

    scrollView:insert( button )
    sceneGroup:insert( scrollView )

    scene:addEventListener( "touch", ButtonListener )
    end
    return true
end
end

-- hide()
function scene:hide( event )

local sceneGroup = self.view
local phase = event.phase

if ( phase == "will" ) then
    -- Код здесь работает, когда сцена находится на экране (но собирается уйти с экрана)
        print ("ухожу с экрана");

elseif ( phase == "did" ) then
    -- Код здесь запускается сразу после того, как сцена полностью выходит за пределы
экрана
        print ("ушел за пределы экрана");
end
end

-- destroy()
function scene:destroy( event ) 
local sceneGroup = self.view  
showSlidingMenu = nil; 

end

scene:addEventListener( "create", scene ) -- слушатель на создание сцены
scene:addEventListener( "destroy", scene )
scene:addEventListener( "hide", scene )

Runtime:addEventListener("touch",showSlidingMenu)

return scene


Если тема создания меню с помощью Corona SDK интересна, то буду ее развивать