How to format a DayTemplateSelector DataTemplate Properly

2 posts, 0 answers
  1. Rodney Lane
    Rodney Lane avatar
    6 posts
    Member since:
    Sep 2009

    Posted 04 Aug 2013 Link to this post


    I am attempting to display the day button differently in a calendar using a the DayTemplateSelector.

    I managed to get it working - but am having difficulties in getting the template to display the way I want it too.

    I have attached an upload image of how it is appearing - what I want it to do is display the background border as a blue box that is the same size as the day button - not just the size of the text inside the day button.

    Can someone offer some advise as to what I need to do this.

    The DataTemplate used is listed below

    I know it must be something simple like a property that I have not set to make the dataTemplate take up the full interior size of the calendar button instead of just the size of the text. Please refer to the uploaded image to see what I mean. The blue backgrounds are only the size of the text instead of the full size of the button.

    Edit: PS - I know I can do this with a StyleSelector - But I actually want to add other stuff within the day button once I have this sorted so I need to use a TemplateSelector.




    <local:DayTemplateSelector x:Key="DayTemplateSelector">
                <Grid HorizontalAlignment="Stretch"
                      VerticalAlignment="Stretch" >
                    <Border Background="CadetBlue"
                            CornerRadius="{StaticResource SplitButton_SpanCornerRadius}"
                            Margin="{StaticResource CalendarButtonButtonChromeMargin}" >
                        <TextBlock Text="{Binding Text}" />
  2. Rodney Lane
    Rodney Lane avatar
    6 posts
    Member since:
    Sep 2009

    Posted 04 Aug 2013 Link to this post

    HI all

    Figured it out - I needed to update the DayButtonStyle to a custom one and set the HorizontalContentAlignment and VerticalContentAlignment both to Stretch in that Style.

    I then assigned the style to the calendar control and away it went.



    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    <Setter Property="VerticalContentAlignment" Value="Stretch"/>
  3. DevCraft R3 2016 release webinar banner
Back to Top