Quindi abbiamo trascorso un sacco di tempo in questa prima schermata ma ovviamente per una buona
ragione, questo corso riguarda l'apprendimento di React Native dopo tutto e hai imparato molto sul layout, lo stile, il collegamento dei componenti,
l'utilizzo di più componenti e la configurazione di componenti già integrati e questa è una parte fondamentale di React
Native e ciò che ti consente di creare app reali alla fine. Tuttavia, ora è il momento di continuare a lavorare su
questa app e prima di approfondire altre cose che
potremmo progettare, che farò in seguito, voglio assicurarmi che questo pulsante di avvio
del gioco funzioni perché in questo momento siamo sempre bloccati su questo avvia la
schermata di gioco ma ora aggiungerò un secondo componente nella cartella delle schermate, la schermata di gioco stessa, quindi
la schermata, il contenuto che voglio mostrare sullo schermo quando il gioco è in esecuzione e questa è
la schermata responsabile mostrando le ipotesi del computer e consentendo all'utente di dire al computer se è
giusto o sbagliato, se il valore deve essere inferiore o maggiore,
quindi questo è l'obiettivo qui.
Ora, come ho detto prima, è comunque un componente
normale, quindi dobbiamo importare React di sicuro e importeremo anche alcune cose da React Native, soprattutto la vista e
il testo, non puoi mai sbagliare con questi, anche il foglio di stile ovviamente, in
genere hai sempre bisogno di questi.
Quindi qui, possiamo aggiungere il nostro componente funzionale della schermata di gioco, creare
qui l'oggetto stili utilizzando il foglio di stile. crea in questo modo e, alla fine, esporta la nostra schermata di gioco come impostazione predefinita e
sbarazzati di quel plus qui in alto.
Quindi ora abbiamo quel componente dello schermo di gioco definito qui
e ora facciamo una breve pausa e pensiamo a cosa deve accadere qui.
Ora, alla fine, ciò che deve accadere è che il computer deve fare un'ipotesi e
deve fare un'ipotesi
inizialmente quando questa schermata viene caricata per la prima volta, ma anche ogni volta che l'utente preme sostanzialmente questo è troppo basso o
questo
è troppo alto, così ogni
volta che l'utente dà un indizio sul fatto se tale ipotesi sia, in quale direzione del numero reale questa
ipotesi è, per così dire, ogni volta che ciò accade vogliamo generare una nuova ipotesi.
Ora l'ipotesi stessa dovrebbe essere un numero casuale e quindi, inizierò creando una nuova funzione al di fuori del mio componente funzionale
ora perché non
utilizzerà alcun dato da lì, quindi non dovrebbe essere ricreato su ogni nuovo rendering dei componenti semplicemente per
salvare alcune prestazioni, se non si fa
affidamento su oggetti di scena o stato, si può anche semplicemente avere una funzione che risiede al
di fuori del proprio componente e chiamerò questa generazione
casuale tra perché è
quello che farà questa funzione.
È una funzione, genererà un numero casuale tra un minimo e un massimo e
che ci consente anche
di escludere determinati numeri, ad esempio il primo numero che generiamo dovrebbe escludere la soluzione in modo che il dispositivo,
l'app non possa mai indovinare la scelta dell'utente al primo tentativo.
Ora qui, il minimo sarà normalizzato in matematica. ceil minimo, quindi fondamentalmente avere un
numero intero qui se viene inserito un non intero e arrotondato per eccesso e max verrà pavimentato per
fare lo stesso ma arrotondato per difetto. Quindi avrò il mio numero casuale che genererò con Math. casuale e matematica.
random ci dà un numero casuale compreso tra 0 e 1, quindi per avere un numero tra min e max, dobbiamo moltiplicarlo per max
- min e poi anche alla fine, aggiungi min qui e assicurati di chiamare Math. piano sul risultato di questa intera operazione qui e questo ti
darà un numero casuale tra questo minimo e massimo.
Ora con quello
generato, voglio verificare se il numero casuale è uguale al numero che vogliamo escludere, il che ovviamente
sarebbe una coincidenza molto rara ma può accadere, nel qual caso restituirò il risultato di un altro genera casuale tra chiamo dove
semplicemente inoltro min, max ed escludo quello che abbiamo ottenuto, quindi ripeterò semplicemente genera
random tra e restituiremo il valore di quella corsa ripetuta se otteniamo di nuovo il valore escluso, lo
ripeteremo ancora una volta, quindi alla fine abbiamo ci arriveremo e se
non abbiamo il numero escluso che dovrebbe essere il caso nella maggior parte dei casi,
restituirò immediatamente quel numero casuale.
Quindi questa è ora una funzione che ci genera un numero casuale.
Ora qui nella schermata di gioco, voglio gestire alcuni stati, quindi importerò il hook useState da React e inizializzerò alcuni stati qui con il numero
casuale perché lo stato che voglio gestire qui è l'ipotesi del computer, l'attuale
indovinare e che ha anche bisogno di una
funzione di indovinare impostata in modo che possiamo cambiarla ogni volta che l'utente dà un
nuovo suggerimento.
Quindi qui, possiamo chiamare generate random random tra per generare uno stato iniziale che verrà salvato e questo verrà
quindi considerato solo come uno stato
iniziale, quindi quando questo componente viene ricostruito e quindi viene chiamato di nuovo use state, genereremo
un altro numero casuale ancora una volta, ma questo non sovrascriverà quello stato perché una volta che lo
stato è impostato inizialmente, non verrà sovrascritto aggiungendo valore derivato qui.
Questo sarà considerato da React solo se non abbiamo ancora uno stato iniziale, da allora in poi questo stato
iniziale o aggiornato verrà gestito separatamente dal componente e non verrà sovrascritto nuovamente da questa chiamata qui.
Inizialmente tuttavia dobbiamo effettuare questa chiamata, vogliamo ottenere un numero casuale compreso tra 1 e
100, 100 è escluso con la logica
che abbiamo scritto lì, quindi sarà un numero compreso tra 1 e 99,
99 inclusi e voglio escludere la scelta dell'utente.
Mi aspetto di ottenere questo sui miei oggetti di scena
qui, quindi la scelta dell'utente potrebbe essere un nome prop che usiamo qui e questo è il valore che voglio eseguire perché
è la
soluzione alla fine e non saremo in grado di indovinare subito la soluzione,
sarebbe un po 'ingiusto.