Почему доминантный цвет не работает с View-shot? - PullRequest
Новая
       37

Почему доминантный цвет не работает с View-shot?

0 голосов
/ 25 мая 2019

Я хочу, чтобы моя переменная "dominant_color" обновлялась с моим снимком экрана из View-Shot. Я попробовал случайную картинку из Интернета, и это сработало. Но когда я пытаюсь использовать Скриншот, это не так. Следующий вопрос: мне нужна позже функция сна из-за низкой производительности, если я делаю скриншоты и постоянно обновляю dominat_color?

Я не понимаю, почему это не работает. Может кто-нибудь помочь мне, пожалуйста? 

...
import ViewShot from "react-native-view-shot";
import RNSketchCanvas from '@terrylinla/react-native-sketch-canvas';
import { colorsFromUrl } from 'react-native-dominant-color';

export default class Level_2 extends Component {

            constructor() {
                super();
                this.state = {
                    drawcolor: [{color: '#ff0000'}, {color: '#00ff00'}],
                    dominant_color: '#ffffff',
                    imageUrl: 'https://source.unsplash.com/random/800x600',
                }
            }

            componentDidMount () {

        // Random pictures updates dominant color after 2 seconds
                sleep(2000).then(() => {
                    colorsFromUrl(this.state.imageUrl, (err, colors) => {
                        if (!err) {
                            this.setState({dominant_color: colors.dominantColor})
                        }
                    })
                })

        // Screenshot picture should update dominant color after 4 seconds (not working)
                sleep(4000).then(() => {
                   Alert.alert("Color should update now again")
                    this.refs.viewShot.capture().then(uri => {
                        colorsFromUrl(uri, (err, colors) => {
                            if (!err) {
                                this.setState({dominant_color: colors.dominantColor})
                            }
                        })
                    });
                })

                function sleep (time) {
                    return new Promise((resolve) => setTimeout(resolve, time));
                }
            }

            render() {
                return (
                    <View style={styles.container}>

                        <Text>dominant Color: {this.state.dominant_color} </Text>
                        <ViewShot ref="viewShot" options={{ format: "jpg", quality: 0.9 }}>
                        <View style={styles.paint}>
                                <RNSketchCanvas
                                    containerStyle={{ flex: 1 }}
                                    canvasStyle={{ flex: 1 }}
                                    defaultStrokeWidth={15}
                                    defaultStrokeIndex={0}
                                    strokeColors={this.state.drawcolor}
                                />

                        </View>
                        </ViewShot>
                    </View>
                );
            }
        }
     ...
...