Visual Studio 2010 WPF Designer scale

Question

Hello. I made simple interface in Visual Studio 2010. When I launched application everything is bigger. Red square on screenshot represents size of the Button in launched application (On the right). Am I missing something? How to fix it?

P.S. In "Microsoft Expression Blend 4" the same project is exactly the same size as in editor.

---

---

<Window x:Class="WpfControlReview.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" mc:Ignorable="d" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" Height="120" Width="256" ResizeMode="NoResize">
    <Grid>
        <Button HorizontalAlignment="Stretch" Name="button1" VerticalAlignment="Stretch">
        <StackPanel HorizontalAlignment="Stretch" Name="stackPanel1" VerticalAlignment="Center">
            <Label IsHitTestVisible="False" Content="Select your options and press to commit" Name="label1" HorizontalContentAlignment="Center" FontSize="12" />
            <StackPanel Name="stackPanel2" Orientation="Horizontal">
                <Expander Header="Color" Name="expander1">
                </Expander>
                <Expander Header="Make" Name="expander2">
                </Expander>
                <Expander Header="Payment" Name="expander3">
                </Expander>
            </StackPanel>
        </StackPanel>
        </Button>
    </Grid>
</Window>

Answer 1

Are you zoomed out in the visual studio designer? Check the trackbar to your left and scroll it up and down to zoom in and out.

Answer 2

I'm not sure if this is a bug or not, but the basic idea here is that you have specifed a default size for your window, but because the control wants to be bigger (for whatever reason) it will automatically resize the window. Could be a bug how Visual Studio calculates window border size in the designer with the specified parameters as it's incorrectly showing it as a bit smaller than when you actually launch your application.

I would rather suggest that you avoid specifying heights/widths if possible. Instead set the Window to SizeToContent=WidthAndHeight. If you need to play with the size of your controls use Margins or MinWidth/MinHeight set directly on your controls.

Answer 3

Remeber that WPF scales the UI. Have you played with your DPI settings at all? This will affect the render of the UI componets on the display. Try running the app on a secondary machine to eleimate display issues.

From MSDN:

Resolution-independent and device-independent graphics. The basic unit of measurement in the WPF graphics system is the device independent pixel, which is 1/96th of an inch, regardless of actual screen resolution, and provides the foundation for resolution-independent and device-independent rendering. Each device-independent pixel automatically scales to match the dots-per-inch (dpi) setting of the system it renders on.

http://msdn.microsoft.com/en-us/library/aa970268.aspx