How to open app settings page in react native android?

Question

At the end react native bridge is the only way.But is there any npm package which has been worked successfully for anyone?

Answer 1

You can open your app settings by using Linking library.

import {Linking} from 'react-native';

Linking.openSettings();

Offical document: https://reactnative.dev/docs/linking#opensettings

Answer 2

You can use @react-native-community/react-native-permissions library.

Here offical documantation: https://github.com/react-native-community/react-native-permissions#opensettings

Example:

import { openSettings } from 'react-native-permissions';
openSettings();

Answer 3

combining the existing answers: this works for me for both iOS and Android (without expo)

import { Linking, Platform } from 'react-native';


const handleOpenSettings = () => {
    if (Platform.OS === 'ios') {
      Linking.openURL('app-settings:');
    } else {
      Linking.openSettings();
    }
};

// add a button that calls handleOpenSetttings()

Answer 4

Linking API from react-native core provides the function to send custom intent action to Android.

NOTE - You can send any custom action that is acceptable by android, moreover you can also pass data to the intent.

You can find more keys at developer.android.com/reference/android/provider/Settings.

Here is an example to open settings :

import {Linking} from 'react-native';

// To open settings
Linking.sendIntent('android.settings.SETTINGS');

// To open GPS Location setting
Linking.sendIntent('android.settings.LOCATION_SOURCE_SETTINGS');

Hope this will help you or somebody else. Thanks!

Happy Coding :-)

Answer 5

Use

IntentLauncher.startActivity({
  action: 'android.settings.SETTINGS',
})

instead of

IntentLauncher.startActivity({
  action: 'android.settings.APPLICATION_DETAILS_SETTINGS',
  data: 'package:' + pkg
})

Like

import IntentLauncher, { IntentConstant } from 'react-native-intent-launcher'
const openAppSettings = () => {
  if (Platform.OS === 'ios') {
    Linking.openURL('app-settings:')
  } else {
    IntentLauncher.startActivity({
      action: 'android.settings.SETTINGS',
    })
  }
}

ANDROID

Wifi

IntentLauncher.startActivity({
 action: 'android.settings.SETTINGS'
})

GPS

IntentLauncher.startActivity({
 action: 'android.settings.LOCATION_SOURCE_SETTINGS'
})

IOS

WIFI

Linking.openURL("App-Prefs:root=WIFI");

GPS

Linking.openURL('App-Prefs:Privacy&path=LOCATION')

Answer 6

This is a complete answer for both android & iOS.

Without Expo:

import DeviceInfo from 'react-native-device-info';
import IntentLauncher, { IntentConstant } from 'react-native-intent-launcher'
const pkg = DeviceInfo.getBundleId();
const openAppSettings = () => {
  if (Platform.OS === 'ios') {
    Linking.openURL('app-settings:')
  } else {
    IntentLauncher.startActivity({
      action: 'android.settings.APPLICATION_DETAILS_SETTINGS',
      data: 'package:' + pkg
    })
  }
}

With Expo:

import Constants from 'expo-constants'
import * as IntentLauncher from 'expo-intent-launcher'
const pkg = Constants.manifest.releaseChannel
? Constants.manifest.android.package 
: 'host.exp.exponent'
const openAppSettings = () => {
  if (Platform.OS === 'ios') {
    Linking.openURL('app-settings:')
  } else {
    IntentLauncher.startActivityAsync(
      IntentLauncher.ACTION_APPLICATION_DETAILS_SETTINGS,
      { data: 'package:' + pkg },
    )
  }
}

Answer 7

import React, { useCallback } from "react";
import { Button, Linking, StyleSheet, View } from "react-native";

const OpenSettingsButton = ({ children }) => {
  const handlePress = useCallback(async () => {
    // Open the custom settings if the app has one
    await Linking.openSettings();
  }, []);

  return <Button title={children} onPress={handlePress} />;
};

const App = () => {
  return (
    <View style={styles.container}>
      <OpenSettingsButton>Open Settings</OpenSettingsButton>
    </View>
  );
};

const styles = StyleSheet.create({
  container: { flex: 1, justifyContent: "center", alignItems: "center" },
});

Answer 8

  import { Linking, Platform } from 'react-native';

   

    const openSettingsAlert = () =>
            Alert.alert('Please provide the require permission from settings', '', [
              {
                text: 'Cancel',
                onPress: () => console.log('Cancel Pressed'),
                style: 'cancel',
              },
              { text: 'Go To Settings', onPress: () => openSettings() },
            ]);



  

    const openSettings = () => {
        if (Platform.OS === 'ios') {
          Linking.openURL('app-settings:');
        } else {
          Linking.openSettings();
        }
      };




    let isStoragePermitted = await requestExternalWritePermission();
            if (isStoragePermitted === true) {
              
            }else{
              console.log('permission not granted');
              openSettingsAlert();
            }







    const requestExternalWritePermission = async () => {
        if (Platform.OS === 'android') {
          try {
            const granted = await PermissionsAndroid.request(
              PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
            );
            // If WRITE_EXTERNAL_STORAGE Permission is granted
            return granted === PermissionsAndroid.RESULTS.GRANTED;
          } catch (err) {
            console.warn(err);
            alert('Storage Access permission error:', err);
          }
          return false;
        }
      };