1

How can I change to background color of FAB.Group component from react-native-paper. If I add a background Color it's changing the color of the overlay instead of the button. Help is much appreciated. Thank you

<FAB.Group
  style={styles.fab}
  open={open}
  color={"#333366"}
  icon={open ? "plus" : "plus"}
  actions={[
    {
      icon: "alpha-r-circle",
      label: "Add Custom Room",
      onPress: () => navigation.navigate("Create Room"),
    },
    {
      icon: "television",
      label: "Add Appliance",
      onPress: () => navigateAddAppliance(),
      small: false,
    },
  ]}
  onStateChange={onStateChange}
  // onPress={() => {
  //   if (open) {
  //     // do something if the speed dial is open
  //   }
  // }}
/>

Styles

fab: {
    position: "absolute",
    padding: 20,
    // height: "100%",
    right: 0,
    bottom: 100,
    // color: "red"
},
Kartikey
  • 4,516
  • 4
  • 15
  • 40

1 Answers1

2

You almost had it, just change line below

style={styles.fab}

for this other one

fabStyle={styles.fab}
Dreyser Eguia
  • 428
  • 4
  • 12