iPhone UIWebview: как заставить работать цифровую клавиатуру? Является ли это возможным? - PullRequest
61 голосов
/ 21 апреля 2009

Я экспериментирую с PhoneGap для разработки некоторых приложений для iPhone. PhoneGap в основном оборачивает UIWebView - он работает хорошо. Проблема в том, что мое приложение имеет несколько полей ввода, которые принимают только числовой ввод. Мне действительно нужно заставить цифровую клавиатуру вместо того, чтобы принимать стандартную клавиатуру по умолчанию, которая затем заставляет пользователя переключаться на цифровую клавиатуру в каждом поле. Кто-нибудь знает возможно ли это? Как?

Пояснение: Я знаю, что Apple в настоящее время не предоставляет API для этого. Мне интересно, может ли помочь создание пользовательского класса, унаследованного от UIWebView, или, может быть, создание пользовательской клавиатуры откроет некоторые возможности?

Обновление от 6 ноября 2009 г. - Как отмечается ниже, Apple недавно обновила функциональность сафари, так что это, опять же, поддерживается. Таким образом, принятый ответ был изменен, чтобы отразить это.

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

Ответы [ 10 ]

72 голосов
/ 01 октября 2009

Похоже, что Mobile Safari поддерживает новые атрибуты типа ввода HTML5 электронная почта , номер , поиск , телефон и URL . Они переключат отображаемую клавиатуру. См. атрибут type .

Так, например, вы можете сделать это:

<input type="number" />

И когда поле ввода имеет фокус, отображается цифровая клавиатура (как если бы пользователь набрал полную клавиатуру и нажал кнопку «123».

Если вы действительно хотите только цифры, вы можете указать:

<input type="tel" />

И тогда пользователь получит клавиатуру для набора номера телефона.

Я знаю, что это работает с Mobile Safari - я только предполагаю, что это будет работать с UIWebView.

28 голосов
/ 23 апреля 2013

Я нашел лучшее решение - использовать <input type="text" pattern="[0-9]*"> при разработке форм для мобильных и настольных браузеров.

4 голосов
/ 21 июня 2009

Проверено на IPhone OS 3.0, этой функциональности до сих пор не было, не знаю, почему Apple просто удалила эту удобную функцию, очень расстроенная, чтобы работать над этим прямо сейчас: (

4 голосов
/ 22 апреля 2009

С Документация Apple (примечание об UIWebView):

Нельзя указывать тип клавиатуры в элементах ввода. В веб-представлении отображается настраиваемая клавиатура, основанная на клавиатуре по умолчанию, но включающая некоторые дополнительные элементы управления для перемещения между элементами формы.

3 голосов
/ 27 декабря 2011

Вот список всех типов, совместимых с веб-представлениями iOS (4.0 и выше):

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

2 голосов
/ 21 апреля 2009

Это было возможно на первой итерации iPhone OS - Safari давал бы цифровые клавиатуры для формирования полей с именами «zip» или «phone» - но это исчезло в iPhone OS 2.0.

PhoneGap не имеет функции API, позволяющей переопределить это в данный момент. Это может быть что-то, над чем они работают, это определенно будет отличная особенность.

1 голос
/ 27 июля 2015

То, что вы также можете использовать для приложения на базе телефонного зазора iOS:

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

Это показано на рисунке ниже. Прекрасно работает с iOS 8.2 и phonegap 3.5 и выше.

1 голос
/ 11 января 2012

iOS Mobile Safari также поддерживает:

<input type="password" />
1 голос
/ 13 октября 2010

Вам необходимо внести изменения в HTML-часть проекта Dashcode:

  1. В Dashcode откройте index.html в окне кода.
  2. На холсте вида, с которым вы работаете, выберите поле ввода, которое вы хотите установить для использования оптимизированной клавиатуры.
  3. Нажмите на index.html, чтобы выделить его.
  4. Выберите изменить> найти в строке меню Dashcode.
  5. Введите в поле поиска точное имя, которое вы дали элементу управления текстовым полем. Find найдет элемент управления в файле index.html.
  6. Измените тип с type="text" на type="number".

Готово.

0 голосов
/ 29 июня 2015

iOs имеет цифровую клавиатуру UIKeyboardTypeNumbersAndPunctuation, но это нельзя вызвать из HTML (https://developer.apple.com/library/ios/documentation/StringsTextFonts/Conceptual/TextAndWebiPhoneOS/KeyboardManagement/KeyboardManagement.html)

, поскольку на клавиатуре "tel" пунктуация отсутствует, вы должны создать ее самостоятельно. Начиная с ios8 доступны пользовательские клавиатуры. Или, если вам нужна пунктуация, вы можете добавить кнопку ( Как добавить кнопку «Готово» на клавиатуре numpad в iOS ) к цифровой клавиатуре, которая появляется, когда вы задаете поле ввода с помощью type="number" pattern="[0-9]*" .

Для этого: код объектива-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('.');"]];
}

Затем вы должны добавить метод, который может быть доступен для всего приложения, в вашем коде 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);
                }
            },
...