Simulator Jam Kata yang Boleh Dikonfigurasi: 3 Langkah

2024 Pengarang: John Day | [email protected]. Diubah suai terakhir: 2024-01-30 11:07

Ini sebenarnya tidak boleh diajar. Saya merancang Jam Word saya sendiri, dan memutuskan untuk membuat simulator aplikasi web terlebih dahulu supaya saya dapat meletakkan grid dan menguji bagaimana rupa pada pelbagai waktu dalam sehari. Kemudian saya menyedari ini boleh berguna untuk orang lain yang mengerjakan jam perkataan, dan memutuskan untuk membagikannya.

Aplikasi ini adalah satu fail HTML pendek. Sekiranya anda menyimpannya dan klik dua kali padanya, ia akan terbuka di penyemak imbas anda, dan mula memaparkan waktu semasa. Kemudian ia akan mengemas kini paparan setiap 10 saat jika waktunya berubah.

Terdapat juga medan teks di mana anda boleh mengetik dalam masa tertentu dan melihat bagaimana ia akan kelihatan dalam projek anda.

Reka bentuk jam perkataan setiap orang berbeza, jadi saya cuba membuat konfigurasi kod dengan mudah. Lihat beberapa langkah seterusnya untuk petunjuk mengenai cara melakukannya.

Saya harap anda dapati ini berguna! Senang dapat bereksperimen dengan susun atur dan kata-kata sebelum membuat perkakasan!

Langkah 1: Muat turun Fail HTML

Simulator adalah aplikasi web satu fail. Ia hanya di bawah 200 baris. Anda boleh memuat turunnya di sini.

(Sebenarnya tidak ada butang untuk memuat turun fail di Github. Tetapi anda hanya boleh memilih kandungan fail, menyalin, dan menampal ke dalam fail teks baru di komputer anda. Pastikan nama sesuatu itu.html.)

Selepas anda memuat turunnya, klik dua kali pada fail dan fail akan dimuat dalam tab di penyemak imbas anda. Anda harus melihat masa semasa dipaparkan dalam kotak perkataan.

Catatan: Saya hanya menguji aplikasi menggunakan Chrome di Windows.

Langkah 2: Edit Grid

Anda boleh mencuba susun atur kata yang berbeza dengan mengedit potongan Javascript yang kelihatan seperti ini:

var row_strs = ["ITU", "SATU DUA TIGA", "EMPAT LIMA LIMA", "TUJUH LAPAN", "SEMBILAN SEPULUH", "LAPAN DUA BELAS", "OH LIMA SEPULUH", "LIMA LIMA DUA PULUH", "O'CLOCK THIRTY", "FORTY FIFTY LIMA", "PADA SELEPAS", "PADA PAGI MALAM",];

Sekiranya anda menambah / menghapus baris dan memuatkan semula halaman, grid anda akan lebih besar atau lebih kecil.

Dan jika anda menambahkan lebih banyak huruf ke setiap baris, grid anda akan menjadi lebih luas. Pastikan semua baris mempunyai bilangan huruf yang sama.

Anda akan melihat bahawa rentetan dalam kod di atas mempunyai ruang, tetapi rentetan berubah menjadi watak rawak di grid. Anda boleh memilih kumpulan watak yang akan digunakan secara rawak untuk mengisi ruang tersebut dengan mengedit baris yang kelihatan seperti ini:

var RANDCHARS = "ABCDEFGHIJKLMNOPQRSTUVWXYZ @ # $% &";

Langkah 3: Ubah Penulisan

Anda mesti tahu bagaimana menulis kod jika anda ingin menggunakan frasa yang berbeza. Logik yang mengambil tarikh dan mengubahnya menjadi kata-kata adalah dalam fungsi yang disebut dateToSentence ().