Setting.js 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
  1. import React, { Component } from "react"
  2. import { StyleSheet, View, Text } from "react-native"
  3. import { unitWidth, unitHeight } from "../utils/AdapterUtil";
  4. import RNPickerSelect from 'react-native-picker-select';
  5. import AntDesign from "react-native-vector-icons/AntDesign"
  6. import MyButtom from '../component/MyButton'
  7. export default class Setting extends Component {
  8. render() {
  9. return (
  10. <View style={styles.container}>
  11. <View style={styles.formArea}>
  12. <View style={styles.formItem}>
  13. <RNPickerSelect
  14. placeholder={""}
  15. onValueChange={(value) => console.log(value)}
  16. items={[
  17. { label: 'Football', value: 'football' },
  18. { label: 'Baseball', value: 'baseball' },
  19. { label: 'Hockey', value: 'hockey' },
  20. ]}
  21. >
  22. <View style={styles.itemArea}>
  23. <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>我的资料</Text>
  24. <AntDesign
  25. name={"right"}
  26. size={20}
  27. style={{ color: "#999999" }}
  28. />
  29. </View>
  30. </RNPickerSelect>
  31. </View>
  32. <View style={styles.formItem}>
  33. <RNPickerSelect
  34. placeholder={""}
  35. onValueChange={(value) => console.log(value)}
  36. items={[
  37. { label: 'Football', value: 'football' },
  38. { label: 'Baseball', value: 'baseball' },
  39. { label: 'Hockey', value: 'hockey' },
  40. ]}
  41. >
  42. <View style={styles.itemArea}>
  43. <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>用户反馈</Text>
  44. <AntDesign
  45. name={"right"}
  46. size={20}
  47. style={{ color: "#999999" }}
  48. />
  49. </View>
  50. </RNPickerSelect>
  51. </View>
  52. <View style={styles.formItem}>
  53. <RNPickerSelect
  54. placeholder={""}
  55. onValueChange={(value) => console.log(value)}
  56. items={[
  57. { label: 'Football', value: 'football' },
  58. { label: 'Baseball', value: 'baseball' },
  59. { label: 'Hockey', value: 'hockey' },
  60. ]}
  61. >
  62. <View style={styles.itemArea}>
  63. <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>用户及隐私协议</Text>
  64. <AntDesign
  65. name={"right"}
  66. size={20}
  67. style={{ color: "#999999" }}
  68. />
  69. </View>
  70. </RNPickerSelect>
  71. </View>
  72. <View style={styles.formItem}>
  73. <RNPickerSelect
  74. placeholder={""}
  75. onValueChange={(value) => console.log(value)}
  76. items={[
  77. { label: 'Football', value: 'football' },
  78. { label: 'Baseball', value: 'baseball' },
  79. { label: 'Hockey', value: 'hockey' },
  80. ]}
  81. >
  82. <View style={styles.itemArea}>
  83. <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>清除缓存</Text>
  84. <AntDesign
  85. name={"right"}
  86. size={20}
  87. style={{ color: "#999999" }}
  88. />
  89. </View>
  90. </RNPickerSelect>
  91. </View>
  92. </View>
  93. <View style={styles.bottomBtn}>
  94. <MyButtom
  95. text={"退出登录"}
  96. width={unitWidth * 502}
  97. height={unitHeight * 84}
  98. borderRadius={unitHeight * 84}
  99. bgColor="#FA788A"
  100. shadowBgc="rgba(250,120,138,1)"
  101. style={{ fontSize: unitWidth * 32 }}
  102. />
  103. </View>
  104. </View>
  105. )
  106. }
  107. }
  108. const styles = StyleSheet.create({
  109. container: {
  110. flex: 1,
  111. alignItems: "center"
  112. },
  113. formArea: {
  114. width: "100%"
  115. },
  116. formItem: {
  117. width: "100%",
  118. height: unitHeight * 97,
  119. backgroundColor: "#fff",
  120. marginBottom: unitHeight * 6,
  121. },
  122. itemArea: {
  123. width: "100%",
  124. height: "100%",
  125. flexDirection: "row",
  126. justifyContent: "space-between",
  127. alignItems: "center",
  128. paddingLeft: unitWidth * 23,
  129. paddingRight: unitWidth * 24,
  130. borderBottomColor: "#F9F9F9",
  131. borderBottomWidth: 1
  132. },
  133. bottomBtn: {
  134. width: "100%",
  135. marginTop: unitHeight * 196,
  136. height: unitHeight * 84,
  137. justifyContent: 'center',
  138. alignItems: 'center'
  139. },
  140. })