iPhone UIWebView: Como forçar um teclado numérico? É possível?

https://stackoverflow.com/questions/773843

13-09-2019
|

Pergunta

Eu estou experimentando com PhoneGap para desenvolver alguns aplicativos do iPhone. PhoneGap basicamente envolve um UIWebView - ele funciona bem. O problema é o meu aplicativo tem vários campos de entrada que só recebem parâmetros numéricos. Eu realmente preciso para forçar o teclado numérico em vez de aceitar o teclado padrão predefinido, que, em seguida, força o usuário para mudar para o numérico em cada campo. Alguém sabe se isso é possível? Como?

Esclarecimento: Eu sei que a Apple atualmente não fornece qualquer API para permitir isso. Eu estou querendo saber se a criação de uma classe personalizada que herdou de UIWebView pode ajudar, ou talvez criar um teclado personalizado iria abrir algumas possibilidades?

Atualização de 6 de novembro de 2009 - Como observado abaixo, a Apple atualizou recentemente funcionalidade safari para que este é, mais uma vez, com o apoio. Portanto, a resposta aceita foi alterada para refletir isso.

 <html>
<input type='tel'/>
<input type='number'/>
<input type='email'/>
<input />
</html>

Solução

Parece que Mobile Safari suporta atributos do novo tipo de entrada HTML5 de e-mail , número , procurar , tel e url . Estes irão mudar o teclado que é exibido. Consulte o tipo de atributo .

Assim, por exemplo, você poderia fazer isso:

<input type="number" />

E quando a caixa de entrada tem foco, o teclado numérico é mostrado (como se o usuário tivesse o teclado completo e aperte o botão "123".

Se você quiser realmente única números, você pode especificar:

<input type="tel" />

E, em seguida, o usuário receberia o teclado número de telefone de discagem.

Eu sei que isso funciona com o Mobile Safari -. Eu só assume que vai trabalhar com UIWebView

Outras dicas

Eu encontrei uma solução melhor é usar <input type="text" pattern="[0-9]*"> ao conceber formas para ambos os navegadores móveis e desktop.

De documentação da Apple (a nota sobre UIWebView):

Você não pode especificar o tipo de teclado com elementos de entrada. A vista web exibe um teclado personalizado que é baseado no teclado padrão, mas inclui alguns controles adicionais para navegar entre elementos de formulário.

verificado no iPhone OS 3.0, esta funcionalidade ainda não estava lá, não tenho certeza por que a Apple acabou de remover essa funcionalidade útil, muito chateado ao trabalho neste momento: (

Aqui está uma lista de todos os tipos compatível com iOS (4.0 e superior) vistas da web:

http://conecode.com/news/2011 / 12 / mobile-safari-UIWebView-entrada-tipos /

Isso foi possível na primeira iteração do iPhone OS - Safari daria teclados numéricos para campos de formulário com 'zip' ou 'telefone' em seus nomes - mas desapareceu no iPhone OS 2.0

PhoneGap não tem uma função de API para substituir esse no momento. Pode ser algo que eles estão trabalhando, seria definitivamente ser um recurso bacana.

iOS Mobile Safari suporta também:

<input type="password" />

Você precisa fazer a mudança na parte HTML do seu projeto Dashcode:

Em Dashcode index.html aberta na janela de código.
Na tela da visão que você está trabalhando, selecione o campo de entrada que você deseja definir para usar o teclado otimizado.
Clique na index.html para dar-lhe concentrar-se.
Selecione Editar> Localizar na barra de menu Dashcode.
Tipo no encontrar a caixa o nome exato que você deu para o controle de campo de texto. Localizar irá localizar o controle no arquivo index.html.
Alterar o tipo de type="text" para type="number".

Feito.

O que você também pode usar para aplicativos baseados iOS phonegap é:

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

É mostrado na imagem abaixo. Funciona lindamente com iOS 8.2 e PhoneGap 3.5 e acima.

iOs tem uma UIKeyboardTypeNumbersAndPunctuation teclado numérico, mas isso não pode ser chamado de HTML ( https://developer.apple.com/library/ios/documentation/StringsTextFonts/Conceptual/TextAndWebiPhoneOS/KeyboardManagement/KeyboardManagement.html )

desde no teclado "tel" a pontuação está faltando você tem que criar isso por conta própria. Desde iOS8 teclados personalizados estão disponíveis. Ou se você apenas precisa a pontuação que você pode adicionar um botão ( Como adicionar um botão 'Concluído' para teclado numpad no iOS ) para o teclado numérico, que aparece quando você especificar o seu campo de entrada com type="number" pattern="[0-9]*".

Para fazer isso:. O código 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('.');"]];
}

Em seguida, você deve adicionar a um método que pode ser acessado ampla aplicação em seu código 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);
                }
            },

Licenciado em: CC-BY-SA com atribuição

Não afiliado a StackOverflow