Windows Phone 7 Project

Posted by on

I started new CodePlex project for controls for Windows Phone 7.  One control I needed for my next application is calendar control.  I could not find one, so I started thinking about one a little while ago.  Today I published an alpha version of calendar control.  You can find it here http://wpcontrols.codeplex.com/.

Calendar control supports the following features in the initial release:

  • Next/Previous month buttons
  • Ability to provide converters to color day number or date cell background
  • Ability to select a date and apply background color
  • Data binding to SelectedDate

Calendar also supports the following events

  • MonthChanging is fired before calendar is rebuilt for the next month. Can be used to setup data for converters
  • MonthChanged is fired after calendar is rebuilt for new month/year
  • SelectionChanged is fired when a user selects a date

As part of download, you are provided with a working sample that shows how to do converters and calendar control without converters.

Here is the markup you can use in both cases:
Sample calendar control: 

xmlns:wpControls="clr-namespace:WPControls;assembly=WPControls"
<wpControls:Calendar x:Name="Cal"/>

 

 


Using converters:

    <phone:PhoneApplicationPage.Resources>

        <local:BackgroundConverter x:Key="BackgroundConverter"/>

        <local:DayNumberConverter x:Key="DayNumberConverter"/>

    </phone:PhoneApplicationPage.Resources>

<wpControls:Calendar 
     x:Name="Cal"

    BackgroundConverter="{StaticResource BackgroundConverter}"

    ForegroundConverter="{StaticResource DayNumberConverter}"

    MonthChanged="Cal_MonthChanged"

    MonthChanging="Cal_MonthChanging"

    SelectionChanged="Cal_SelectionChanged"

    />

Converter simply have to implement a simple interface with one method:

image

Of course, instead of hard-coded date you can drive them based off your data on the phone.  On a second note, if you need a simple, easy to use, yet powerful database for your Windows Phone 7 application, check out my other project on CodePlex: http://winphone7db.codeplex.com/

Here is what the control looks like on the phone:

CalendarControl.png

60 Comments

  3. If you check out the sample project that is part of download, you will see an example. You have to create a converter. There is a also another post that I wrote as an update to calendar that shows how to do it. Please let me know if it is still not clear.
    Thanks.
    Sergey

    Reply to this comment

  6. Hi Sergey,

    How can I change the color date cell background after the launching of the program? I request a duration and a start time in my application and I want to change the color from the start date until the end of the term. I tested a lot of things but I have no solutions. May be a little help on that thing?

    Thanks.

    Reply to this comment

  7. Once your parameters are established and your converter knows about them (I assume you are using IDateToBrushConverter), just call Refresh on the calendar or simply set DataSource to null and back to the original value.
    Thanks.

    Reply to this comment

  15. Hi Sergey,

    how can i implement this to my own application? I added the WPControls.dll as reference and the calendar was shown in the page but the calendar doesn’t indicate the current date and the static dates like from the example app. Can you please help me. Thanks

    Reply to this comment

  16. @The sample app has color converter in it, which is responsible for coloring certain dates. You can write your own, just take a look at the sample app code, you will see it.
    Seriously though, I am a big fan of SpongeBob 🙂

    Reply to this comment

  19. You do not really need to disable that, just do not respond to events. To change colors you can use ColorConverter (see included demo projects in the download). You can also just re-style the calendar and the calendar item controls.

    Reply to this comment

  23. HI,
    I am trying to use this calendar control in Windows 8 Metro Style App.
    But a problem i am facing is height of CalendarItem.
    Is there any way to resize CalendarItem height according to Calendar’s height?

    Reply to this comment

  24. I have not tried this. You would need to edit the template, likely for both calendar and calendar items. I am kind of surprised this worked at all. I am planning to at some point convert the project to be usable in Metro, just have not had time to do that yet.

    Reply to this comment

  28. Hi, thanks for your work!
    i’m working on a pill-reminder and i need to convert the background color of some dates according to a different paramater than isSelected, is it possible?

    thanks
    Lorenzo

    Reply to this comment

  30. Hello Sergey,
    thanks for the quick reply! 🙂
    i’m not sure i understood your answer…
    here’s how my application should work:
    as soon as the user click on the reminder, the date is used as a key to a dictionary (myDictionary).
    the converter should then check if the date displayed in the calender is a key to de dictionary and a switch case on the enum should set the backround color.

    i don’t know how to do the check against the dictionary key in the converter.
    i’d like to do a thing like this:

    public class ColorConverter : IDateToBrushConverter
    {

    public Brush Convert(DateTime dateTime, bool isSelected, Brush defaultValue, BrushType brushType)
    {

    if (brushType == BrushType.Background)
    {
    //here’s where i want to check the date of the calendar against the dictionary key
    if (myDictionary.containsKey(dateTime.Date))
    {
    var value = myDictionary.tryGetValue(dateTime.Date);
    switch (value)
    case (case1)
    return new SolidColorBrush(Colors.Red);
    break;
    case (case2)
    return new SolidColorBrush(Colors.Green);
    break;
    default
    return new SolidColorBrush(Colors.Yellow);
    break;
    }
    else
    {
    return defaultValue;
    }
    }
    else
    {
    if (dateTime == new DateTime(DateTime.Today.Year, DateTime.Today.Month, 6))
    {
    return new SolidColorBrush(Colors.Red);
    }
    else
    {
    return defaultValue;
    }
    }

    }
    }

    Thanks a lot!

    Reply to this comment

  32. First, many thanks for sharing this control to us.
    I am new to windows phone development, I have question here.
    I need to highlight a list of selected date instead the one in the example. Could you please tell what is the easiest way to bind it to the control.
    Thanks!

    Reply to this comment

    • There is currently no way to multi-select dates. However, you can build your UI to select them one at a time. Then, you can write a color converter that would look into your data based on the date passed in and return highlight color.
      Thanks.

      Reply to this comment

  34. What do i want to do, i implemented another button in your Calendar control – Today. If user presses the button calendar automaticaly opens

    Cal.SelectedDate = DateTime.Now.Date;
    Cal.SelectedMonth = DateTime.Now.Month;
    Cal.SelectedYear = DateTime.Now.Year;

    It works if user is on NOT current month, but if i am at September for example, and today is 5th and i pressed 10th and then pressed button “Today” it doesn’t highlight today’s date

    Reply to this comment

    • I set Thread.CurrentThread.CurrentCultere to LV and RU the calendar has changed it Mounths and Week days into needed culture – but WeekBegginingDay – remains the same. In Russia and Latvia week starts from monday… I need to change this…

      Reply to this comment

  39. @Foma
    I am guessing I was just thinking US when I wrote it. I did add some resources down the road to let you change the text in the calendar, but never put in a formal option to set first day of the week. I will try to add this to my to-do list, but likely is not going to happen until mid – September at the earliest. If you would like to develop it and email me the changes, I can try to put it in faster….
    Thanks.

    Reply to this comment

  46. @Sergey, What u posted was regarding particular week days. But in my project the dates which I will be getting from my database is dynamic, it may be on any days of the year. So please give me some example related to dynamic dates.

    Reply to this comment

    • @Sergey, I got ur update in stackoverflow. Thanx for responding…

      One simple question please I want to know:
      Whether I can change the border color of the calendar Days of wpControls?. Now I can change the Foreground Color of calendar Days.

      Because right now border color is white.
      Thanx.

      Reply to this comment

  50. You can always create your own style with your own template and customize it as much as you want. Just copy the templates included in the download on CodePlex in the source code download and change them as you want.

    Reply to this comment

Leave a Reply

Your email address will not be published. Required fields are marked *