javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-20 04:14:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(content): scrollToPoint reliability

Browse Source 
fixes #15257
This commit is contained in:
Manu Mtz.-Almeida
2018-08-21 18:18:25 +02:00
parent c567a82bfc
commit e0f12598aa
4 changed files with 8 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
core/src/components.d.ts vendored
View File

@ -2107,7 +2107,7 @@ declare global {
* The text to display on the ok button. Default: `OK`.
*/
'okText': string;
'open': (ev?: UIEvent | undefined) => Promise<HTMLIonActionSheetElement> | Promise<HTMLIonAlertElement> | Promise<HTMLIonPopoverElement>;
'open': (ev?: UIEvent | undefined) => Promise<HTMLIonPopoverElement> | Promise<HTMLIonActionSheetElement> | Promise<HTMLIonAlertElement>;
/**
* The text to display when the select is empty.
*/

14
core/src/components/content/content.tsx
View File

@ -206,7 +206,7 @@ export class Content {
}
let resolve!: () => void;
let startTime: number;
let startTime = 0;
const promise = new Promise<void>(r => resolve = r);
const fromY = el.scrollTop;
const fromX = el.scrollLeft;
@ -216,11 +216,11 @@ export class Content {
// scroll loop
const step = (timeStamp: number) => {
let linearTime = Math.min(1, ((timeStamp - startTime) / duration));
const easedT = (--linearTime) * linearTime * linearTime + 1;
const linearTime = Math.min(1, ((timeStamp - startTime) / duration)) - 1;
const easedT = Math.pow(linearTime, 3) + 1;
if (deltaY !== 0) {
el.scrollTop = (easedT * deltaY) + fromY;
el.scrollTop = Math.floor((easedT * deltaY) + fromY);
}
if (deltaX !== 0) {
el.scrollLeft = Math.floor((easedT * deltaX) + fromX);
@ -233,14 +233,9 @@ export class Content {
requestAnimationFrame(step);
} else {
this.isScrolling = false;
resolve();
}
};
// start scroll loop
this.isScrolling = true;
// chill out for a frame first
requestAnimationFrame(ts => {
startTime = ts;
@ -353,7 +348,6 @@ function updateScrollDetail(
detail.startX = currentX;
detail.startY = currentY;
detail.velocityX = detail.velocityY = 0;
console.log('hhhhhh');
}
detail.timeStamp = timestamp;
detail.currentX = detail.scrollLeft = currentX;

4
core/src/components/ripple-effect/readme.md
View File

@ -17,8 +17,8 @@ The ripple effect component adds the [Material Design ink ripple interaction eff
## Methods
| Method | Description |
| ----------- | ------------------------------------------- |
| `addRipple` | Adds the ripple effect to the parent elment |
| ----------- | -------------------------------------------- |
| `addRipple` | Adds the ripple effect to the parent element |
----------------------------------------------

1
core/src/components/title/readme.md
View File

@ -12,7 +12,6 @@
| Property | Attribute | Description | Type |
| -------- | --------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------- |
| `color` | `color` | The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics). | `Color` |
| `mode` | `mode` | The mode determines which platform styles to use. Possible values are: `"ios"` or `"md"`. | `Mode` |
----------------------------------------------