Cara Layer, Pindah dan Bawa Grafik ke Depan

Menggunakan Corona SDK untuk Memanipulasi Grafik

Komponen utama dalam membuat, memanipulasi dan mengelola grafik di Corona SDK adalah objek tampilan. Objek ini tidak hanya dapat digunakan untuk menampilkan gambar dari file, mungkin sama pentingnya, ini memungkinkan Anda untuk mengelompokkan gambar Anda bersama. Ini memungkinkan Anda memindahkan seluruh rangkaian grafik di sekitar layar sekaligus dan lapisan grafis di atas satu sama lain.

Tutorial ini akan mengajarkan Anda dasar-dasar menggunakan kelompok tampilan untuk mengatur objek grafis dalam proyek Anda. Ini akan ditunjukkan dengan membuat dua lapisan yang berbeda, satu mewakili layar normal dan yang lain mewakili lapisan modal untuk ditempatkan di atasnya. Selain melapisi grafis, kami juga akan menggunakan objek transisi untuk memindahkan seluruh kelompok modal.

Cara Memasarkan Aplikasi Anda

Catatan: Untuk mengikuti tutorial ini, Anda akan membutuhkan dua gambar: image1.png dan image2.png. Ini bisa berupa gambar apa pun yang Anda pilih, tetapi tutorial akan bekerja paling baik jika Anda memiliki gambar sekitar 100 piksel dengan 100 piksel. Ini akan memungkinkan Anda untuk dengan mudah melihat apa yang terjadi pada gambar.

Untuk memulai, kita akan membuka file baru bernama main.lua dan mulai membangun kode kita:

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

Bagian kode ini mengatur pustaka ui kita dan menyatakan melalui kelompok tampilan: displayMain, displayFirst dan displaySecond. Kami akan menggunakannya untuk lapisan pertama grafik kami dan kemudian memindahkannya. Variabel global_move_x diatur hingga 20% dari lebar layar sehingga kita dapat melihat pergerakan.

function setupScreen () displayMain: insert (displayFirst); displayMain: insert (displaySecond); displayFirst: toFront (); displaySecond: toFront (); background lokal = display.newImage ("image1.png", 0,0); displayFirst: insert (latar belakang); background lokal = display.newImage ("image2.png", 0,0); displaySecond: insert (latar belakang); akhir

Fungsi setupScreen menunjukkan cara menambahkan grup tampilan ke grup tampilan utama. Kami juga menggunakan fungsi toFront () untuk mengatur lapisan grafis yang berbeda, dengan lapisan yang kami inginkan di atas semua waktu yang dinyatakan terakhir.

Dalam contoh ini, tidak benar-benar diperlukan untuk memindahkan tampilan pertama ke depan karena default akan berada di bawah tampilanDetik kedua, tetapi itu baik untuk membiasakan secara eksplisit melapiskan masing-masing kelompok tampilan. Sebagian besar proyek akan berakhir dengan lebih dari dua lapisan.

Kami juga menambahkan gambar ke setiap grup. Saat kami memulai aplikasi, gambar kedua harus berada di atas gambar pertama.

function screenLayer () displayFirst: toFront (); akhir

Kami sudah melapisi grafik kami dengan tampilan grup Detik di atas grup DisplayFirst. Fungsi ini akan memindahkan displayPertama ke depan.

function moveOne () displaySecond.x = displaySecond.x + global_move_x; akhir

Fungsi moveOne akan memindahkan gambar kedua ke kanan sebesar 20% dari lebar layar. Ketika kita memanggil fungsi ini, grup displaySecond akan berada di belakang layarFirst pertama.

function moveTwo () displayMain.x = displayMain.x + global_move_x; akhir

Fungsi moveTwo akan memindahkan kedua gambar ke kanan sebesar 20% dari lebar layar. Namun, alih-alih memindahkan setiap grup satu per satu, kami akan menggunakan grup DisplayMain untuk memindahkan keduanya secara bersamaan. Ini adalah contoh yang bagus tentang bagaimana grup tampilan yang berisi beberapa grup tampilan dapat digunakan untuk memanipulasi banyak grafik sekaligus.

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

Bit terakhir dari kode ini menunjukkan apa yang terjadi ketika kita menjalankan fungsi-fungsi ini. Kami akan menggunakan fungsi timer.performWithDelay untuk mengaktifkan fungsi setiap detik setelah aplikasi diluncurkan. Jika Anda tidak terbiasa dengan fungsi ini, variabel pertama adalah waktu untuk menunda diekspresikan dalam milidetik dan yang kedua adalah fungsi yang ingin kita jalankan setelah penundaan itu.

Saat Anda meluncurkan aplikasi, Anda harus memiliki image2.png di atas image1.png. Fungsi screenLayer akan menyala dan membawa image1.png ke depan. Fungsi moveOne akan memindahkan image2.png keluar dari bawah image1.png, dan fungsi moveTwo akan diaktifkan terakhir, memindahkan kedua gambar pada saat yang bersamaan.

Cara Memperbaiki iPad Lambat

Penting untuk diingat bahwa masing-masing kelompok ini dapat memiliki lusinan gambar di dalamnya. Dan sama seperti fungsi moveTwo memindahkan kedua gambar dengan satu baris kode, semua gambar dalam grup akan mengambil perintah yang diberikan kepada grup.

Secara teknis, grup DisplayMain dapat memiliki kelompok tampilan dan gambar yang terdapat di dalamnya. Namun, merupakan praktik yang baik untuk membiarkan beberapa grup seperti displayMain bertindak sebagai wadah untuk grup lain tanpa gambar untuk menciptakan organisasi yang lebih baik.

Tutorial ini memanfaatkan objek tampilan. Pelajari lebih lanjut tentang objek tampilan.

Cara Memulai Mengembangkan Aplikasi iPad