Ionic 2/3 WhatsApp喜欢信使功能

问题描述：

我想用Ionic 3使用JavaScript实现WhatsApp类似Messenger的功能，并用键盘遇到麻烦。当我点击输入文本区域时，键盘将按照键盘打开的量移动整个应用程序。如果我使用下面的代码来禁用滚动功能，那么我的输入文本区域会隐藏在键盘后面。Ionic 2/3 WhatsApp喜欢信使功能

我想要的是禁用滚动，但输入文本区域与键盘一起向上移动。有谁知道如何巧妙地解决这个问题？非常感谢！！

{ 
     platforms : { 
      ios : { 
      scrollAssist: false, 
      autoFocusAssist: false 
      } 
     } 
     }

答

如果我理解你正确看待keyboard plugin它有方法disableScroll（禁用）

是的，这解决了部分问题。另一部分事实上，我的输入文本框现在隐藏在打开的键盘后面。任何想法如何阻止滚动，但仅限于输入文本区域（您输入消息的地方）？谢谢！ – Dimitri

答

要做的第一件事就是用ionic-plugin-keyboard从推动/滚动内容窗格上停止原生浏览器和让键盘上滑动并覆盖现有内容：

constructor(private keyboard: Keyboard) { 
    this.platform.ready().then(() => { 
    // ... 

    this.keyboard.disableScroll(false); // <- like this 

    // ... 
}

注意：Keyboard.disableScroll() iOS和Windows支持只有。

是的，解决了部分问题。另一部分事实上，我的输入文本框现在隐藏在打开的键盘后面。

就像你可以看到this OS answer，我发现下面的配置似乎更好地工作（记住，有是有关键盘的一些问题仍处于打开状态）：

@NgModule({ 
    declarations: [ 
     MyApp, 
     //... 
    ], 
    imports: [ 
     //... 
     IonicModule.forRoot(MyApp, { 
      scrollPadding: false, 
      scrollAssist: true, 
      autoFocusAssist: false 
     }) 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
     // ... 
    ], 
    providers: [ 
     // ... 
    ] 
}) 
export class AppModule { }

关键是scrollPadding: false和scrollAssist: true：通过保留scrollAssist: true，我们避免输入被键盘隐藏，如果它靠近页面的底部，并且通过设置scrollPadding: false，我们还可以避免与隐藏后的空白空间相关的一些奇怪的错误键盘。

Ionic 2/3 WhatsApp喜欢信使功能

相关推荐