[Button] Activity indicator

[xdu]

Hi,

Is it possible to add the activity indicator to the button component ? It could be very useful when creating a "login" button or "reload" button.

The indicator can be shown in the place the button icon when the indicator is turned on.

Thanks.

[sood03]

This can be easily implemented where you have 2 components at the same position and their visibility depending on one state variable. Initially you can set the button visibility to be true. When the login button is clicked, change the state variable to false which would hide the button and show the activity indicator.

Have a look at snippet below

                    </View>
                    {   this.state.buttonVisible &&
                    <View style={styles.signin}>
                        <TouchableNativeFeedback>
                            <View >
                                <Text >Sign In</Text>
                            </View>
                        </TouchableNativeFeedback>
                    </View>
                    }
                    {   !this.state.buttonVisible &&
                    <View style={styles.signin}>
                        <ActivityIndicator
                            animating={this.state.visible}
                            style={[styles.centering]}
                            size="large"
                            color="#FFFFFF"
                        />
                    </View>
                    }

When you click on Sign In button, set buttonVisible state variable as false which will hide the button and show the activity indicator. This will work