Question

我创建了一个简单的wpf项目，但它在crt监视器和lcd监视器上有不同的显示：

CRT：

enter image description here

LCD：

enter image description here

正如你所看到的那样，CRT放映的正确部分即使在最大化时也会消失！

为什么会如此以及如何解决？

这是它的xaml代码：

<Window x:Class="MonitorTest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 

    Title="MainWindow" WindowState="Maximized"  Top="0" Left="0" 
    Background="SkyBlue"
     SizeToContent="WidthAndHeight"  mc:Ignorable="d" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" >

<Grid  Background="SkyBlue"  Height="700" >
    <Grid Background="SkyBlue" HorizontalAlignment="Left" Margin="0,-1,0,285" Name="grid3" Width="1286">
        <DataGrid BorderBrush="White" AutoGenerateColumns="False" Background="Transparent" 
                  CanUserReorderColumns="False" CanUserResizeColumns="False" CanUserResizeRows="False"
                  FlowDirection="LeftToRight" Height="404" MinColumnWidth="60" Name="DataGrid1" VerticalAlignment="Top" HorizontalAlignment="Left" Width="423" Margin="0,1,0,0">
            <DataGrid.ColumnHeaderStyle>
                <Style TargetType="DataGridColumnHeader">
                    <Setter Property="Control.HorizontalContentAlignment" Value="Center" />
                </Style>
            </DataGrid.ColumnHeaderStyle>
            <DataGrid.Columns>
                <DataGridTextColumn Binding="{Binding Path=X}" Header="X" />
                <DataGridTextColumn Binding="{Binding Path=Y}" Header="Y" />
                <DataGridTextColumn Binding="{Binding Path=Z}" Header="Z" />
                <DataGridTextColumn Binding="{Binding Path=Q}" Header="Q" />
                <DataGridTextColumn Binding="{Binding Path=G}" Header="G" />
                <DataGridTextColumn Binding="{Binding Path=Alpha}" Header="α" />
                <DataGridTextColumn Binding="{Binding Path=Beta}" Header="β" />
            </DataGrid.Columns>
            <DataGrid.RowStyle>
                <Style TargetType="DataGridRow">
                    <Setter Property="Control.Background" Value="{Binding RowColour}" />
                </Style>
            </DataGrid.RowStyle>
        </DataGrid>
        <DataGrid AutoGenerateColumns="False" Background="Transparent" BorderBrush="White" CanUserReorderColumns="False" 
                  CanUserResizeColumns="False" CanUserResizeRows="False" FlowDirection="LeftToRight" Height="404" HorizontalAlignment="Left"
                  Margin="429,1,0,0" MinColumnWidth="60" Name="DataGrid2" VerticalAlignment="Top" Width="367">
            <DataGrid.ColumnHeaderStyle>
                <Style TargetType="DataGridColumnHeader">
                    <Setter Property="Control.HorizontalContentAlignment" Value="Center" />
                </Style>
            </DataGrid.ColumnHeaderStyle>
            <DataGrid.Columns>
                <DataGridTextColumn Binding="{Binding Path=X}" Header="Xc" />
                <DataGridTextColumn Binding="{Binding Path=Y}" Header="Yc" />
                <DataGridTextColumn Binding="{Binding Path=Theta}" Header="θ" />
                <DataGridTextColumn Binding="{Binding Path=Phi}" Header="φ" />
                <DataGridTextColumn Binding="{Binding Path=Alpha}" Header="α" />
                <DataGridTextColumn Binding="{Binding Path=Beta}" Header="β" />
            </DataGrid.Columns>
            <DataGrid.RowStyle>
                <Style TargetType="DataGridRow">
                    <Setter Property="Control.Background" Value="{Binding RowColour}" />
                </Style>
            </DataGrid.RowStyle>
        </DataGrid>
        <DataGrid AutoGenerateColumns="False" Background="Transparent" BorderBrush="White" CanUserReorderColumns="False" 
                  CanUserResizeColumns="False" CanUserResizeRows="False" FlowDirection="LeftToRight" Height="404" HorizontalAlignment="Left"
                  Margin="802,1,0,0" MinColumnWidth="60" Name="MotorDataGrid" VerticalAlignment="Top" Width="127">
            <DataGrid.ColumnHeaderStyle>
                <Style TargetType="DataGridColumnHeader">
                    <Setter Property="Control.HorizontalContentAlignment" Value="Center" />
                </Style>
            </DataGrid.ColumnHeaderStyle>
            <DataGrid.Columns>
                <DataGridTextColumn Binding="{Binding Path=Alpha}" Header="α" />
                <DataGridTextColumn Binding="{Binding Path=Beta}" Header="β" />
            </DataGrid.Columns>
            <DataGrid.RowStyle>
                <Style TargetType="DataGridRow">
                    <Setter Property="Control.Background" Value="{Binding RowColour}" />
                </Style>
            </DataGrid.RowStyle>
        </DataGrid>
        <DataGrid AutoGenerateColumns="False" Background="Transparent" BorderBrush="White" CanUserReorderColumns="False" 
                  CanUserResizeColumns="False" CanUserResizeRows="False" FlowDirection="LeftToRight" Height="404" HorizontalAlignment="Left"
                  Margin="935,1,0,0" MinColumnWidth="60" Name="DataGrid3" VerticalAlignment="Top" Width="342">
            <DataGrid.ColumnHeaderStyle>
                <Style TargetType="DataGridColumnHeader">
                    <Setter Property="Control.HorizontalContentAlignment" Value="Center" />
                </Style>
            </DataGrid.ColumnHeaderStyle>
            <DataGrid.Columns>
                <DataGridTextColumn Binding="{Binding Path=Mdiff}" Header="M_Δα" />
                <DataGridTextColumn Binding="{Binding Path=Ma_diff}" Header="H_Δα" />
                <DataGridTextColumn Binding="{Binding Path=MB_diff}" Header="S_Δβ" />
                <DataGridTextColumn Binding="{Binding Path=MBa_diff}" Header="H_Δβ" />

            </DataGrid.Columns>
            <DataGrid.RowStyle>
                <Style TargetType="DataGridRow">
                    <Setter Property="Control.Background" Value="{Binding RowColour}" />
                </Style>
            </DataGrid.RowStyle>
        </DataGrid>
        <Label Content="s4" Height="32" HorizontalAlignment="Left" Margin="6,0,0,549" Name="s4Label" VerticalAlignment="Bottom" Width="242" />
        <Label Content="hSS" Height="32" HorizontalAlignment="Left" Margin="254,0,0,549" Name="label2" VerticalAlignment="Bottom" Width="224" />
        <Label Content="Motor" Height="32" HorizontalAlignment="Left" Margin="485,0,0,549" Name="label3" VerticalAlignment="Bottom" Width="50" />
        <Grid Background="SlateGray" Height="257" Margin="21,0,0,-266" Name="grid1" VerticalAlignment="Bottom" HorizontalAlignment="Left" Width="178">
            <Button Content="Config" Height="42" HorizontalAlignment="Left" Margin="21,12,0,0" Name="Config" VerticalAlignment="Top" Width="136" />
            <Button Content="Init Sensors" Height="42" Margin="22,60,20,0" Name="InitButton" VerticalAlignment="Top" Width="136" />
            <Button IsEnabled="False" Content="Start" Height="42" HorizontalAlignment="Left" Margin="21,108,0,0" Name="StartButton" VerticalAlignment="Top" Width="136" Click="Start_Click" />
            <Button IsEnabled="False" Content="Stop" Height="42" HorizontalAlignment="Left" Margin="21,156,0,0" Name="StopButton" VerticalAlignment="Top" Width="136" Click="Stop_Click" />
            <Button Content="Stop" Height="42" HorizontalAlignment="Left" IsEnabled="False" Margin="22,203,0,0" Name="StopSButton" VerticalAlignment="Top" Width="136" Click="Stop_Click" />
        </Grid>
    </Grid>

    <TextBox Background="WhiteSmoke" Height="249" HorizontalAlignment="Left" Margin="231,424,0,0" Name="textBox1" VerticalAlignment="Top" Width="209" />
