Home > front end >  How to bind width and height of a drawer element to the window size?
How to bind width and height of a drawer element to the window size?

Time:04-08

I'm using Material Design elements. I need to specify the width and height for materialDesign:DrawerHost element. I want it to cover all the window. The code is:

<Grid Grid.RowSpan="3">
    <materialDesign:DrawerHost x:Name="DrawerHost" Grid.RowSpan="3"
        Margin="32"
        HorizontalAlignment="Center"
        VerticalAlignment="Center"
        Width="auto"
        Height="auto"
        BorderThickness="2"
        BorderBrush="{DynamicResource MaterialDesignDivider}"
        BottomDrawerCornerRadius="20 20 0 0"
        BottomDrawerBackground="{DynamicResource SecondaryHueLightBrush}">
    </materialDesign:DrawerHost>
</Grid>

I tried to use Height="auto" and Width="auto" but it does not have any effect. How can I fix it in my code?

CodePudding user response:

You can bind to Windows's ActualWidth and ActualHeight. auto will often cause minimal size just to fit the content, not expanding to the containter. and even if auto works as expanding, the grid size is also minimal by default. So you'd rather bind directly to Window.

  • Related