如何以编程方式保持 wpf 中对象的纵横比

Question

I programmatically add a Border with a certain width and height to a grid. However, I want to get either one of the following:

1. Make the border keep aspect ratio and fill make it as big as possible inside the grid
2. Make the border scale whenever the grid scales down or up (so not particularily the biggest possible, more like a percentage of the grid)

At the moment this is the situation when I resize my window:

Color borderColor = (Color)ColorConverter.ConvertFromString(BorderColor);
Color backgroundColor = (Color)ColorConverter.ConvertFromString(BackgroundColor);

Border border = new Border();
border.BorderThickness = new Thickness(BorderSize);
border.CornerRadius = new CornerRadius(TopLeftCornerRadius, TopRightCornerRadius, BottomRightCornerRadius, BottomLeftCornerRadius);
border.BorderBrush = (SolidColorBrush)(new BrushConverter().ConvertFrom(BorderColor));
border.Background = (SolidColorBrush)(new BrushConverter().ConvertFrom(BackgroundColor));

border.Width = Width;
border.Height = Height;

border.Margin = new Thickness(10);

previewgrid.Children.Add(border);

The normal situation:

The scaled situation:

So I would like it to resize properly and stay inside the white rectangle. By the way, the white grid has a margin as you can see ;-) Thanks in advance!

Answer 1

As lerthe61 suggested, just use a Viewbox with its Stretch property set to Uniform :

Color borderColor = (Color)ColorConverter.ConvertFromString(BorderColor);
Color backgroundColor = (Color)ColorConverter.ConvertFromString(BackgroundColor);

Border border = new Border();
border.BorderThickness = new Thickness(BorderSize);
border.CornerRadius = new CornerRadius(TopLeftCornerRadius, TopRightCornerRadius, BottomRightCornerRadius, BottomLeftCornerRadius);
border.BorderBrush = (SolidColorBrush)(new BrushConverter().ConvertFrom(BorderColor));
border.Background = (SolidColorBrush)(new BrushConverter().ConvertFrom(BackgroundColor));

border.Width = Width;
border.Height = Height;

border.Margin = new Thickness(10);

Viewbox viewBox = new Viewbox();
viewBox.Stretch = Stretch.Uniform;
viewBox.Child = border;

previewgrid.Children.Add(viewBox);

Please, note that this solution does not work if previewgrid is a Canvas . I hope it can help you.

Answer 2

The simplest way:

 <Grid Margin="50">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="50" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="50" />
    </Grid.ColumnDefinitions>
    <Border CornerRadius="50,0,0,50"
            Background="Green" />
    <Border CornerRadius="0"
            Grid.Column="1"
            Background="Green" />
    <Border CornerRadius="0,50,50,0"
            Grid.Column="2"
            Background="Green" />

</Grid>

By C#:

        myGrid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(50) });
        myGrid.ColumnDefinitions.Add(new ColumnDefinition());
        myGrid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(50) });

        Border b1 = new Border
        {
            Background = new SolidColorBrush(Colors.Blue),
            CornerRadius = new CornerRadius(100, 0, 0, 100)
        };

        Grid.SetColumn(b1, 0);

        Border b2 = new Border
        {
            Background = new SolidColorBrush(Colors.Blue),
        };
        Grid.SetColumn(b2, 1);
        Border b3 = new Border
        {
            Background = new SolidColorBrush(Colors.Blue),
            CornerRadius = new CornerRadius(0, 100, 100, 0),
        };
        Grid.SetColumn(b3, 2);

        myGrid.Children.Add(b1);
        myGrid.Children.Add(b2);
        myGrid.Children.Add(b3);

Normal:

Resized:

Is it good enough for you?