Si të Layer, Move dhe Bring Graphics në Front

Përdorimi i SDK Corona për të manipuluar grafikën

Komponenti kryesor i krijimit, manipulimit dhe menaxhimit të grafikës në SDK Corona është objekti i ekranit. Jo vetëm që ky objekt mund të përdoret për të shfaqur një imazh nga një skedar, ndoshta po aq e rëndësishme, që ju lejon të gruponi imazhet tuaja së bashku. Kjo ju lejon të lëvizni një seri të tërë grafike rreth ekranit në të njëjtën kohë dhe të shtoni grafika në krye të njëri-tjetrit.

Ky tutorial do t'ju mësojë bazat e përdorimit të grupeve të ekranit për të organizuar objektet grafike në projektin tuaj. Kjo do të demonstrohet duke krijuar dy shtresa të ndryshme, një që përfaqëson ekranin normal dhe një tjetër që përfaqëson një shtresë modale që do të vendoset mbi të. Përveç shtresimit të grafikut, ne gjithashtu do të përdorim objektin e tranzicionit për të lëvizur të gjithë grupin modal.

Si të Market App juaj

Shënim: Për të ndjekur së bashku me këtë tutorial, do t'ju duhet dy imazhe: image1.png dhe image2.png. Këto mund të jenë çdo imazh që zgjidhni, por tutorial do të funksionojë më mirë nëse keni imazhe rreth 100 piksele me 100 piksele. Kjo do t'ju lejojë të shihni lehtë se çfarë po ndodh me imazhet.

Për të filluar, do të hapim një skedar të ri të quajtur main.lua dhe do të fillojmë ndërtimin e kodit tonë:

displayMain = display.newGroup (); displayFirst = display.newGroup (); displaySecond = display.newGroup (); global_move_x = display.contentWidth / 5;

Ky seksion i kodit krijon bibliotekën tonë ui dhe deklaron përmes grupeve të ekranit: displayMain, displayFirst dhe displaySecond. Ne do t'i përdorim këto për të parë shtresën e grafikës sonë dhe pastaj t'i lëvizim ato. Variabli global_move_x është caktuar në 20% të gjerësisë së ekranit, kështu që ne mund ta shohim lëvizjen.

funksioni setupScreen () displayMain: insert (displayFirst); displayMain: futur (displaySecond); displayFirst: toFront (); displaySecond: toFront (); sfondi lokal = display.newImage ("image1.png", 0,0); displayFirst: futur (sfondit); sfondi lokal = display.newImage ("image2.png", 0,0); displaySecond: futur (sfondit); fund

Funksioni i setupScreen tregon se si të shtoni grupe të ekranit në grupin kryesor të ekranit. Ne gjithashtu përdorim funksionin toFront () për të vendosur shtresa të ndryshme grafike, me shtresën që duam në krye të gjithë kohës të deklaruar të fundit.

Në këtë shembull, nuk është me të vërtetë e nevojshme të zhvendosni ekraninPërparimi në pjesën e përparme pasi që do të jetë më poshtë se grupi i dytë i ekranit, por është mirë të hyni në zakonin e shtresimit të qartë të secilit grup të ekranit. Shumica e projekteve do të përfundojnë me më shumë se dy shtresa.

Ne gjithashtu kemi shtuar një imazh për secilin grup. Kur e fillojmë aplikacionin, imazhi i dytë duhet të jetë në krye të imazhit të parë.

funksion screenLayer () displayFirst: toFront (); fund

Ne tashmë e kemi shtresuar grafikën tonë me grupin displaySecond në krye të grupit displayFirst. Ky funksion do të lëvizë para ekranit përpara.

funksioni moveOne () displaySecond.x = displaySecond.x + global_move_x; fund

Funksioni moveOne do të lëvizë imazhin e dytë në të djathtë me 20% të gjerësisë së ekranit. Kur e quajmë këtë funksion, grupi displaySecond do të jetë prapa grupit displayFirst.

funksioni moveTwo () displayMain.x = displayMain.x + global_move_x; fund

Funksioni i lëvizjes Dy do të lëvizë të dy imazhet në të djathtë me 20% të gjerësisë së ekranit. Sidoqoftë, në vend që të lëvizim secili grup individualisht, do të përdorim grupin displayMain për t'i lëvizur të dyja në të njëjtën kohë. Ky është një shembull i shkëlqyeshëm se si një grup ekspozimi që përmban grupe të shumta të ekranit mund të përdoret për të manipuluar shumë grafika në të njëjtën kohë.

setupScreen (); timer.performWithDelay (1000, screenLayer); timer.performWithDelay (2000, moveOne); timer.performWithDelay (3000, movetwo);

Ky bit e fundit e kodit tregon se çfarë ndodh kur ne i kryejmë këto funksione. Ne do të përdorim funksionin timer.performWithDelay për të zhdukur funksionet çdo sekondë pas nisjes së aplikacionit. Nëse nuk jeni të njoftuar me këtë funksion, ndryshorja e parë është koha e vonesës shprehur në millisekonda dhe e dyta është funksioni që duam të kandidojë pas kësaj vonese.

Kur nisni aplikacionin, duhet të keni image2.png në krye të image1.png. Funksioni screenLayer do të zjarrit dhe do të sjellë image1.png në pjesën e përparme. Funksioni moveOne do të lëvizë image2.png nga nën image1.png, dhe funksioni moveTwo do të zjarrit të fundit, duke lëvizur të dy imazhet në të njëjtën kohë.

Si për të rregulluar një Slow iPad

Është e rëndësishme të mbani mend se secili prej këtyre grupeve mund të ketë dhjetra imazhe në to. Dhe ashtu si funksioni i lëvizjes dy lëvizur dy imazhe me një rresht të kodit, të gjitha imazhet brenda një grupi do të marrin komandat që i janë dhënë grupit.

Teknikisht, grupi displayMain mund të ketë të dy grupet dhe imazhet e shfaqura brenda tij. Sidoqoftë, është një praktikë e mirë të lejosh që disa grupe si DisplayMain të veprojnë si kontejnerë për grupe të tjera pa ndonjë imazh në mënyrë që të krijojnë organizim më të mirë.

Ky tutorial bën përdorimin e objektit të ekranit. Mësoni më shumë rreth objektit të ekranit.

Si të filloni të zhvilloni Apps iPad