Questions tagged [react-native-button]
17 questions
100
votes
15 answers
React-Native Button style not work
Import_this
import {AppRegistry, Text, View, Button, StyleSheet} from 'react-native';
This my React Button code But style not working Hare ...
6
votes
4 answers
Icon is not displaying in react-navigation-header-buttons (React Native)
I am trying to add an icon to the headerRight using react-navigation-header-buttons library. But the title of the icon is displaying instead of the icon.
This is the code where icon should display.
import React, { useState, useLayoutEffect } from…

Denver Shan
- 106
- 1
- 6
3
votes
2 answers
React Native Button: Fit to text layout
In the Button docs from React-Native here it shows an image which says: Fit to text layout. That is what I am searching for because my button always has full width, but I want it to only be as wide as the text is. But neither in the docs nor in the…

Moritz Pfeiffer
- 447
- 1
- 7
- 23
2
votes
1 answer
how to create sliding tab button in react native
I follow a tutorial for creating a sliding tab or segment component using animation like below:
const SlidingTabBar = (props) => {
const [active, setActive] = useState(0)
const [xTabOne, setXTabOne] = useState(0)
const [xTabTwo, setXTabTwo]…

Ash Archin
- 421
- 9
- 21
2
votes
3 answers
Remove space between 2 button in a row
I have 2 button places in a row like this:
I want to remove the space between the two buttons and have them side by side in a row like this:
How can I achieve this?
My Code:

3iL
- 2,146
- 2
- 23
- 47
2
votes
2 answers
React Native: What is the best way to make a list of button elements given data from a Fetch(Url) request?
I want to make a list of button elements that the user can tap. The amount of button elements will vary from 3 - 5 depending on the result of a fetch request that I do. I know how to populate a flatlist based on the result of a fetch request but not…

hellohello
- 53
- 1
- 6
1
vote
2 answers
How to do a useEffect() style ajax call after button press in React Native?
I'm new to React and React Native.
Trying to build a simple app that does an API call on the press of a button.
My code below works but just doesn't "look right" to me.
useEffect() is run after the page loads? Seems to be run multiple times.
I'm…

Scottish Smile
- 455
- 7
- 22
1
vote
2 answers
How to put buttons on the right and left side in react native
How can I add five buttons to the right side of my app? I've put five buttons on the left, and I need to put five more on the right, but I'm not sure how.
https://snack.expo.io/@therealsneh/vacation-spot-real Code snack.
Picture:
Picture of the app.…

Sneh Parikh
- 15
- 6
1
vote
0 answers
React Native Button not working when nested
Just started with react native and I am not able to get button working
Button 1 is working as expected
but button 2 is nested and not working
```
import {
StyleSheet,
View,
Text,
Button,
TouchableHighlight
} from "react-native";
import {…

TireX
- 21
- 4
1
vote
2 answers
Unable to use StatelessComponent in typescript using react native
I am trying to extend Button component of react-native-button library.
The class using the extended component:
import { DefaultButton } from "../../support/ui/DefaultButton";
...
render() {
const loginProps = {
title: "login",
…

chubao
- 5,871
- 6
- 39
- 64
0
votes
0 answers
React Native TouchableOpacity is working only on very few area parts
I am using a view as Floating Action Button. The same page has a scrollview, I am not worried about the position or the styling.
Expected behavior :- The View which is wrapped with a Should response to the click event at every points of the…

manigedit
- 56
- 4
0
votes
1 answer
React Native: cant change button style
I am trying to change the style of a button in React Native, but the edits for the button colour, margin, outlines etc aren't working at all. Here is the pic. Below is my code for HomeScreen.js
import React from 'react';
import {
StyleSheet,
…

btzy
- 45
- 1
- 1
- 6
0
votes
1 answer
Why doesn't react native register the user pressing a button?
I'm trying to use a touchablehighlight component and when I press it, nothing happens. So I changed it to a button and added a console log and still, react native won't register the press.
I'm using expo and I'm relatively new to react…

Tegid Goodman-Jones
- 21
- 5
0
votes
1 answer
How to position text field above a button in react native
I'd like to add a text entry field right above this button, but I'm not sure how to do it
const styles = StyleSheet.create({
button: {
marginTop: 400,
justifyContent: 'center',
alignItems: 'center'
},
textInput: {
borderWidth:…

Sneh Parikh
- 15
- 6
0
votes
1 answer
React native: Use button to run a class
I am trying to run a class using a button but I can't make it work. I know that if I want to run a class I just need to use:
So, I tried to do this:

Damo
- 1
- 2