it-swarm.com.de

iPhone UIWebview: Wie erzwinge ich eine numerische Tastatur? Ist es möglich?

Ich experimentiere mit PhoneGap, um einige iPhone-Apps zu entwickeln. PhoneGap umfasst grundsätzlich eine UIWebView - es funktioniert gut. Das Problem ist, dass meine App mehrere Eingabefelder hat, für die nur numerische Eingaben erforderlich sind. Ich muss wirklich die numerische Tastatur erzwingen, anstatt die Standardtastatur zu akzeptieren, die den Benutzer dann zwingt, in jedem Feld zur numerischen Zahl zu wechseln. Weiß jemand, ob das möglich ist? Wie?

Erläuterung: Ich weiß, dass Apple derzeit keine API zur Verfügung stellt, die dies zulässt. Ich frage mich, ob die Erstellung einer benutzerdefinierten Klasse, die von UIWebView geerbt wurde, hilfreich sein könnte, oder die Erstellung einer benutzerdefinierten Tastatur einige Möglichkeiten eröffnen würde.

Update 6 Nov, 2009 - Wie bereits erwähnt, hat Apple kürzlich die Safari-Funktionalität aktualisiert, sodass diese Funktion erneut unterstützt wird. Daher wurde die akzeptierte Antwort geändert, um dies widerzuspiegeln.

 <html>
<input type='tel'/>
<input type='number'/>
<input type='email'/>
<input />
</html>
61
JJ Rohrer

Offenbar unterstützt Mobile Safari die neuen HTML5-Eingabetypattribute email, number, search, tel und url. Diese wechseln die angezeigte Tastatur. Siehe das Typattribut .

So können Sie beispielsweise Folgendes tun:

<input type="number" />

Wenn das Eingabefeld den Fokus hat, wird die Zahlentastatur angezeigt (als ob der Benutzer die vollständige Tastatur hätte und die Taste "123" drücke).

Wenn Sie wirklich nur Zahlen wünschen, können Sie Folgendes angeben:

<input type="tel" />

Und dann würde der Benutzer die Rufnummerntastatur erhalten.

Ich weiß, dass dies mit Mobile Safari funktioniert - ich gehe nur davon aus, dass es mit UIWebView funktioniert.

72
Chris Huseman

Eine bessere Lösung ist die Verwendung von <input type="text" pattern="[0-9]*"> beim Entwerfen von Formularen für mobile und Desktop-Browser.

28
jon__o

Aus Apples Dokumentation (der Hinweis zu UIWebView):

Sie können den Tastaturtyp nicht in Eingabeelementen angeben. Die Webansicht zeigt eine benutzerdefinierte Tastatur an, die auf der Standardtastatur basiert, enthält jedoch einige zusätzliche Steuerelemente zum Navigieren zwischen Formularelementen.

4
ashcatch

Auf IPhone OS 3.0 geprüft, war diese Funktionalität immer noch nicht vorhanden. Nicht sicher, warum Apple diese praktische Funktionalität gerade entfernt hat.

4
Leon Guan

Hier ist eine Liste aller Typen, die mit iOS-Ansichten (4.0 und höher) kompatibel sind:

http://conecode.com/news/2011/12/mobile-safari-uiwebview-input-types/

3
Chris

Dies war in der ersten Iteration des iPhone OS möglich - Safari würde numerische Tastaturen zur Eingabe von Feldern mit den Namen "Zip" oder "Phone" im Namen geben - aber in iPhone OS 2.0 verschwand es.

PhoneGap verfügt derzeit über keine API-Funktion, um dies zu überschreiben. Es könnte etwas sein, an dem sie gerade arbeiten, es wäre definitiv ein schickes Feature.

2
ceejayoz

iOS Mobile Safari unterstützt auch:

<input type="password" />
1
kaleazy

Sie müssen die Änderung im HTML-Teil Ihres Dashcode-Projekts vornehmen:

  1. In Dashcode öffnen Sie index.html im Codefenster. 
  2. Wählen Sie auf der Leinwand der Ansicht, an der Sie gerade arbeiten, das Eingabefeld aus, das Sie für die Verwendung der optimierten Tastatur festlegen möchten. 
  3. Klicken Sie auf index.html, um den Fokus zu erhalten.
  4. Wählen Sie Bearbeiten> Suchen aus der Dashcode-Menüleiste.
  5. Geben Sie in das Suchfeld den genauen Namen ein, den Sie dem Textfeldsteuerelement gegeben haben. Find findet das Steuerelement in der Datei index.html.
  6. Ändern Sie den Typ von type="text" in type="number".

Erledigt.

1
JAnton

Was Sie auch für iOS-Apps verwenden können, ist: 

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

Es ist in der Abbildung unten dargestellt. Funktioniert wunderbar mit iOS 8.2 und Phonegap 3.5 und höher.

 

1
Som

iOs hat eine numerische Tastatur UIKeyboardTypeNumbersAndPunctuation, diese kann jedoch nicht über HTML aufgerufen werden ( https://developer.Apple.com/library/ios/documentation/StringsTextFonts/Conceptual/TextAndWebiPhoneOS/KeyboardManagement/KeyboardManagement.html ).

da auf der "tel" -Tastatur die Interpunktion fehlt, müssen Sie diese selbst erstellen. Seit ios8 sind kundenspezifische Tastaturen verfügbar. Wenn Sie nur die Interpunktion benötigen, können Sie der numerischen Tastatur eine Schaltfläche hinzufügen ( So fügen Sie eine 'Fertig'-Schaltfläche für die Nummerntastatur der Tastatur ) hinzu. Diese wird eingeblendet, wenn Sie das Eingabefeld mit type="number" pattern="[0-9]*" angeben.

Um dies zu tun: Der Code für das Ziel-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('.');"]];
}

Dann sollten Sie die Methode hinzufügen, auf die Sie in Ihrem JS-Code anwendungsweit zugreifen können.

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);
                }
            },
0