lunedì 4 maggio 2015

Campi coperti dalla tastiera

Quando si scrive un programma per mobile, Android o iOS, può succedere che la tastiera vada a coprire il nostro campo. Qui di seguito vi mostro un codice che sposta il campo sopra la tastiera, solo se non è visibile.
Tanti campi, bisogna fare qualcosa quando appare la tastiera

Questo codice agisce in automatico per tutti i campi nativi presenti e li sposta solo se e necessario, una volta finito di inserire i dati nel campo, esso ritorna al posto di partenza.
Ecco il codice:
on InputbeginEditing
   set the spostacontrollo of me to empty
   put mobilecontroltarget() into nomec #nome del controllo nativo
   put mobilecontrolget(nomec,"rect") into rectc #rect del controllo nativo
   #facciamo il controllo se si trova dentro l'area visibile
   put item 1 to 2 of rectc into altosx #angolo alto a sinistra del controllo
   put item 3 to 4 of rectc into bassodx #angolo in basso a destra del controllo
   if (altosx is not within the effective working screenrect) or (bassodx is not within the effective working screenrect) then
      set the spostacontrollo of me to (nomec & CR & rectc)
      mobilecontrolset nomec,"rect",the effective working screenrect
   end if
end InputbeginEditing

on inputEndEditing
   riportatuttoaposto
end inputEndEditing

on riportatuttoaposto
   put the spostacontrollo of me into temp
   put line 1 of temp into nomec
   put line 2 of temp into rectc
   mobilecontrolset nomec,"rect",rectc
end riportatuttoaposto

on keyboarddeactivated
   riportatuttoaposto
end keyboarddeactivated

come vedete per capire quale controllo si è attivato utilizzo la funzione mobilecontroltarget() dentro il messaggio InputBeginEditing. Questa accoppiata mi dà il nome del campo che l'utente sta digitando.
Poi si fa una verifica se il controllo sia visibile con within. Se non è visibile memorizziamo la posizione nella proprietà personalizzata spostacontrollo. Poi spostiamo il controllo in modo da renderlo visibile cambiando la sua proprietà rect. Una volta che l'utente ha finito di inserire i dati rimettiamo tutto a posto.
Visto che l'utente potrebbe semplicemente chiudere la tastiera, è meglio mettere il messaggio per riposizionare il controllo sia in InputEndEditing, sia in keyboardDeActivated.
Questo codice è un esempio, potete anche aggiungere il titolo sopra il campo quando lo spostate, rendere grigio tutto il resto facendo apparire o scomparire un rettangolo grigio, magari semitrasparente.
Un'altra strada sarebbe far scorrere tutti gli elementi, per far prima raggruppati in un gruppo, fino a rendere visibile il campo; ma richiede più codice da scrivere.
Eventualmente nei commenti proponete altre soluzioni.