87 lines
2.1 KiB
JavaScript
87 lines
2.1 KiB
JavaScript
import React from "react";
|
|
import {
|
|
StyleSheet,
|
|
Text,
|
|
View,
|
|
TouchableOpacity,
|
|
ScrollView,
|
|
} from "react-native";
|
|
import SetupView from '../components/SetupView';
|
|
import MaterialIcon from "react-native-vector-icons/MaterialCommunityIcons";
|
|
|
|
|
|
function WifiListElement(props) {
|
|
let iconName = "wifi-strength-" + props.strength;
|
|
if(props.lock) {
|
|
iconName += "-lock";
|
|
}
|
|
|
|
return (
|
|
<TouchableOpacity>
|
|
<View style={wifiListElementStyles.container}>
|
|
<MaterialIcon style={wifiListElementStyles.icon} name={iconName}></MaterialIcon>
|
|
<Text style={wifiListElementStyles.text} >{props.text}</Text>
|
|
</View>
|
|
</TouchableOpacity>
|
|
)
|
|
}
|
|
const wifiListElementStyles = {
|
|
container: {
|
|
backgroundColor: "rgba(255,255,255,0.4)",
|
|
borderRadius: 5,
|
|
width: "100%",
|
|
height: 50,
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
marginTop: 8,
|
|
marginBottom: 8,
|
|
},
|
|
icon: {
|
|
fontSize: 25,
|
|
color: "rgba(255,255,255,1)",
|
|
marginLeft: 15,
|
|
marginRight: 15,
|
|
},
|
|
text: {
|
|
color: "rgba(255,255,255,1)",
|
|
fontSize: 18,
|
|
width: "100%"
|
|
}
|
|
};
|
|
|
|
// ---------------------------------------------------------------------------------------------
|
|
|
|
|
|
function WifiSelectionView(props) {
|
|
|
|
return (
|
|
<SetupView
|
|
headerText="WiFi Connection"
|
|
lowerLeftButtonText="My WiFi wasn't found"
|
|
lowerRightButtonText="Need help?"
|
|
>
|
|
<View style={styles.listContainer}>
|
|
<ScrollView>
|
|
<WifiListElement text="WLAN" strength="4" lock={true}></WifiListElement>
|
|
<WifiListElement text="GastWLAN" strength="2" lock={false}></WifiListElement>
|
|
|
|
<WifiListElement text="WLAN" strength="4"></WifiListElement>
|
|
<WifiListElement text="GastWLAN" strength="2"></WifiListElement>
|
|
|
|
<WifiListElement text="WLAN" strength="4"></WifiListElement>
|
|
<WifiListElement text="GastWLAN" strength="2"></WifiListElement>
|
|
</ScrollView>
|
|
|
|
</View>
|
|
</SetupView>
|
|
)
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
listContainer: {
|
|
height: "75%",
|
|
//backgroundColor: "red",
|
|
}
|
|
});
|
|
|
|
export default WifiSelectionView; |