Основным компонентом создания, управления и управления графикой в SDK Corona является экранный объект. Этот объект не только может использоваться для отображения изображения из файла, возможно, так же важно, он позволяет группировать ваши изображения вместе. Это позволяет сразу перемещать весь набор графических элементов по экрану, а слои - поверх друг друга.
В этом учебном пособии вы научитесь основам использования групп отображения для организации графических объектов в вашем проекте. Это будет продемонстрировано путем создания двух разных слоев, один из которых представляет собой обычный экран, а другой представляет собой модальный слой для размещения поверх него. Помимо наложения графики, мы также будем использовать объект перехода для перемещения всей модальной группы.
Как продать свое приложение
Замечания: Чтобы следовать этому руководству, вам понадобятся два изображения: image1.png и image2.png. Это могут быть любые изображения, которые вы выбираете, но учебник будет работать лучше всего, если у вас есть изображения размером около 100 пикселей на 100 пикселей. Это позволит вам легко увидеть, что происходит с изображениями.
Чтобы начать работу, мы откроем новый файл main.lua и начнем строить наш код:
displayMain = display.newGroup (); displayFirst = display.newGroup (); displaySecond = display.newGroup (); global_move_x = display.contentWidth / 5;
Этот раздел кода устанавливает нашу библиотеку ui и объявляет через отображаемые группы: displayMain, displayFirst и displaySecond. Мы будем использовать их для первого слоя нашей графики, а затем переместите их. Значение переменной global_move_x равно 20% от ширины дисплея, чтобы мы могли видеть движение.
функция setupScreen () displayMain: insert (displayFirst); displayMain: вставка (displaySecond); displayFirst: toFront (); displaySecond: toFront (); local background = display.newImage ("image1.png", 0,0); displayFirst: вставка (фон); local background = display.newImage ("image2.png", 0,0); displaySecond: вставка (фон); конец
Функция setupScreen демонстрирует, как добавить группы отображения в основную группу отображения. Мы также используем функцию toFront () для настройки разных графических слоев, причем слой, который мы хотим на вершине, объявляем последним.
В этом примере на самом деле не нужно перемещать displayFirst на передний план, так как по умолчанию он будет ниже группы displaySecond, но хорошо привыкнуть к явному расслоению каждой группы отображения. Большинство проектов будут иметь более двух уровней.
Мы также добавили изображение в каждую группу. Когда мы запускаем приложение, второе изображение должно быть сверху первого изображения.
function screenLayer () displayFirst: toFront (); конец
Мы уже нарисовали нашу графику с помощью группы displaySecond поверх группы displayFirst. Эта функция будет перемещать displayFirst на фронт.
функция moveOne () displaySecond.x = displaySecond.x + global_move_x; конец
Функция moveOne переместит второе изображение вправо на 20% ширины экрана. Когда мы вызываем эту функцию, группа displaySecond будет за дисплеем первой группы.
функция moveTwo () displayMain.x = displayMain.x + global_move_x; конец
Функция moveTwo будет перемещать оба изображения вправо на 20% от ширины экрана. Однако вместо того, чтобы перемещать каждую группу по отдельности, мы будем использовать группу displayMain для перемещения их одновременно. Это отличный пример того, как группа отображения, содержащая несколько групп отображения, может использоваться для одновременного управления множеством графиков.
setupScreen (); timer.performWithDelay (1000, screenLayer); timer.performWithDelay (2000, moveOne); timer.performWithDelay (3000, moveTwo);
Этот последний бит кода демонстрирует, что происходит, когда мы запускаем эти функции. Мы будем использовать функцию timer.performWithDelay для запуска функций каждую секунду после запуска приложения. Если вы не знакомы с этой функцией, первой переменной является время задержки, выраженное в миллисекундах, а вторая - функция, которую мы хотим запустить после этой задержки.
Когда вы запускаете приложение, вы должны иметь image2.png поверх image1.png. Функция screenLayer запускает и выводит изображение1.png на передний план. Функция moveOne будет перемещать image2.png из-под изображения1.png, и функция moveTwo будет срабатывать последним, одновременно перемещая оба изображения.
Как исправить медленный iPad
Важно помнить, что каждая из этих групп могла иметь в себе десятки изображений. И так же, как функция moveTwo перемещает оба изображения с одной строкой кода, все изображения внутри группы будут принимать команды, переданные группе.
Технически группа displayMain может иметь как отображаемые группы, так и изображения, содержащиеся в ней. Однако хорошей практикой является то, что некоторые группы, такие как displayMain, действуют как контейнеры для других групп без каких-либо изображений, чтобы создать лучшую организацию.
В этом учебнике используется экранный объект. Подробнее о экранном объекте …
Как начать разработку iPad-приложений
