MyAbout.js 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. import React, { Component } from 'react';
  2. import { View, Text, Image, Linking, StyleSheet, TouchableOpacity } from 'react-native';
  3. import Icon from 'react-native-vector-icons/Ionicons';
  4. class MyAbout extends Component {
  5. handleClick(url) {
  6. Linking.canOpenURL(url).then(supported => {
  7. if (supported) {
  8. Linking.openURL(url);
  9. } else {
  10. console.log('Don\'t know how to open URI: ', url);
  11. }
  12. });
  13. }
  14. render() {
  15. const casa = require('../../img/casa.png');
  16. const { textColor, viewStyle, iconStyle } = styles;
  17. return (
  18. <View style={{ flex: 1, padding: 20 }}>
  19. <Text style={{ fontSize: 20, alignSelf: 'center', fontWeight: '700' }}>
  20. ESPECIFICOS Buenos Aires
  21. </Text>
  22. <Image
  23. source={casa}
  24. style={{ width: 350, alignSelf: 'center', height: 220 }}
  25. resizeMode='contain'
  26. />
  27. <TouchableOpacity
  28. style={viewStyle}
  29. onPress={() => this.handleClick('geo:-34.60761,-58.437967')}
  30. >
  31. <Icon size={30} style={[textColor, iconStyle]} name='md-pin' />
  32. <Text style={textColor}>
  33. Leopoldo Marechal 914, CABA, Argentina.
  34. </Text>
  35. </TouchableOpacity>
  36. <TouchableOpacity
  37. style={viewStyle}
  38. onPress={() => this.handleClick('tel:+541141396860')}
  39. >
  40. <Icon size={30} style={[textColor, iconStyle]} name='md-call' />
  41. <View>
  42. <Text style={textColor}>
  43. +5411 4139-6860/1
  44. </Text>
  45. <Text style={textColor}>
  46. +5411 4982-2892
  47. </Text>
  48. </View>
  49. </TouchableOpacity>
  50. <View style={viewStyle}>
  51. <Icon size={30 } style={[textColor, iconStyle]} name='md-time' />
  52. <Text style={textColor}>
  53. Abierto Lunes a Viernes 9 a 18 horas.
  54. </Text>
  55. </View>
  56. </View>
  57. );
  58. }
  59. }
  60. const styles = StyleSheet.create({
  61. viewStyle: {
  62. flexDirection: 'row',
  63. alignItems: 'center',
  64. },
  65. iconStyle: {
  66. margin: 5,
  67. marginRight: 10
  68. },
  69. textColor: {
  70. color: '#6281A2'
  71. }
  72. });
  73. export default MyAbout;