Hello everyone, unfortunately I am very inexperienced and don't know what I am doing wrong.
I wanted to try the ExpandableCalendarScreen example. The Calendar is displayed but not the AgendaItems.
import React, {useRef, useCallback} from 'react';
import {StyleSheet} from 'react-native';
import {ExpandableCalendar, AgendaList, CalendarProvider, WeekCalendar} from 'react-native-calendars';
import testIDs from '../mocks/testIDs';
import {agendaItems, getMarkedDates} from '../mocks/agendaItems';
import AgendaItem from '../mocks/AgendaItem';
import {getTheme, themeColor, lightThemeColor} from '../mocks/theme';
Zlvsky
commented
1 month ago
Hello everyone, unfortunately I am very inexperienced and don't know what I am doing wrong. I wanted to try the ExpandableCalendarScreen example. The Calendar is displayed but not the AgendaItems.
import React, {useRef, useCallback} from 'react'; import {StyleSheet} from 'react-native'; import {ExpandableCalendar, AgendaList, CalendarProvider, WeekCalendar} from 'react-native-calendars'; import testIDs from '../mocks/testIDs'; import {agendaItems, getMarkedDates} from '../mocks/agendaItems'; import AgendaItem from '../mocks/AgendaItem'; import {getTheme, themeColor, lightThemeColor} from '../mocks/theme';
const leftArrowIcon = require('../img/previous.png'); const rightArrowIcon = require('../img/next.png'); const ITEMS: any[] = agendaItems;
interface Props { weekView?: boolean; }
const ExpandableCalendarScreen = (props: Props) => { const {weekView} = props; const marked = useRef(getMarkedDates()); const theme = useRef(getTheme()); const todayBtnTheme = useRef({ todayButtonTextColor: themeColor });
// const onDateChanged = useCallback((date, updateSource) => { // console.log('ExpandableCalendarScreen onDateChanged: ', date, updateSource); // }, []);
// const onMonthChange = useCallback(({dateString}) => { // console.log('ExpandableCalendarScreen onMonthChange: ', dateString); // }, []);
const renderItem = useCallback(({item}: any) => { return;
}, []);
return ( <CalendarProvider date={ITEMS[1]?.title} // onDateChanged={onDateChanged} // onMonthChange={onMonthChange} showTodayButton // disabledOpacity={0.6} theme={todayBtnTheme.current} // todayBottomMargin={16}
export default ExpandableCalendarScreen;
const styles = StyleSheet.create({ calendar: { paddingLeft: 20, paddingRight: 20 }, header: { backgroundColor: 'lightgrey' }, section: { backgroundColor: lightThemeColor, color: 'grey', textTransform: 'capitalize' } });