Help with cordova-plugin-keyboard

Ionic Framework ionic-v3
1

Hi.

I created simple application with chat functional. But i have a problem with shrink(resize) webview in IOS. Please help to find a solution.

image
image640×1136 41.9 KB

Code:

<ion-header>
        <ion-navbar>
            <button ion-button menuToggle icon-only>
                <ion-icon name="menu"></ion-icon>
            </button>
            <ion-title>
            </ion-title>
            <ion-buttons *ngIf="us.isAdmin" end>
                <button ion-button icon-only (click)="showInvites()">
                    <ion-icon name="add"></ion-icon>
                </button>
            </ion-buttons>
        </ion-navbar>
    </ion-header>
    <ion-content>
        <ion-searchbar [(ngModel)]="searchQuery" (ionInput)="getItems()" (ionCancel)="clearFilter()" [showCancelButton]="true"></ion-searchbar>
        <ion-list>
            <ion-item-sliding *ngFor="let item of neighbors">
                <ion-item (click)="openDetail(item)">
                    <ion-avatar item-left>
                        <img src="{{ item.photoURL }}">
                    </ion-avatar>
                    <h3>{{ item.displayName }} </h3>
                    <p *ngIf="item.auto!=null">
                        <ion-icon name="car"></ion-icon>
                        {{ item.auto }} &nbsp; {{ item.auto2 }}
                    </p>
                    <p *ngIf="item.houseNumber!=='' || item.flatNumber!==''">
                        <ion-icon name="home"></ion-icon>
                        &nbsp;
                        <span *ngIf="item.houseNumber!==''">{{ item.houseNumber }} / </span> {{ item.flatNumber }}
                    </p>
                </ion-item>
            </ion-item-sliding>
        </ion-list>
    </ion-content>

image
image640×1136 41.3 KB

Code:

 <ion-header>
    <ion-navbar>
        <button ion-button menuToggle icon-only>
            <ion-icon name="menu"></ion-icon>
        </button>
        <ion-title>
            Test
        </ion-title>
    </ion-navbar>
</ion-header>
<ion-content #content class="outer-content chat">
    <div class="header">
        <div class="friend-data">
            <div class="name">{{ chat.user?.displayName }}</div>
        </div>
        <div class="privateItemAvatar">
            <img *ngIf="chat.user!=null" src="{{ chat.user.photoURL }}"/>
        </div>
    </div>
    <div class="history">
        <div class="wrapper">
            <div class="msg" *ngFor="let message of messages | async" [ngClass]="(message.type == 'in') ? 'in' : 'out'">
                <div class="text">{{ message.text }}</div>
                <div class="avatar">
                    <img src="{{ user.photoURL }}" *ngIf="(message.type === 'in') && user?.photoURL!=null"/>
                    <img src="{{ message.user.photoURL }}"
                         *ngIf="(message.type === 'out') && message.user?.photoURL!=null"/>
                </div>
            </div>
        </div>
    </div>
</ion-content>
<ion-footer>
    <ion-toolbar position="bottom">
        <ion-item no-lines>
            <ion-input placeholder="Введите сообщение" clearInput [(ngModel)]="message"></ion-input>
            <button outline clear item-right (click)="sendMessage(message);">
                Отправить
            </button>
        </ion-item>
    </ion-toolbar>
</ion-footer>

Your system information:

Cordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.0
Ionic CLI Version: 2.1.0
Ionic App Lib Version: 2.1.0-beta.1
OS:
Node Version: v6.1.0

In config.xml

  <preference name="HideKeyboardFormAccessoryBar" value="true"/>
  <preference name="DisableScrollingInShrinkView" value="true"/>
  <preference name="KeyboardShrinksView" value="true"/>

  <plugin name="cordova-plugin-keyboard" spec="https://github.com/cjpearson/cordova-plugin-keyboard"/>

P.S.Build app with ionic.io