Използване на SDK на Corona за манипулиране на графиките
Ключовият компонент на създаването, манипулирането и управлението на графики в 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: вмъкване (displayFirst); displayMain: поставете (displaySecond); displayFirst: toFront (); displaySecond: toFront (); локален фон = display.newImage ("image1.png", 0,0); displayFirst: поставете (фон); локален фон = display.newImage ("image2.png", 0,0); displaySecond: поставете (фон); крайФункцията setupScreen демонстрира как да добавяте групи дисплей към основната група. Използваме и функцията toFront (), за да настроим различните графични слоеве, като слоят, който искаме, е най-горе през цялото време, обявено за последно.
В този пример не е необходимо да се премества displayFirst напред, тъй като по подразбиране ще бъде под групата на втората дисплея, но е добре да се впуснете в навика на изрично наслояване на всяка дисплейна група. Повечето проекти ще завършат с повече от два слоя.
Също така добавихме изображение във всяка група. Когато стартираме приложението, второто изображение трябва да е върху първото изображение.
функция screenLayer () displayFirst: toFront (); крайВече сме пласирали графиките си с дисплейната втора група в горната част на дисплейната първа група. Тази функция ще се придвижи напред в началото на дисплея.
функция moveOne () displaySecond.x = displaySecond.x + global_move_x; крайФункцията moveOne ще премести второто изображение надясно с 20% от ширината на екрана. Когато наречем тази функция, дисплейната втора група ще бъде зад групата за първа показване.
функция 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 ще се задейства и ще донесе image1.png отпред. Функцията moveOne ще премести image2.png извън под image1.png и функцията moveTwo ще се задейства последно, движейки и двете изображения едновременно.
Важно е да запомните, че всяка от тези групи може да има десетки изображения в тях. И както функцията moveTwo премества двете изображения с един ред кодове, всички изображения в рамките на група ще вземат командите, дадени на групата.
Технически, групата "displayMain" може да има както групи за показване, така и изображения, съдържащи се в нея. Обаче, добра практика е някои групи като displayMain да действат като контейнери за други групи без изображения, за да създадат по-добра организация.
Този урок използва обекта на дисплея. Научете повече за обекта на дисплея.