Skip to content
This repository has been archived by the owner on Sep 28, 2021. It is now read-only.

Allow specifying whether to use useNativeDriver #394

Merged
merged 2 commits into from
May 13, 2020
Merged

Allow specifying whether to use useNativeDriver #394

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
31298e1
Allow specifying whether to use useNativeDriver
petertravelchime May 12, 2020
963416e
Update documentation
petertravelchime May 12, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -105,6 +105,7 @@ export default class App extends React.Component {
| doubleClickInterval | number | no | Double click interval. | |
| pageAnimateTime | number | no | Set the animation time for page flipping. | `100` |
| enablePreload | boolean | no | Preload the next image | `false` |
| useNativeDriver | boolean | no | Whether to animate using [`useNativeDriver`](https://reactnative.dev/docs/animations#using-the-native-driver) | `false` |
| menus | function<br><br>`({cancel,saveToLocal}) => React.ReactElement<any>` | no | Custom menus, with 2 methods:`cancel` to hide menus and `saveToLocal` to save image to camera
| menuContext | object<br><br>`{someKey: someValue}` | no | Custom menu context. | `{ saveToLocal: 'save to the album', cancel: 'cancel' }`
## Development pattern
Expand Down
10 changes: 5 additions & 5 deletions src/image-viewer.component.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,7 @@ export default class ImageViewer extends React.Component<Props, State> {
Animated.timing(this.fadeAnim, {
toValue: 1,
duration: 200,
useNativeDriver: false
useNativeDriver: !!this.props.useNativeDriver
}).start();
}
}
Expand Down Expand Up @@ -111,7 +111,7 @@ export default class ImageViewer extends React.Component<Props, State> {
Animated.timing(this.fadeAnim, {
toValue: 1,
duration: 200,
useNativeDriver: false
useNativeDriver: !!nextProps.useNativeDriver
}).start();
}
);
Expand Down Expand Up @@ -307,7 +307,7 @@ export default class ImageViewer extends React.Component<Props, State> {
Animated.timing(this.positionX, {
toValue: this.positionXNumber,
duration: this.props.pageAnimateTime,
useNativeDriver: false
useNativeDriver: !!this.props.useNativeDriver
}).start();

const nextIndex = (this.state.currentShowIndex || 0) - 1;
Expand Down Expand Up @@ -341,7 +341,7 @@ export default class ImageViewer extends React.Component<Props, State> {
Animated.timing(this.positionX, {
toValue: this.positionXNumber,
duration: this.props.pageAnimateTime,
useNativeDriver: false
useNativeDriver: !!this.props.useNativeDriver
}).start();

const nextIndex = (this.state.currentShowIndex || 0) + 1;
Expand All @@ -366,7 +366,7 @@ export default class ImageViewer extends React.Component<Props, State> {
Animated.timing(this.positionX, {
toValue: this.standardPositionX,
duration: 150,
useNativeDriver: false
useNativeDriver: !!this.props.useNativeDriver
}).start();
}

Expand Down
6 changes: 6 additions & 0 deletions src/image-viewer.type.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -98,6 +98,12 @@ export class Props {
*/
public pageAnimateTime?: number = 100;

/**
* 是否启用原生动画驱动
* Whether to use the native code to perform animations.
*/
public useNativeDriver?: boolean = false;

/**
* 长按图片的回调
*/
Expand Down