Hi.
I am using the calendar control on a page in a WP7 app. I have a data template for the calendar which displays some summary text for each date of the month where the user has entered some data for.
Currently I am allowing the user to double tap on a date. This takes the user to a page where they can enter data for the selected date, save and then return back to the calendar page. My problem is that I cannot get the calendar to show the updated entry, UNLESS I scroll to the next or previous calendar month and then scroll back to the current visible calendar month. I know that the data is in the list, however when the user returns to the page I cannot get the DateTextConverter class to get the data for the current month.
I guess basically I do not know how to force the data template binding the calendar to refresh. Is there some way that I can tell the calendar to refresh / requery the data for the current month when the user returns to the calendar page. I have tried doing things like UpdateLayout and instantianting the page again such as below with no luck:
This basically gets the data list again, which I already have anyway but tried it anyway.
CalendarPageViewModel = new CalendarPageViewModel();
DataContext = CalendarPageViewModel;
I noticed when I scroll the calendar, then it always goes back and calls the DateTextConverter class and hence renders the calendar with the updated data. I have some snippets of code below to try and help visualize what I am trying to do.
This gets called when user scrolls the calendar and will get the data that I need. Then when I scroll back to the current month the below gets called again and the current month will render the info, this time including the new entry as well.
public class DateTextConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
DateTime CurrentDate = (DateTime)value;
CalendarSummaryData CalendarSummaryData = CalendarPageViewModel.CalendarSummaryDataList.Where(x => x.Date == CurrentDate.Date).FirstOrDefault();
if (CalendarSummaryData == null) return string.Empty;
return CalendarSummaryData.RatingText;
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
throw new NotImplementedException();
A snippet of the data template looks something like this below, though for the complete view refer to the attached project and look at the CalendarPage.xaml for a detailed overview. I would really appreciate some help on this as I am sure its quite easy, but am missing the point. I have it all working nicely, just want the calendar to render with the latest data when the user returns back to calendar page.
<phone:PhoneApplicationPage.Resources>
<local:DateColorConverter x:Key="DateColorConverter"/>
<local:DateTextConverter x:Key="DateTextConverter"/>
Style TargetType="igPrim:CalendarDayButton" x:Key="BaseCalendarDayStyle">
<Setter Property="HorizontalContentAlignment" Value="Left" />
<Setter Property="VerticalContentAlignment" Value="Bottom" />
<Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
<Setter.Value>
<ControlTemplate TargetType="igPrim:CalendarDayButton">
...
<TextBlock
Margin="5,2,0,0"
FontSize="15"
Text="{Binding Converter={StaticResource DateTextConverter}}"/>
<ContentControl x:Name="DayNumber" IsTabStop="False" Margin="5,0,0,10"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ButtonDataTemplate}"
HorizontalAlignment="Left" VerticalAlignment="Bottom" />
Grid>
ControlTemplate>
Hello Daniel,
Thank you for your post. I have been looking into it and the sample you have provided, but I wasn’t able to run it since you haven’t included the definition of the CalendarPageViewModel class. Despite this I can suggest you implement InotifyPropertyChanged interface in this class, which notifies the clients that a Property value has changed. Here you can read more about this interface:
http://msdn.microsoft.com/en-us/library/system.componentmodel.inotifypropertychanged.aspx
Please let me know if this helps you or if you need further assistance could you please send me a runnable sample where the issue is reproduced, so I can investigate it further for you.
Looking forward for your reply.
I am just checking if you got this worked out or you still require any assistance or clarification on the matter.
Apologies for my late reply. Yes, I am still stuck on the issue and would love some help with it. I have attached my whole app solution in this email and am thinking it might be easier this way if you can simply run the app and see the issue first hand.
Firstly I hope the solution loads and builds and that all the DLL files you need to run it are available. I did test in on another PC (virtual) with Visual studio installed and it worked. The file has been attached via my SkyDrive folder. Sorry link to file from https://skydrive.live.com/?cid=5960affc4d36f97c&id=5960AFFC4D36F97C%2114724&authkey=!AJ4MAmqjGtgOVDE hopefully works.
Here are some steps to follow to reproduce the issue.
1. Run My Day Rated and get into the main page.
2. Add a journal entry (press the ‘add new’ button along the top tool bar on right side).
3. When the journal entry page loads, enter a few details (rating, comment) and press the save button.
4. When journal entry is saved, press the windows back key to get back to main list screen. You should now see the journal entry you added in the list.
5. Now press the ‘calendar summary’ button. When the calendar summary page loads, you will see the entry marked on the calendar that you just entered.
6. Double tap on any date on the calendar. This will take you to the new journal entry page (for the date you pressed on the calendar).
7. Enter a new journal entry and press save.
8. When journal entry is saved, press the windows back key to get back to the calendar summary page.
This is where the problem occurs. I would like to see the newly created journal entry render on the date on the calendar, but it does not. However, if you scroll to either the previous or next month on the calendar and then go back, the entry will be rendered.
I have tried a number of things here to get around the issue, some quite dodgy as well. If you look at the code behind file you will see that I even force the datacontext to refresh and I can actually confirm when I debug the page, that the new entry is in the list. For some reason, I can’t call OnPropertyChanged on the calendar to force it to render again for the current month and therefore show the new entry. Anyway check out OnNavigatedTo to see what I am trying to do when the user gets back to the page.
Some Info:
The calendar values get rendered using the two classes at the bottom DateTextConverter and DateColorConverter
I can’t get the two classes to be called when the user gets back to the page and hence the reason why the new journal entry is not getting rendered. The two classes are getting called each time the date calendar changes, so this is why when you move to previous / next month and back again, the class gets called and the new journal entry gets rendered.
I am not able to work out how to force the two classes to get called again when the page loads again. I guess I basically want to call OnPropertyChanged for the calendar to force it to render the data again.
Apologies if the code is a little messy or hard to follow, I normally do things a little differently. Your help would be greatly appreciated on this. I think if I can get it working, then I can go back to tidying up the code on the CalendarPage.xaml and CalendarPage.cs files and deploy an update.
I have been looking into your sample I and I can say that this behavior is expected since when you press the "Back" button the page did't reload, which means that the Binding is not triggered and this is why the Background is not changed. I can suggest you add these two lines of code in your CAlendarPage's OnNavigateTo method at the end of the try block:
this.myCalendar.DisplayDate = this.myCalendar.DisplayDate.AddDays(36); this.myCalendar.DisplayDate = this.myCalendar.DisplayDate.AddDays(-36);
in order to make the Calendar reloads when you navigate to it. Please let me know if this helps you or you need further assistance on this matter.
Hi Stefan,
Thanks for the quick reply. I have tried your suggestion and it worked, and thankfully it doesn't appear to be adding much overhead to performance. Thanks so much for your help with this, it's been great. To be honest I was hoping I could do it another way like calling property changed, but this is just as good. Just want to tidy up the code now and deploy and update.