</Grid>

Answer 1

容器在定义UI方面起着重要作用。因此，利用它们使UI变得灵活。

使用WPF编写UI代码时，请避免使用Width，Height等，除非必要。尝试使用Grid，StackPanel，DockPanel等容器。

来自MSDN：

WPF包含一整套派生面板实现，可实现许多复杂的布局。这些派生类公开了支持大多数标准用户界面（UI）方案的属性和方法。无法找到满足其需求的子排列行为的开发人员可以通过重写ArrangeOverride和MeasureOverride方法来创建新布局。有关自定义布局行为的详细信息，请参阅自定义面板元素。

如果你仍然需要定义高度，宽度等数字然后用测量单位定义，例如0.05in或5pt，这样WPF将尝试通过改变像素数来保持大小恒定到各种分辨率。这被称为DIP(Device-independent pixels)

我试图根据可用的屏幕空间使UI保持可调整大小，因此它会尝试以最佳外观适合屏幕

XAML

<Grid Background="SkyBlue">
    <Grid Margin="0.05in">
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="auto" />
        </Grid.RowDefinitions>
        <Grid x:Name="grid3">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="7*" />
                <ColumnDefinition Width="6*" />
                <ColumnDefinition Width="auto" />
                <ColumnDefinition Width="4*" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="auto" />
                <RowDefinition />
            </Grid.RowDefinitions>
            <Grid.Resources>
                <Style x:Key="gridStyle"
                       TargetType="DataGrid">
                    <Setter Property="Background"
                            Value="Transparent" />
                    <Setter Property="AutoGenerateColumns"
                            Value="False" />
                    <Setter Property="BorderBrush"
                            Value="White" />
                    <Setter Property="Margin"
                            Value="0.02in" />
                    <Setter Property="CanUserReorderColumns"
                            Value="False" />
                    <Setter Property="CanUserResizeColumns"
                            Value="False" />
                    <Setter Property="CanUserResizeRows"
                            Value="False" />
                    <Setter Property="FlowDirection"
                            Value="LeftToRight" />
                    <Setter Property="MinColumnWidth"
                            Value="60" />
                    <Setter Property="Grid.Row"
                            Value="1" />
                </Style>
                <Style TargetType="TextBlock">
                    <Setter Property="FontWeight"
                            Value="SemiBold" />
                    <Setter Property="Margin"
                            Value="0.05in,0" />
                </Style>
            </Grid.Resources>
            <DataGrid Style="{StaticResource gridStyle}"
                      x:Name="DataGrid1">
                <DataGrid.ColumnHeaderStyle>
                    <Style TargetType="{x:Type DataGridColumnHeader}">
                        <Setter Property="HorizontalContentAlignment"
                                Value="Center" />
                    </Style>
                </DataGrid.ColumnHeaderStyle>
                <DataGrid.Columns>
                    <DataGridTextColumn Binding="{Binding X}"
                                        Header="X" />
                    <DataGridTextColumn Binding="{Binding Y}"
                                        Header="Y" />
                    <DataGridTextColumn Binding="{Binding Z}"
                                        Header="Z" />
                    <DataGridTextColumn Binding="{Binding Q}"
                                        Header="Q" />
                    <DataGridTextColumn Binding="{Binding G}"
                                        Header="G" />
                    <DataGridTextColumn Binding="{Binding Alpha}"
                                        Header="α" />
                    <DataGridTextColumn Binding="{Binding Beta}"
                                        Header="β" />
                </DataGrid.Columns>
                <DataGrid.RowStyle>
                    <Style TargetType="{x:Type DataGridRow}">
                        <Setter Property="Background"
                                Value="{Binding RowColour}" />
                    </Style>
                </DataGrid.RowStyle>
            </DataGrid>
            <DataGrid Style="{StaticResource gridStyle}"
                      x:Name="DataGrid2"
                      Grid.Column="1">
                <DataGrid.ColumnHeaderStyle>
                    <Style TargetType="{x:Type DataGridColumnHeader}">
                        <Setter Property="HorizontalContentAlignment"
                                Value="Center" />
                    </Style>
                </DataGrid.ColumnHeaderStyle>
                <DataGrid.Columns>
                    <DataGridTextColumn Binding="{Binding X}"
                                        Header="Xc" />
                    <DataGridTextColumn Binding="{Binding Y}"
                                        Header="Yc" />
                    <DataGridTextColumn Binding="{Binding Theta}"
                                        Header="θ" />
                    <DataGridTextColumn Binding="{Binding Phi}"
                                        Header="φ" />
                    <DataGridTextColumn Binding="{Binding Alpha}"
                                        Header="α" />
                    <DataGridTextColumn Binding="{Binding Beta}"
                                        Header="β" />
                </DataGrid.Columns>
                <DataGrid.RowStyle>
                    <Style TargetType="{x:Type DataGridRow}">
                        <Setter Property="Background"
                                Value="{Binding RowColour}" />
                    </Style>
                </DataGrid.RowStyle>
            </DataGrid>
            <DataGrid Style="{StaticResource gridStyle}"
                      x:Name="MotorDataGrid"
                      Grid.Column="2">
                <DataGrid.ColumnHeaderStyle>
                    <Style TargetType="{x:Type DataGridColumnHeader}">
                        <Setter Property="HorizontalContentAlignment"
                                Value="Center" />
                    </Style>
                </DataGrid.ColumnHeaderStyle>
                <DataGrid.Columns>
                    <DataGridTextColumn Binding="{Binding Alpha}"
                                        Header="α" />
                    <DataGridTextColumn Binding="{Binding Beta}"
                                        Header="β" />
                </DataGrid.Columns>
                <DataGrid.RowStyle>
                    <Style TargetType="{x:Type DataGridRow}">
                        <Setter Property="Background"
                                Value="{Binding RowColour}" />
                    </Style>
                </DataGrid.RowStyle>
            </DataGrid>
            <DataGrid Style="{StaticResource gridStyle}"
                      x:Name="DataGrid3"
                      Grid.Column="3">
                <DataGrid.ColumnHeaderStyle>
                    <Style TargetType="{x:Type DataGridColumnHeader}">
                        <Setter Property="HorizontalContentAlignment"
                                Value="Center" />
                    </Style>
                </DataGrid.ColumnHeaderStyle>
                <DataGrid.Columns>
                    <DataGridTextColumn Binding="{Binding Mdiff}"
                                        Header="M_Δα" />
                    <DataGridTextColumn Binding="{Binding Ma_diff}"
                                        Header="H_Δα" />
                    <DataGridTextColumn Binding="{Binding MB_diff}"
                                        Header="S_Δβ" />
                    <DataGridTextColumn Binding="{Binding MBa_diff}"
                                        Header="H_Δβ" />

                </DataGrid.Columns>
                <DataGrid.RowStyle>
                    <Style TargetType="{x:Type DataGridRow}">
                        <Setter Property="Background"
                                Value="{Binding RowColour}" />
                    </Style>
                </DataGrid.RowStyle>
            </DataGrid>
            <TextBlock Text="s4"
                       x:Name="s4Label" />
            <TextBlock Text="hSS"
                       x:Name="label2"
                       Grid.Column="1" />
            <TextBlock Text="Motor"
                       x:Name="label3"
                       Grid.Column="2" />
        </Grid>
        <Grid Grid.Row="1"
              Margin="0,.05in,0,0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="auto" />
                <ColumnDefinition MaxWidth="2in" />
            </Grid.ColumnDefinitions>
            <Border Background="SlateGray"
                    CornerRadius="4"
                    x:Name="grid1">
                <StackPanel>
                    <StackPanel.Resources>
                        <Style TargetType="{x:Type Button}">
                            <Setter Property="Width"
                                    Value="1.5in" />
                            <Setter Property="Height"
                                    Value=".45in" />
                            <Setter Property="Margin"
                                    Value=".2in, 0.05in" />
                        </Style>
                    </StackPanel.Resources>
                    <Button Content="Config"
                            Margin=".2in, .1in,.2in,.05in"
                            x:Name="Config" />
                    <Button Content="Init Sensors"
                            x:Name="InitButton" />
                    <Button IsEnabled="False"
                            Content="Start"
                            x:Name="StartButton"
                            Click="Start_Click" />
                    <Button IsEnabled="False"
                            Content="Stop"
                            x:Name="StopButton"
                            Click="Stop_Click" />
                    <Button Content="Stop"
                            IsEnabled="False"
                            Margin=".2in, .05in,.2in,.1in"
                            x:Name="StopSButton"
                            Click="Stop_Click"/>
                </StackPanel>
            </Border>
            <TextBox Background="WhiteSmoke"
                     Grid.Column="1"
                     x:Name="textBox1"
                     Margin=".1in,0,0,0" />
        </Grid>
    </Grid>
</Grid>

结果

宽屏（笔记本电脑，LCD，宽屏电视，HDMI显示屏等）

wide screen

4：3（CRT显示器，旧的4：3 LCD等）

4:3

试一试并分享您的反馈

Answer 2

您的LDC显示器是宽屏幕而您的CRT显示器不是。宽屏显示器预览更宽的桌面。你的应用程序是相同的，但你没有看到它的一部分，因为它溢出。 http://en.wikipedia.org/wiki/Display_resolution

在CRT和LCD显示器中显示不同的ui

2 个答案: