浏览代码

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 3 年前
父节点
当前提交
9cca722510
共有 1 个文件被更改,包括 12 次插入3 次删除
  1. 12
    3
      screens/main/Home_page.js

+ 12
- 3
screens/main/Home_page.js 查看文件

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