iPhone UIWebView: Come forzare una tastiera numerica? È possibile?

StackOverflow https://stackoverflow.com/questions/773843

Domanda

sto sperimentando con PhoneGap per sviluppare alcune applicazioni per iPhone. PhoneGap avvolge fondamentalmente un UIWebView - funziona bene. Il problema è la mia applicazione ha diversi campi di input che richiedono solo input numerico. Ho davvero bisogno di forzare il tastierino numerico invece di accettare la tastiera standard di default, che poi costringe l'utente a passare alla numerico ogni campo. Qualcuno sa se questo è possibile? Come?

Chiarimento: So che Apple non fornisce attualmente alcun API per permettere questo. Mi chiedo se la creazione di una classe personalizzata che ha ereditato da UIWebView potrebbe aiutare, o forse la creazione di una tastiera personalizzata aprirebbe qualche possibilità?

Aggiornamento 6 Nov, 2009 - Come indicato di seguito, Apple ha recentemente aggiornato la funzionalità di Safari in modo che questo è, ancora una volta, ha sostenuto. Quindi la risposta accettato è stato modificato per riflettere tale. 

 <html>
<input type='tel'/>
<input type='number'/>
<input type='email'/>
<input />
</html>
È stato utile?

Soluzione

Sembra che Safari Mobile supporta gli attributi nuovo tipo di ingresso HTML5 di e-mail , numero , ricerca , tel , e url . Questi commutare la tastiera che viene visualizzata. Vedere l'attributo type .

Così, per esempio, si potrebbe fare questo: 

<input type="number" />

