i have a multi-slide page slider app. each page has a fixed header, and then some content and then a footer, the content should scroll if more than the content area size.
what changed? i didn’t change any of this page
each page looks like this, with different data source from my data provider scroll=“true” has-header=“true”
this is required, else the content area is empty
.slide-zoom{
height:100%;
overflow-y:scroll
}
<ion-slide class="theroot slide-zoom" width="100%" height="100%" >
<ion-toolbar no-border no-padding>
<ion-row>
<ion-col col-1>
<button ion-button icon-only (click)="addeditClicked(1,getselectedRow('viewer'),'viewer',{true:'add',false:'edit'}[getselectedRow('viewer')<0])">
<ion-icon [ios]="getselectedRow('viewer')<0 ? 'ios-add':'ios-search'" [md]="getselectedRow('viewer')<0 ? 'md-add':'md-search'"></ion-icon>
</button>
</ion-col>
<ion-col col-10>Viewers</ion-col>
</ion-row>
</ion-toolbar>
<ion-toolbar no-padding no-border>
<ion-row>
<ion-col col-4 class=" center">Name</ion-col>
<ion-col col-3 class=" center">Tags</ion-col>
<ion-col col-2 class=" center">Advance</ion-col>
<ion-col col-1 class=" center">Rate</ion-col>
<ion-col col-2 class=" center">Active</ion-col>
</ion-row>
</ion-toolbar>
<ion-content >
<ion-row *ngFor="let viewer of data.Viewers;let i=index"
[ngClass]="{true:'selected',false:''}[i == getselectedRow('viewer')]"
(dblTap)="addeditClicked(2,i,'viewer','edit')" nowrap
(press)="deleterow(i,'viewer')"
>
<ion-col col-4 class = "colb center" (click)="setClickedRow(i,'viewer','Name')">{{viewer.Name}}</ion-col>
<ion-col col-3 class="colb center" (click)="setClickedRow(i,'viewer','Tags')">
<ion-list >
<ion-item no-lines class="center tag-background-transparent" [ngClass]="{true:'tag-text-white',false:''}[i == getselectedRow('viewer')]" *ngFor="let tag of viewer.Tags">{{tagfromID(tag)}}</ion-item>
</ion-list>
</ion-col>
<ion-col col-2 class = " colb center " (click)="setClickedRow(i,'viewer','Advance')">{{viewer.Advance}} </ion-col>
<ion-col col-1 class = " colb center" (click)="setClickedRow(i,'viewer','RefreshRate')">{{viewer.ImageRefreshRate}}</ion-col>
<ion-col col-2 class = "col colb center" (click)="setClickedRow(i,'viewer','Active')">{{viewer.Active}}</ion-col>
</ion-row>
</ion-content>
</ion-slide>
all has been working fine the last couple weeks, until this morning…
I need to add a pull to refresh to each page.
i added the html to the content section above (headers and footer to stay fixed on slide page)
saved, and then edited the data provider to add the refresh handler. and saved.
auto rebuilt for both android and ios…
now the ios app still works as expected, but the android app slide page is scrolling the header off the page. footer still fixed.
I deleted the refresher html and saved again, live reload, still broken… stopped live reload, and started build again. ionic cordova run android -l -s -c
android still broken
<ion-slide class="theroot slide-zoom" width="100%" height="100%">
<ion-toolbar >
<ion-row>
<ion-col col-1>
<div>
<button ion-button icon-only (click)="addeditClicked(1,getselectedRow('image'),'image',{true:'add',false:'edit'}[getselectedRow('image')<0])">
<ion-icon [ios]="getselectedRow('image')<0 ? 'ios-add':'ios-search'" [md]="getselectedRow('image')<0 ? 'md-add':'md-search'"></ion-icon>
</button>
</div>
</ion-col>
<ion-col col-10>Images</ion-col>
</ion-row>
</ion-toolbar>
<ion-toolbar >
<ion-row>
<ion-col col-3 class=" center">Name</ion-col>
<ion-col col-3 class=" center">Tags</ion-col>
<ion-col col-3 class=" center">Source</ion-col>
<ion-col col-3 class=" center">Path</ion-col>
</ion-row>
</ion-toolbar>
<ion-content>
<ion-row *ngFor="let image of data.Images;let ii=index;"
(press)="deleterow(ii,'image')"
[ngClass]="{true:'selected',false:''}[ii == getselectedRow('image')]"
(dblTap)="addeditClicked(2, ii,'image','edit')">
<ion-col item-content col-3 class = "colb center " (click)="setClickedRow(ii,'image','Name')">{{image.Name}}</ion-col>
<ion-col item-content col-3 class="colb center" (click)="setClickedRow(ii,'image','Tags')">
<ion-list >
<ion-item no-lines class="center tag-background-transparent" [ngClass]="{true:'tag-text-white',false:''}[ii == getselectedRow('image')]" *ngFor="let tag of image.Tags">{{tagfromID(tag)}}</ion-item>
</ion-list>
</ion-col>
<ion-col item-content col-3 class = "colb center " (click)="setClickedRow(ii,'image','DataSource')"><ion-col>{{datasourcefromID(image.DataSource)}}</ion-col></ion-col>
<ion-col item-content col-3 class = "colb path" (click)="setClickedRow(ii,'image','PathFromSource')">{{image.PathFromSource}}</ion-col>
</ion-row>
</ion-content>
</ion-slide>