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…
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]…
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…
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.…
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…
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, …
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…
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:…
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:
1
2