import React ,{ Component } from 'react';
import {  
    StyleSheet,
    View,
    Text,
    Switch,
    Image,
    TouchableOpacity
   } from 'react-native';
import styles from './styles';

class notice extends Component {

  static navigationOptions = ({ navigation }) => ({
    headerLeft: (
      <TouchableOpacity
        style={styles.nav_left_touch_container}
        onPress={() => {
          navigation.goBack();
        }}
      >
        <View style={styles.nav_left_icon_container}>
          <Image
            style={styles.nav_icon}
            source={require('../../images/btn_nv_back.png')}
          />
        </View>
      </TouchableOpacity>
    ),
    headerTitle: 
    <View style={styles.headerTitleContainer}>
    <Text style={styles.headerTitleTxt}>通知</Text>
    </View>
  });

  constructor(props) {
    super(props);
    this.state = {
      isBlocking: false
    };
    this.onChange = this.onChange.bind(this);
  }
  
  onChange(value) { 
    const { isBlocking } = this.state;
    this.setState({ value : !value  });
  }
    render() {
    const {isBlocking} =this.state;
        return(
    <View>
        <View style={styles.subRowContainer} />
        <View style={styles.rowBackground}>

      <View style={styles.rowContainer}>
        <View>
        <Text style={styles.rowText}>提醒通知</Text>
        </View>
        <View style={styles.rowContent}>
        <Switch
          value={!this.state.value}
          onValueChange={isSync => this.onChange(isSync)}
          trackColor={{ false: '#E5E5E5', true: '#339FAF' }}
          style={{ transform: [{ scaleX: 0.8 }, { scaleY: 0.8 }] }}
        />
        </View>
      </View>

      <View style={styles.rowContainer}>
        <View>
        <Text style={styles.rowText}>文章推播</Text>
        </View>
        <View style={styles.rowContent}>
        <Switch
          value={!this.state.value}
          onValueChange={isSync => this.onChange(isSync)}
          trackColor={{ false: '#E5E5E5', true: '#339FAF' }}
          style={{ transform: [{ scaleX: 0.8 }, { scaleY: 0.8 }] }}
        />
        </View>

      </View>
      </View>
    </View>
        )
    }
}

export default notice;