68 lines
		
	
	
		
			2.0 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
		
		
			
		
	
	
			68 lines
		
	
	
		
			2.0 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
|  | import React, {Component} from 'react'; | ||
|  | import { | ||
|  |     Platform, StyleSheet, Text, | ||
|  |     TouchableWithoutFeedback, View, TextInput, | ||
|  |     Animated, Dimensions, Image, PermissionsAndroid, | ||
|  |     AsyncStorage, | ||
|  |     StatusBar, TouchableNativeFeedback, TouchableOpacity,BackHandler,Alert,ProgressBarAndroid | ||
|  |     , FlatList | ||
|  | } from 'react-native'; | ||
|  | import Icon from 'react-native-vector-icons/MaterialIcons'; | ||
|  | const theme=require('./../../utils/theme.json'); | ||
|  | import I18n from 'react-native-i18n' | ||
|  | 
 | ||
|  | import {Title,Subheading,Button} from 'react-native-paper' | ||
|  | var SnapSlider = require('react-native-snap-slider'); | ||
|  | export default class Networks extends Component{ | ||
|  |     static navigationOptions = ({navigation})=>{ | ||
|  |         return{ drawerLabel: () => null, | ||
|  |          title:"Filtre", | ||
|  |          tabBarIcon:({focused,horizontal,tintColor})=>{ | ||
|  |             return (<Icon | ||
|  |                 badgeCount={navigation.getParam("count",0)} | ||
|  |                 size={24} | ||
|  |                 name={"filter-list"} | ||
|  |                 color={tintColor} | ||
|  |             />) | ||
|  |           }, | ||
|  |      }}; | ||
|  | 
 | ||
|  |     constructor(props) { | ||
|  |         super(props); | ||
|  |         this.state = { | ||
|  |             valuePosition:0 | ||
|  |         } | ||
|  |         this.mounted = false; | ||
|  |         this.filterOptions = [ | ||
|  |             {value: 5, label: "5 km"}, | ||
|  |             {value: 15, label: "15 km"}, | ||
|  |             {value: 20, label: "20 km"}, | ||
|  |             {value: 25, label: "25 km"} | ||
|  |         ]; | ||
|  |     } | ||
|  |     geInitialState(){ | ||
|  |         return { | ||
|  |             valuePosition:0 | ||
|  |         } | ||
|  |     } | ||
|  |     render(){ | ||
|  |         return (<View style={{flex:1}}> | ||
|  |           <SnapSlider | ||
|  |         items={this.filterOptions} | ||
|  |         defaultItem={this.state.valuePosition} | ||
|  |         labelPosition="bottom" | ||
|  |         onSlidingComplete={(item) => this.slidingComplete(item)} | ||
|  |     /> | ||
|  |     <Text> | ||
|  |         <Text style={{fontWeight: "bold"}}> | ||
|  |             {(this.state.value === undefined ? 0 : this.state.value)}</Text> km {I18n.t("DISTANCE_ARROUND")}</Text> | ||
|  |    </View>) | ||
|  |     } | ||
|  | 
 | ||
|  |     slidingComplete(itemSelected) { | ||
|  |         this.setState({value: this.filterOptions[itemSelected].value, valuePosition: itemSelected}); | ||
|  | 
 | ||
|  |     } | ||
|  | 
 | ||
|  | 
 | ||
|  | } |