Merged PR 786925: Add delay load for background image.

Add delay load for background image.
This commit is contained in:
Dongyu Zhao 2018-09-29 09:17:08 +00:00
Родитель 729f64d1f4
Коммит a8bc507eef
4 изменённых файлов: 77 добавлений и 64 удалений

27
dist/Components/Basic/ImageBackground.js поставляемый
Просмотреть файл

@ -22,24 +22,27 @@ export class ImageBackground extends React.Component {
});
}
};
this.fetchImageSize = () => {
const { url } = this.props;
if (url) {
Image.getSize(url, (width, height) => {
if (width > 0 && height > 0) {
this.setState({
imgRatio: width / height,
});
}
}, (error) => {
this.onError(error);
});
}
};
this.state = {
containerRatio: 1,
imgRatio: 1,
};
}
componentDidMount() {
const { url } = this.props;
if (url) {
Image.getSize(url, (width, height) => {
if (width > 0 && height > 0) {
this.setState({
imgRatio: width / height,
});
}
}, (error) => {
this.onError(error);
});
}
setTimeout(this.fetchImageSize, 500);
}
render() {
return (React.createElement(View, { style: [

Просмотреть файл

@ -22,24 +22,27 @@ export class ImageBackground extends React.Component {
});
}
};
this.fetchImageSize = () => {
const { url } = this.props;
if (url) {
Image.getSize(url, (width, height) => {
if (width > 0 && height > 0) {
this.setState({
imgRatio: width / height,
});
}
}, (error) => {
this.onError(error);
});
}
};
this.state = {
containerRatio: 1,
imgRatio: 1,
};
}
componentDidMount() {
const { url } = this.props;
if (url) {
Image.getSize(url, (width, height) => {
if (width > 0 && height > 0) {
this.setState({
imgRatio: width / height,
});
}
}, (error) => {
this.onError(error);
});
}
setTimeout(this.fetchImageSize, 500);
}
render() {
return (React.createElement(View, { style: [

Просмотреть файл

@ -43,23 +43,7 @@ export class ImageBackground extends React.Component<IProps, IState> {
}
public componentDidMount() {
const { url } = this.props;
if (url) {
Image.getSize(
url,
(width, height) => {
if (width > 0 && height > 0) {
this.setState({
imgRatio: width / height,
});
}
},
(error) => {
this.onError(error);
}
);
}
setTimeout(this.fetchImageSize, 500);
}
public render() {
@ -109,6 +93,37 @@ export class ImageBackground extends React.Component<IProps, IState> {
}
}
private onLayout = (event: LayoutChangeEvent) => {
let width = event.nativeEvent.layout.width;
let height = event.nativeEvent.layout.height;
if (width > 0 && height > 0) {
this.setState({
containerRatio: width / height,
});
}
}
private fetchImageSize = () => {
const { url } = this.props;
if (url) {
Image.getSize(
url,
(width, height) => {
if (width > 0 && height > 0) {
this.setState({
imgRatio: width / height,
});
}
},
(error) => {
this.onError(error);
}
);
}
}
private get resizeMethod() {
switch (this.props.resizeMode) {
case 'repeat':
@ -122,15 +137,4 @@ export class ImageBackground extends React.Component<IProps, IState> {
}
}
}
private onLayout = (event: LayoutChangeEvent) => {
let width = event.nativeEvent.layout.width;
let height = event.nativeEvent.layout.height;
if (width > 0 && height > 0) {
this.setState({
containerRatio: width / height,
});
}
}
}

Просмотреть файл

@ -22,24 +22,27 @@ export class ImageBackground extends React.Component {
});
}
};
this.fetchImageSize = () => {
const { url } = this.props;
if (url) {
Image.getSize(url, (width, height) => {
if (width > 0 && height > 0) {
this.setState({
imgRatio: width / height,
});
}
}, (error) => {
this.onError(error);
});
}
};
this.state = {
containerRatio: 1,
imgRatio: 1,
};
}
componentDidMount() {
const { url } = this.props;
if (url) {
Image.getSize(url, (width, height) => {
if (width > 0 && height > 0) {
this.setState({
imgRatio: width / height,
});
}
}, (error) => {
this.onError(error);
});
}
setTimeout(this.fetchImageSize, 500);
}
render() {
return (React.createElement(View, { style: [