mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-22 13:32:54 +08:00
feat(content): add scrollToBottom
This commit is contained in:
@ -268,7 +268,7 @@ export class Content extends Ion {
|
|||||||
* @returns {Promise} Returns a promise which is resolved when the scroll has completed.
|
* @returns {Promise} Returns a promise which is resolved when the scroll has completed.
|
||||||
*/
|
*/
|
||||||
scrollToTop(duration: number = 300) {
|
scrollToTop(duration: number = 300) {
|
||||||
return this.scrollTo(0, 0, duration);
|
return this._scroll.scrollToTop(duration);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -287,6 +287,15 @@ export class Content extends Ion {
|
|||||||
this._scroll.setTop(top);
|
this._scroll.setTop(top);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Scroll to the bottom of the content component.
|
||||||
|
* @param {number} [duration] Duration of the scroll animation in milliseconds. Defaults to `300`.
|
||||||
|
* @returns {Promise} Returns a promise which is resolved when the scroll has completed.
|
||||||
|
*/
|
||||||
|
scrollToBottom(duration: number = 300) {
|
||||||
|
return this._scroll.scrollToBottom(duration);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @private
|
* @private
|
||||||
*/
|
*/
|
||||||
|
@ -48,6 +48,7 @@ class MyCmpTest{}
|
|||||||
<button ion-item (click)="quickPush()">New push during transition</button>
|
<button ion-item (click)="quickPush()">New push during transition</button>
|
||||||
<button ion-item (click)="quickPop()">New pop during transition</button>
|
<button ion-item (click)="quickPop()">New pop during transition</button>
|
||||||
<button ion-item (click)="reload()">Reload</button>
|
<button ion-item (click)="reload()">Reload</button>
|
||||||
|
<button ion-item (click)="scrollToBottom()">Scroll to bottom</button>
|
||||||
<button *ngFor="#i of pages" ion-item (click)="pushPrimaryHeaderPage()">Page {{i}}</button>
|
<button *ngFor="#i of pages" ion-item (click)="pushPrimaryHeaderPage()">Page {{i}}</button>
|
||||||
<button ion-item (click)="content.scrollToTop()">Scroll to top</button>
|
<button ion-item (click)="content.scrollToTop()">Scroll to top</button>
|
||||||
</ion-list>
|
</ion-list>
|
||||||
@ -121,6 +122,10 @@ class FirstPage {
|
|||||||
scrollToTop() {
|
scrollToTop() {
|
||||||
this.content.scrollToTop();
|
this.content.scrollToTop();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
scrollToBottom() {
|
||||||
|
this.content.scrollToBottom(1000);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -104,6 +104,18 @@ export class ScrollView {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
scrollToTop(duration: number): Promise<any> {
|
||||||
|
return this.scrollTo(0, 0, duration);
|
||||||
|
}
|
||||||
|
|
||||||
|
scrollToBottom(duration: number): Promise<any> {
|
||||||
|
let y = 0;
|
||||||
|
if (this._el) {
|
||||||
|
y = this._el.scrollHeight - this._el.clientHeight;
|
||||||
|
}
|
||||||
|
return this.scrollTo(0, y, duration);
|
||||||
|
}
|
||||||
|
|
||||||
stop() {
|
stop() {
|
||||||
this.isPlaying = false;
|
this.isPlaying = false;
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user