33.0.OrangeUI控件使用说明(虚拟键盘控制-防止Edit遮挡)(基本原理)

新建一个工程,

FireMonkey下虚拟键盘显示和隐藏的事件封装在TForm类中,

OnVirtualKeyboardHidden事件是虚拟键盘隐藏事件,

OnVirtualKeyboardShown事件是虚拟键盘显示事件,

来看下这两个事件的声明:

KeyboardVisible:Boolean表示键盘是隐藏还是显示

Bounds:TRect表示键盘的区域

 

我们往窗体上面放一个Edit,放在底部偏下的位置,

以便虚拟键盘显示出来的时候正好能遮住它,

然后在IOS模拟器中运行,看一下效果,

点击一下Edit,虚拟键盘显示出来了,

调用了OnVirtualKeyboardShown,

Bounds参数的值为(0,220,320,480),

480-220=260,表示虚拟键盘的高有260,

并且看不见Edit了,因为虚拟键盘把Edit遮住了,

我们都不知道自己输入了什么内容,

一般的解决方法是,

把Edit放在ScrollBox里面,

再放一个Panel在窗体底部,

当虚拟键盘显示的时候,

把底部Panel的高度设置为虚拟键盘的高度,

再合理设置ScrollBox的Position,

就能把Edit移动到虚拟键盘上边,

 

步骤如下:

先放一个ScrollBox在窗体上,取名为sbClient,

Align设置为Client,

再放一个ScrollBoxContent到ScrollBox里面,取名为sbcClient,

不要设置它的Align,

拖动sbcClient到ScrollBox的顶部,

并且拉高Content到一定的宽度,

放一个Panel在Form上,

取名为pnlVirtualKeyboard,Align设置为Bottom,

它的背景颜色暂时设置为黑色,

因为初始状态下虚拟键盘是没有显示出来的,

先把Panel的高设置为0,

 

再放一个Edit在sbcClient上面,

背景颜色设置为桔黄色,

在虚拟键盘的事件中控制Panel的高度为虚拟键盘的高度,

在底部放一个Panel的用意是,

当虚拟键盘显示出来的时候,

设置这个Panel的高度为虚拟键盘的高度,

当虚拟键盘隐藏的时候,

设置这个Panel的高度为0,

运行一下,点击Edit,虚拟键盘显示出来了,

但还是把Edit遮住了,

可是Edit是放在ScrollBox上面的,

所以我们可以用手指拖动ScrollBox,

把Edit移上来,

那如何在虚拟键盘显示出来的时候自动设置ScrollBox的Position,

让Edit滚动到可视的位置呢?

窗体的Height为480,

虚拟键盘的Height为260,

所以剩下可显示内容的高度只有220,

但Edit的Top为320,

所以Edit被挡住了,

ScrollBox.VertScrollBar的Position要向上拖动,

那就在OnVirtualKeyboardShown事件中计算:

当虚拟键盘显示的时候,

ScrollBox.VertScrollBox.Position为

Edit.Top-(Form.Height-Keyboard.Height)+Edit.Height,

其实,(Form.Height-Keyboard.Height)就是Keyboard.Top,

所以也可以写成:

Edit.Top-Keyboard.Top+Edit.Height,

 

我们来试一下:

初始状态:

点击Edit, 显示出虚拟键盘:

即使我把Edit放到最底下,

一样可以:

发表评论