Navigate back to the homepage

How to check android version in react native?

Infinitbility
React Native
January 15th, 2022 · 1 min read
keep affilitate

Hello Friends 👋,

Welcome to Infinitbility.

React native have multiple packages to get android version like Platform and react-native-device-info.

Today, we will see how we can get an android version in react native.

When you want to only the android version like tutorial topic then the Platform package is best for you.

Platform package provides constant and Release one of them it will return device android version.

Check the following example.

1import React from "react";
2import { View, Text, StyleSheet, Platform } from "react-native";
3
4const App = () => {
5 return (
6 <View style={styles.center}>
7 <Text>{Platform.constants.Release}</Text>
8 </View>
9 );
10};
11
12const styles = StyleSheet.create({
13 center: {
14 flex: 1,
15 justifyContent: "center",
16 alignItems: "center",
17 textAlign: "center",
18 },
19});
20
21export default App;

Output

React Native, Platform, realease, Example

React native device info getSystemVersion example

React native device info help you to get the device system version and it’s also supported in ios devices, if you are planning to get both types of device version then it’s recommended way to get ios and android version.

Installation

  • Go to your project directory and install react-native-device-info package using npm.
1npm install --save react-native-device-info
  • Link react-native-device-info package if your react native version less then 0.63.
1npx react-native link react-native-device-info

Syntax

1let systemVersion = DeviceInfo.getSystemVersion();
2// iOS: "11.0"
3// Android: "7.1.1"
4// Windows: ?

Example

In Below Example, we will getSystemVersion() value on constant and show in application.

React Native Device Info isTablet example

1import React, { Component } from 'react';
2import {
3 StyleSheet,
4 View,
5 Text,
6 SafeAreaView,
7} from 'react-native';
8import DeviceInfo from 'react-native-device-info';
9
10
11class App extends Component {
12
13 render() {
14 let systemVersion = DeviceInfo.getSystemVersion();
15 console.log("systemVersion", systemVersion);
16 return (
17 <SafeAreaView style={{ flex: 1 }}>
18 <View style={styles.container}>
19 <Text>Application open in device version</Text>
20 <Text>{`${systemVersion}`}</Text>
21 </View>
22 </SafeAreaView>
23 );
24 }
25}
26
27const styles = StyleSheet.create({
28 container: {
29 flex: 1,
30 alignItems: 'center',
31 marginTop: 20,
32 backgroundColor: '#ffffff',
33 },
34});
35
36export default App;

Thanks for Reading…

Follow me on Twitter

Join our email list and get notified about new content

No worries, I respect your privacy and I will never abuse your email.

Every week, on Tuesday, you will receive a list of free tutorials I made during the week (I write one every day) and news on other training products I create.

melio affilitate

Looking For React Native Tutorial?

we are trying to create the best Tutorial for react native developers.

When you want a daily updates about React Native Tutorial or infinitbility update subscribe to our newsletter.

Read React Native Tutorial

Request New Tutorial or Article on mail [email protected]

Guide book

Guidebook: The Javascript Monorepo Photoshop Guide

Tutorials

Categories

More articles from Infinitbility

How to remove item from json object in javascript?

Javascript, Delete element from object example.

January 14th, 2022 · 1 min read

react-native-otp-input detox example

React Native, detox guide to test react-native-otp-input example

January 13th, 2022 · 1 min read
© 2020–2022 Infinitbility
About
Link to $https://medium.com/infinitbilityLink to $https://www.facebook.com/InfinitbilityLink to $https://github.com/infinitbilityLink to $https://twitter.com/infinitbilityLink to $https://www.buymeacoffee.com/infinitbilityLink to $mailto:[email protected]