基本上我使用的是 React Native 日历,我面临着日历高度问题。
当我在大屏幕尺寸(例如处于纵向模式的平板电脑)上使用我的应用程序时,日历在父视图中看起来很好,但是当我在手机等小型设备上运行相同的应用程序时,我只能看到 3 行日历。
过去三天我一直在尝试一切,但没有任何效果对我来说。
<View style={{ width: wd * 0.87, flex: 0.50 }}>
<View style={{ flex: 0.15, justifyContent: 'center' }}>
<Text style={{ fontWeight: 'bold', color: '#000000', fontSize: moderateScale(17) }}>Select Date</Text>
</View>
<View style={{ backgroundColor: '#EBF3FF', borderRadius: moderateScale(20), overflow: 'hidden',flex:0.85 }}>
<Calendar
// dayLabelsWrapperStyle={{ paddingHorizontal: 50 }}
showSixWeeks={true}
showWeekNumbers={false}
onDayPress={(day) => {
setSelected(day.dateString);
}}
markedDates={{
[selected]: { selected: true, disableTouchEvent: true, selectedDotColor: 'orange' },
}}
style={{ }}
theme={{
calendarBackground: 'transparent',
arrowColor: '#848A95',
selectedDayTextColor: '#ffffff',
selectedDayBackgroundColor: '#94ADFD',
textMonthFontSize:moderateScale(14),
dayTextColor:'green',
textDayFontSize:moderateScale(12),
// textDayHeaderFontSize:moderateScale(269),
textDayHeaderFontWeight: 'bold',
'stylesheet.calendar.header': {
dayHeader: {
color: 'black',
},
},
}}
/>
</View>
</View>
试试这个: