弹出键盘输入框上移

最新推荐文章于 2021-06-09 11:00:09 发布

原创最新推荐文章于 2021-06-09 11:00:09 发布 · 1.5k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#虚拟键盘 #uitextfield #移动 #用户体验

程序开发专栏收录该内容

11 篇文章

订阅专栏

弹出键盘输入框上移

当使用UITextField或UITextView输入框时，我们需要弹出虚拟键盘进行输入。系统默认情况，弹出虚拟键盘时输入框是不会移动的，键盘弹出后，可能会遮挡住UITextField或UITextView的显示，造成看不到已经输入的内容，影响用户体验。这时候就需要让输入框自动上移，直至不被键盘遮挡。这样才能完整地看到输入内容，及时做修改。当输入结束后，再把输入框的位置恢复至原来的位置。

1.创建工程项目和视图控制器

  1、创建一个empty（空的）工程项目，新建一个UIViewController；

  2、选中工程，右键-New File…选择“Cocoa Touch Class”-Next，给个合理的名称ViewController，再Next完成；

  3、在AppDelegate.m文件包含#import "MainViewController.h"；

  4、初始化创建ViewController的视图控制器，并用导航栏控制器包含。将之设置为根视图控制器。

MainViewController *main = [[MainViewController alloc] init];
    UINavigationController *navi = [[UINavigationController alloc] initWithRootViewController:main];
    self.window.rootViewController = navi;

2.创建UITextField及添加代理

  1、在MainViewController.h添加事件代理和数据源代理<UTextFieldDelegate>；

  2、在MainViewController.m创建并初始UITextField；

  3、代理授权并添加至视图。

#import "MainViewController.h"

@interface MainViewController () <UITextFieldDelegate>

@property (nonatomic, retain) UITextField *textField1;

self.textField1 = [[UITextField alloc] initWithFrame:CGRectMake(100, 500, 200, 40)];
    self.textField1.placeholder = @"请输入邮箱";
    self.textField1.layer.cornerRadius = 5;
    self.textField1.borderStyle = UITextBorderStyleRoundedRect;
    self.textField1.delegate = self;
    [self.view addSubview:self.textField1];

3.实现弹出键盘时，输入框上移至不被隐藏

  1、在ViewController.m添加并实现textFieldShouldBeginEditing方法；

  2、在textFieldShouldBeginEditing内计算输入框需要上移的高度；

  3、让输入框动画上移。

注：英文键盘默认高度216，其他框可以的显示高度可以适当给高点，这里给50。

- (BOOL)textFieldShouldBeginEditing:(UITextField *)textField
{
    CGFloat offset = self.view.frame.size.height - (textField.frame.origin.y + textField.frame.size.height + 216 + 50);

    if (offset <= 0)
    {
        [UIView animateWithDuration:0.3 animations:^{

            CGRect frame = self.view.frame;
            frame.origin.y = offset;
            self.view.frame = frame;
        }];
    }
    return YES;
}

4.实现回收键盘时，输入框恢复原来的位置

  1、在MainViewController.m添加并实现textFieldShouldEndEditing方法；

  2、让输入框动画恢复原来状态。

- (BOOL)textFieldShouldEndEditing:(UITextField *)textField
{
    [UIView animateWithDuration:0.3 animations:^{

        CGRect frame = self.view.frame;
        frame.origin.y = 0;
        self.view.frame = frame;

    }];

    return YES;
}