E quando la casella di input è attivo, la tastiera numero è indicato (come se l'utente aveva la tastiera completa e premere il pulsante "123".

Se davvero desideri solo i numeri, è possibile specificare: 

<input type="tel" />

E quindi l'utente otterrebbe il tastierino di comporre il numero di telefono.

So che questo funziona con Safari Mobile -. Ho solo presumo che possa funzionare con UIWebView

Altri suggerimenti

Ho trovato una soluzione migliore è quella di utilizzare <input type="text" pattern="[0-9]*"> durante la progettazione di forme per entrambi i browser mobili e desktop.

Da documentazione di Apple (la nota su UIWebView):

  

Non è possibile specificare il tipo di tastiera in elementi di input. La visualizzazione web visualizza una tastiera personalizzata che si basa sulla tastiera di default, ma include alcuni controlli aggiuntivi per la navigazione tra gli elementi dei moduli.

Controllato su iPhone OS 3.0, questa funzionalità non era ancora lì, non so perché Apple ha appena rimosso questa funzionalità a portata di mano, davvero sconvolto a lavorare su questo in questo momento: (

Ecco un elenco di ogni tipo compatibile con iOS (4.0 e superiori) viste web:

http://conecode.com/news/2011 / 12 / mobile safari UIWebView ingressi tipi /

Questo è stato possibile nella prima iterazione di iPhone OS - Safari darebbe tastiere numeriche per formare campi con 'zip' o 'telefono' nei loro nomi - ma è scomparso in iPhone OS 2.0

.

PhoneGap non ha una funzione API per ignorare questo al momento. Potrebbe essere qualcosa su cui stanno lavorando, sarebbe sicuramente una bella funzionalità.

iOS Safari Mobile supporta anche: 

<input type="password" />

È necessario effettuare la modifica nella parte HTML del vostro progetto Dashcode:

  1. In Dashcode index.html aperta nella finestra del codice.
  2. Nella tela della vista che si sta lavorando, selezionare il campo di input che si desidera impostare per utilizzare la tastiera ottimizzata.
  3. Fare clic su index.html per dargli fuoco.
  4. Selezionare Modifica> Trova dalla barra dei menu Dashcode.
  5. Digita nella casella di trovare il nome esatto avete dato al controllo campo di testo. Trova individuerà il controllo nel file index.html.
  6. Cambiare il tipo da type="text" a type="number".

Fatto.

Che cosa si può utilizzare anche per iOS PhoneGap un'applicazione basata è: 

input type="number" pattern="[0-9]*"

Si è mostrato nell'immagine qui sotto. Funziona perfettamente con iOS 8.2 e PhoneGap 3.5 e superiori.

iOs ha una UIKeyboardTypeNumbersAndPunctuation tastiera numerica, ma questo non può essere chiamato da HTML ( https://developer.apple.com/library/ios/documentation/StringsTextFonts/Conceptual/TextAndWebiPhoneOS/KeyboardManagement/KeyboardManagement.html )

dal momento che la tastiera "tel" la punteggiatura manca devi creare da soli. Dal momento che iOS 8 tastiere personalizzate sono disponibili. Oppure, se avete solo bisogno la punteggiatura è possibile aggiungere un pulsante ( Come aggiungere un pulsante 'Done' alla tastiera del tastierino numerico in iOS ) alla tastiera numerica, che si apre quando si specifica il campo di input con type="number" pattern="[0-9]*".

Per farlo:. Il codice Objective-C 

-(void)keyboardWillHide:(NSNotification *)note
{
    [self.donekeyBoardBtn removeFromSuperview];
    [self.webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat: @"document.activeElement.blur()"]];
}

- (void)keyboardWillShow:(NSNotification *)note
{
    [UIView setAnimationsEnabled:NO];
    // create custom button
    //UIKeyboardTypeNumberPadin
    //type="number" pattern="[0-9]*"
    UIButton *extryB= [UIButton buttonWithType:UIButtonTypeRoundedRect];
    extryB.frame = CGRectMake(0, self.view.frame.size.height+150, 100, 50);
    extryB.backgroundColor = [UIColor colorWithRed:204.0f/255.0f
                                             green:210.0f/255.0f
                                              blue:217.0f/255.0f
                                             alpha:1.0f];
    extryB.adjustsImageWhenHighlighted = NO;
    extryB.titleLabel.font = [UIFont systemFontOfSize:14.0];
    [extryB setTitle:@"," forState:UIControlStateNormal];
    [extryB setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [extryB addTarget:self action:@selector(extryBpressed) forControlEvents:UIControlEventTouchUpInside];



self.donekeyBoardBtn = extryB;

// locate keyboard view
UIWindow* tempWindow = [[[UIApplication sharedApplication] windows] objectAtIndex:1];
UIView* keyboard;
for(int i=0; i<[tempWindow.subviews count]; i++)
{
    keyboard = [tempWindow.subviews objectAtIndex:i];
    // keyboard view found; add the custom button to it

    if([[keyboard description] hasPrefix:@"<UIInputSetContainerView"] == YES)
    {

        for(int i = 0 ; i < [keyboard.subviews count] ; i++)
        {
            UIView* hostkeyboard = [keyboard.subviews objectAtIndex:i];

            if([[hostkeyboard description] hasPrefix:@"<UIInputSetHost"] == YES)
            {
                UIButton* donebtn = (UIButton*)[hostkeyboard viewWithTag:67123];
                if (donebtn == nil){
                    //to avoid adding again and again as per my requirement (previous and next button on keyboard)

                    if([[self printKeyboardType] isEqualToString: @"UIKeyboardTypePhonePad"]){
                        [keyboard addSubview:extryB];
                    }

                }
            }
        }
    }
    //[keyboard addSubview:extryB];
}
[UIView setAnimationsEnabled:YES];
// animate
[UIView animateWithDuration:0.5 animations:^{
    extryB.frame = CGRectMake(0, self.view.frame.size.height-50, 100, 50);
}];
}

-(NSString*)printKeyboardType
{

NSString* strKeyboardType = @"";
switch (self.textDocumentProxy.keyboardType) {
    case UIKeyboardTypeAlphabet:
        strKeyboardType = @"UIKeyboardTypeAlphabet";
        break;
    case UIKeyboardTypeDecimalPad:
        strKeyboardType = @"UIKeyboardTypeAlphabet";
        break;
    case UIKeyboardTypeDefault:
        strKeyboardType = @"UIKeyboardTypeDefault";
        break;
    case UIKeyboardTypeEmailAddress:
        strKeyboardType = @"UIKeyboardTypeEmailAddress";
        break;
    case UIKeyboardTypeTwitter:
        strKeyboardType = @"UIKeyboardTypeTwitter";
        break;
    case UIKeyboardTypeNamePhonePad:
        strKeyboardType = @"UIKeyboardTypeNamePhonePad";
        break;
    case UIKeyboardTypeNumberPad:
        strKeyboardType = @"UIKeyboardTypeNumberPad";
        break;
    case UIKeyboardTypeNumbersAndPunctuation:
        strKeyboardType = @"UIKeyboardTypeNumbersAndPunctuation";
        break;
    case UIKeyboardTypePhonePad:
        strKeyboardType = @"UIKeyboardTypePhonePad";
        break;
    case UIKeyboardTypeURL:
        strKeyboardType = @"UIKeyboardTypeURL";
        break;
    case UIKeyboardTypeWebSearch:
        strKeyboardType = @"UIKeyboardTypeWebSearch";
        break;
    default:
        strKeyboardType = @"UNKNOWN";
        break;
}
NSLog(@"self.textDocumentProxy.keyboardType=%@", strKeyboardType);
return strKeyboardType;
}

#define SYSTEM_VERSION_GREATER_THAN_OR_EQUAL_TO(v)  ([[[UIDevice currentDevice] systemVersion] compare:v options:NSNumericSearch] != NSOrderedAscending)

- (void)extryBpressed{
    //simulates a "." press
    [self.webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat: @"simulateKeyPress('.');"]];
}

Poi si dovrebbe aggiungere il metodo a cui si accede ampia applicazione nel codice JS. 

simulateKeyPress: function(k) {
        var press = jQuery.Event("keypress");

        press.which = k;
        // place the id of your most outer html tag here
        $("#body").trigger(press);
            // just needed because my active element has a child element where the value should be placed in
                var id = document.activeElement.id.indexOf("-");
                if(id != -1){
                    var currentTf = sap.ui.getCore().byId(document.activeElement.id.split("-")[0]);
                    //append the value and set it (my textfield has a method setValue())
                    var currentTfValue = currentTf.getValue();
                    currentTf.setValue(currentTfValue + k);
                }
            },
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top