How to get information when the switch is flipped React-Native

Question

I want to get the information whether the switch was switched or not. And import this information in other files. And then I want to make an IF query for StyleSheet.


const DarkLightSwitch = () => {
  const [lock, setLock] = useState();
  return (
          <Text style={styles.Zeit}>Darkmode</Text>
          <View style={styles.container}>
            <Switch
              trackColor={{ false: "#02131C", true: "#02131C" }}
              thumbColor={isEnabled ? "#FEF5E2" : "#FFF"}
              ios_backgroundColor={isEnabled ? "#02131C" : "#FEF5E2"}
              onValueChange={toggleSwitch}
              value={isEnabled}
              disabled={lock ? "false" : "true"}
            />
          </View>
  );
};

the other file:

import { isEnabled } from "../../Einstellungen/Dark-LightSwitch";

const styles = StyleSheet.create({
  container: {
        backgroundColor: isEnabled === "false" ? "#02131C" : "#FEF5E2",
      }
});

I think you can't just import that value from another file and get notified when it changed. You either pass it as `props` when you want to use it in another component or pass the value to your `Redux State`. — PRSHL, Sep 30 '21 at 06:49

score 1 · Answer 1 · answered Sep 30 '21 at 07:21

you cant have dynamic styles in StyleSheet.create

The workaround is this

const styles = StyleSheet.create({
  container: {
        // styles that are not background color
      }
});

<View style={[styles.container, { backgroundColor: isEnabled ? "#02131C" : "#FEF5E2" }]}>

A note that you don't need the === false here either

How to get information when the switch is flipped React-Native

1 Answers1