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.
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 }} {{ item.auto2 }} </p> <p *ngIf="item.houseNumber!=='' || item.flatNumber!==''"> <ion-icon name="home"></ion-icon> <span *ngIf="item.houseNumber!==''">{{ item.houseNumber }} / </span> {{ item.flatNumber }} </p> </ion-item> </ion-item-sliding> </ion-list> </ion-content>
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