react-native-device-clock-format

Determine whether the device is set to 12 or 24 hour time.

Add it to your project

1. Run npm install react-native-device-clock-format --save
2. Open your project in XCode, right click on Libraries and click Add Files to "Your Project Name"
3. Add libDeviceClockFormat.a to Build Phases -> Link Binary With Libraries.
4. Whenever you want to use it within React code now you can: var DeviceClockFormat = require('react-native-device-clock-format');

Example

1'use strict';
2
3var React = require('react-native');
4var {
5  AppRegistry,
6  StyleSheet,
7  Text,
8  View,
9  TouchableOpacity,
10} = React;
11
12var DeviceClockFormat = require('react-native-device-clock-format');
13
14var SampleApp = React.createClass({
15  getInitialState() {
16    return { format: 'Unknown..' }
17  },
18
19  componentWillMount() {
20    this.fetchTimeFormat();
21  },
22
23  fetchTimeFormat() {
24    DeviceClockFormat.fetch((twelveHour, twentyFourHour) => {
25      if (twelveHour) {
26        this.setState({format: '12 hour'});
27      } else {
28        this.setState({format: '24 hour'});
29      }
30    });
31  },
32
33  render: function() {
34    return (
35      <View style={styles.container}>
36        <Text style={styles.welcome}>
37          {this.state.format}
38        </Text>
39        <TouchableOpacity onPress={this.fetchTimeFormat}>
40          <Text style={styles.instructions}>
41            Update time format
42          </Text>
43        </TouchableOpacity>
44      </View>
45    );
46  }
47});
48
49var styles = StyleSheet.create({
50  container: {
51    flex: 1,
52    justifyContent: 'center',
53    alignItems: 'center',
54    backgroundColor: '#F5FCFF',
55  },
56  instructions: {
57    textAlign: 'center',
58    color: '#333333',
59    marginBottom: 5,
60  },
61});
62
63AppRegistry.registerComponent('SampleApp', () => SampleApp);