Gamit ang Corona SDK upang Manipulate Graphics
Ang pangunahing sangkap ng paglikha, pagmamanipula at pamamahala ng mga graphics sa Corona SDK ay ang display object. Hindi lamang maaaring gamitin ang bagay na ito upang magpakita ng isang imahe mula sa isang file, marahil tulad ng mahalaga, ito ay nagbibigay-daan sa iyo upang pangkatin ang iyong mga imahe magkasama. Ito ay nagbibigay-daan sa iyo upang ilipat ang isang buong hanay ng mga graphics sa paligid ng screen nang sabay-sabay at layer graphics sa tuktok ng bawat isa.
Itaturo sa iyo ng tutorial na ito ang mga pangunahing kaalaman sa paggamit ng mga pangkat ng display upang maisaayos ang mga graphical na bagay sa iyong proyekto. Ipapakita ito sa pamamagitan ng paglikha ng dalawang magkakaibang layer, isa na kumakatawan sa normal na screen at isa pang kumakatawan sa isang modal layer upang ilagay sa itaas nito. Bilang karagdagan sa pagpapadulas ng mga graphics, gagamitin din namin ang transition object upang ilipat ang buong grupo ng modal.
Tandaan: Upang sumunod kasama ang tutorial na ito, kakailanganin mo ang dalawang larawan: image1.png at image2.png. Ang mga ito ay maaaring maging anumang mga larawan na pinili mo, ngunit ang tutorial ay pinakamahusay na gagana kung mayroon kang mga larawan sa paligid ng 100 pixels ng 100 pixels. Ito ay magpapahintulot sa madali mong makita kung ano ang nangyayari sa mga larawan.
Upang magsimula, magbubukas kami ng isang bagong file na tinatawag na main.lua at simulang buuin ang aming code:
displayMain = display.newGroup (); displayFirst = display.newGroup (); displaySecond = display.newGroup (); global_move_x = display.contentWidth / 5;Ang seksyong ito ng code ay nagtatakda ng aming ui library at nagdedeklara sa pamamagitan ng mga display group: displayMain, display First and displaySecond. Gagamitin namin ang mga ito upang i-first layer ang aming mga graphics at pagkatapos ay ilipat ang mga ito. Ang global_move_x variable ay naka-set sa 20% ng lapad ng display upang maaari naming makita ang kilusan.
function setupScreen () displayMain: insert (displayFirst); displayMain: insert (displaySecond); displayFirst: toFront (); displaySecond: toFront (); lokal na background = display.newImage ("image1.png", 0,0); display First: insert (background); lokal na background = display.newImage ("image2.png", 0,0); displaySecond: insert (background); wakasAng pag-andar ng setupScreen ay nagpapakita kung paano magdagdag ng mga display group sa pangunahing display group. Ginagamit din namin ang function na toFront () upang i-set up ang iba't ibang mga graphic na layer, na may layer na gusto namin sa tuktok lahat ng oras na ipinahayag huling.
Sa halimbawang ito, ito ay hindi talagang kailangan upang ilipat ang displayFirst sa harap dahil ito ay default na sa ibaba ng displaySecond group, ngunit ito ay mabuti upang makakuha ng sa ugali ng malinaw na layering bawat display group. Ang karamihan sa mga proyekto ay may higit sa dalawang layers.
Nagdagdag din kami ng isang imahe sa bawat grupo. Kapag sinimulan namin ang app, ang pangalawang larawan ay dapat na nasa tuktok ng unang larawan.
function screenLayer () displayFirst: toFront (); wakasNa-layered na namin ang aming mga graphics sa displaySecond group sa ibabaw ng displayFirst group. Ang function na ito ay maglipat ng displayFirst sa harap.
function moveOne () displaySecond.x = displaySecond.x + global_move_x; wakasAng paglipat ng isang function ay ilipat ang pangalawang larawan sa kanan ng 20% ng lapad ng screen. Kapag tinawagan namin ang function na ito, ang displaySecond group ay nasa likod ng displayFirst group.
function moveTwo () displayMain.x = displayMain.x + global_move_x; wakasAng ilipatTwo function ay ilipat ang parehong mga imahe sa kanan sa pamamagitan ng 20% ng lapad ng screen. Gayunpaman, sa halip na ilipat ang bawat grupo nang paisa-isa, gagamitin namin ang displayMain group upang ilipat ang mga ito kapwa sa parehong oras. Ito ay isang mahusay na halimbawa kung paano ang isang display group na naglalaman ng maraming mga grupo ng display ay maaaring magamit upang mamanipula ang maraming mga graphics nang sabay-sabay.
setupScreen (); timer.performWithDelay (1000, screenLayer); timer.performWithDelay (2000, moveOne); timer.performWithDelay (3000, moveTwo);Ang huling bit ng code ay nagpapakita kung ano ang mangyayari kapag pinatakbo namin ang mga function na ito. Gagamitin namin ang function na timer.performWithDelay upang sunugin ang mga pag-andar bawat segundo pagkatapos ilunsad ang app. Kung hindi ka pamilyar sa function na ito, ang unang variable ay ang oras upang maantala ang ipinahayag sa milliseconds at ang pangalawang ay ang function na gusto naming tumakbo pagkatapos na pagkaantala.
Kapag ilunsad mo ang app, dapat kang magkaroon ng image2.png sa ibabaw ng image1.png. Ang function ng screenLayer ay mag-apoy at magdadala ng image1.png sa harap. Ang moveOne function ay maglilipat ng imahe2.png mula sa ilalim ng image1.png, at ang pindutan ng switchTwo ay huli, na gumagalaw ang parehong mga imahe sa parehong oras.
Paano Ayusin ang isang Mabagal na iPad
Mahalagang tandaan na ang bawat isa sa mga grupong ito ay maaaring magkaroon ng mga dose-dosenang mga larawan sa kanila. At tulad ng paglipatTwo function na inilipat ang parehong mga imahe na may isang linya ng code, ang lahat ng mga imahe sa loob ng isang grupo ay dadalhin ang mga utos na ibinigay sa grupo.
Sa teknikal, ang displayMain group ay maaaring magkaroon ng parehong mga display group at mga imahe na nakapaloob sa loob nito. Gayunpaman, ito ay isang mahusay na kasanayan upang ipaalam sa ilang mga grupo tulad ng displayMain kumilos bilang mga lalagyan para sa iba pang mga grupo nang walang anumang mga imahe upang lumikha ng mas mahusay na organisasyon.
Gumagamit ang tutorial na ito ng paggamit ng display object. Matuto nang higit pa tungkol sa display object.