Како да се слое, да се помести и да се пренесат графика на предната страна

Користење на Corona SDK за манипулирање со графика

Клучната компонента за креирање, манипулирање и управување со графика во Corona SDK е прикажаниот објект. Не само што овој објект може да се користи за прикажување на слика од датотека, можеби исто толку важно, тоа ви овозможува да ги групирате сликите заедно. Ова ви овозможува да го поместите целиот сет на графика околу екранот одеднаш и слој графика на врвот на едни со други.

Ова упатство ќе ве научи на основите на користење на групи за прикажување за да ги организирате графичките објекти во вашиот проект. Ова ќе биде демонстрирано со создавање на два различни слоја, од кои еден ќе го претставува нормалниот екран, а друг претставува модален слој кој ќе се стави на врвот. Покрај слоењето на графика, ние ќе го користиме и транзициониот објект за да ја преместите целата модална група.

Како да ја продавате апликацијата

Забелешка: За да следите заедно со ова упатство, ќе ви требаат две слики: 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 () прикажувањеMain: вметнете (displayFirst); displayMain: вметнување (прикажување на второто); displayFirst: toFront (); прикажисето: toFront (); локална позадина = display.newImage ("image1.png", 0,0); displayFirst: вметнете (позадина); локална позадина = display.newImage ("image2.png", 0,0); дисплејВторо: вметнете (позадина); крајот

Функцијата setupScreen покажува како да додадете групи за прикажување во главната група за прикажување. Ние, исто така, ја користиме функцијата toFront () за поставување на различни графички слоеви, со слојот што го сакаме на врвот на целото време прогласено последно.

Во овој пример, навистина не е потребно да се помести displayFirst на предната страна, бидејќи тоа ќе биде стандардно да биде под displaySecond група, но добро е да се навикнеш на експлицитно поставување на секоја група на приказ. Повеќето проекти ќе завршат со повеќе од два слоја.

Исто така додадовме слика за секоја група. Кога ќе ја стартуваме апликацијата, втората слика треба да биде на врвот на првата слика.

функција екранLayer () displayFirst: toFront (); крајот

Ние веќе ја наредивме нашата графика со displaySecond групата на врвот на displayFirst групата. Оваа функција ќе се премести на дисплејотПрво напред.

функцијата moveOne () прикажувањеSecond.x = прикажувањеSecond.x + global_move_x; крајот

Функцијата moveOne ќе ја премести втората слика на десната страна за 20% од ширината на екранот. Кога ја нарекуваме оваа функција, прикажаната група ќе биде зад displayFirst групата.

функцијата 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 ќе продолжи да се активира, истовремено преместување на двете слики.

Како да го поправите бавниот iPad

Важно е да се запамети дека секоја од овие групи може да има десетици слики во нив. И токму кога функцијата moveTwo ги помести и двете слики со една линија на код, сите слики во групата ќе ги земат командите дадени на групата.

Технички, групата displayMain може да има групи за прикажување и слики содржани во неа. Сепак, добра практика е да им дозволите на некои групи како displayMain да дејствуваат како контејнери за други групи без слики за да се создаде подобра организација.

Овој туторијал го користи објектот за прикажување. Дознајте повеќе за објектот за прикажување.

Како да започнете Развивање на iPad Apps