Explorar el Código

Ahora se renderizan los flatlist en el celular. Necesitaba tener dimensiones explicitas. Se las puse como un atributo dentro del tag de flatlist, immediatamente despues de abrit el tag.

ErnestoOrtiz2 hace 2 años
padre
commit
9cca722510
Se han modificado 1 ficheros con 12 adiciones y 3 borrados
  1. 12
    3
      screens/main/Home_page.js

+ 12
- 3
screens/main/Home_page.js Ver fichero

@@ -1,5 +1,5 @@
1 1
 import React, {useState, useEffect, useRef} from 'react'
2
-import { Button, Text, View, StyleSheet, SafeAreaView} from 'react-native'
2
+import { Button, Text, View, StyleSheet, Dimensions} from 'react-native'
3 3
 import {FlatList, ListViewBase } from 'react-native'
4 4
 import {TouchableOpacity} from 'react-native-gesture-handler'
5 5
 import {List, Divider} from 'react-native-paper'
@@ -132,10 +132,16 @@ export function Home_page({navigation}) {
132 132
          //});
133 133
   }
134 134
 
135
+  const dimensions = Dimensions.get('window');
136
+  const screenWidth = dimensions.width;
137
+
135 138
   
136 139
   return (
137 140
       <ImageBackground style={styles.stdcontainer} source={require('../../assets/yellow-white.jpg')}>
138
-        <FlatList
141
+        <FlatList style={{
142
+             flex: 1,
143
+             width: screenWidth,
144
+         }}
139 145
           data={threads}
140 146
           keyExtractor = {item => item._id}
141 147
           ItemSeparatorComponent={() => <Divider />}
@@ -153,7 +159,10 @@ export function Home_page({navigation}) {
153 159
           </TouchableOpacity>
154 160
         )}
155 161
         />
156
-        <FlatList
162
+        <FlatList style={{
163
+             flex: 1,
164
+             width: screenWidth,
165
+         }}
157 166
           data={appointments}
158 167
           keyExtractor = {item => item._id}
159 168
           ItemSeparatorComponent={() => <Divider />}