CODEWITHSUNDEEP
wpfdatepicker
neeebzz
neeebzz

Reputation: 11538

DatePicker style cutting off

I have applied the following style to the CalendarStyle property of DatePicker:

    <Style x:Key="myStyle" TargetType="Calendar" >
        <Setter Property="Height" Value="Auto" />
        <Setter Property="Width" Value="Auto" />
        <Setter Property="RenderTransform">
            <Setter.Value>
                <TransformGroup>
                    <ScaleTransform ScaleX="1.5" ScaleY="1.5"/>
                    </TransformGroup>
                    </Setter.Value>
                    </Setter>
    </Style>

but the calendar which opens up is cut-off from the right. Any ideas why?

Upvotes: 0

Views: 2454

Answers (3)

Sawyer
Sawyer

Reputation: 21

Try this:

<Style x:Key="myStyle" TargetType="Calendar" >
    <Setter Property="Height" Value="Auto" />
    <Setter Property="Width" Value="Auto" />
    <Setter Property="LayoutTransform">
        <Setter.Value>
            <TransformGroup>
                <ScaleTransform ScaleX="1.5" ScaleY="1.5"/>
            </TransformGroup>
        </Setter.Value>
    </Setter>
</Style>

Upvotes: 2

Tarun
Tarun

Reputation: 26

I was able to successfully re-size the calendar in the DatePicker by modifying the Template of Calendar and wrapping it inside a ViewBox. With that, the Calendar will pick up the size provided by the ViewBox. I have provided the solution in my blog entry here: Re-sizing Calendar in DatePicker

Hope it helped. :)

Upvotes: 1

Ken Wayne VanderLinde
Ken Wayne VanderLinde

Reputation: 19339

I am going to strike a guess at this, but I'm not entirely sure.

My guess is that the Calendar is contained in a Grid or a Canvas, or some other container, and naturally fills the container or is simply very close in size. When you apply the RenderTransform which scales the Calendar by 1.5, the container is still the same size, but the Calendar is now 1.5 times bigger, and therefore exceeds the size of the container.

Proposed solution:

  1. transform the container as well; or
  2. change your settings so that the Calendar simply fills container without a RenderTransform; or
  3. you could also place the Calendar inside of a ScrollView so that the Calendar can be as big as it wants - you can always scroll to see the part you need.

Upvotes: 1

Related Questions