This is a migrated thread and some comments may be shown as answers.

How to format a DayTemplateSelector DataTemplate Properly

1 Answer 46 Views
Calendar
This is a migrated thread and some comments may be shown as answers.
Rodney Lane
Top achievements
Rank 1
Rodney Lane asked on 05 Aug 2013, 01:19 AM
Hi

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.

Cheers

Rod.

 

<local:DayTemplateSelector x:Key="DayTemplateSelector">
    <local:DayTemplateSelector.StatewideTemplateSelector>
        <DataTemplate>
            <Grid HorizontalAlignment="Stretch"
                  VerticalAlignment="Stretch" >
                <Border Background="CadetBlue"
                        CornerRadius="{StaticResource SplitButton_SpanCornerRadius}"
                        Margin="{StaticResource CalendarButtonButtonChromeMargin}" >
                    <TextBlock Text="{Binding Text}" />
                </Border>
            </Grid>
 
        </DataTemplate>
    </local:DayTemplateSelector.StatewideTemplateSelector>
</local:DayTemplateSelector>

1 Answer, 1 is accepted

Sort by
0
Rodney Lane
Top achievements
Rank 1
answered on 05 Aug 2013, 04:16 AM
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.

Cheers

Rod.

<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="VerticalContentAlignment" Value="Stretch"/>
Tags
Calendar
Asked by
Rodney Lane
Top achievements
Rank 1
Answers by
Rodney Lane
Top achievements
Rank 1
Share this question
or