解决问题C#WPF

我在调整WPF程序的大小以使其能够适应用户屏幕的分辨率方面遇到了问题。我在下面有两张截图，一张是在

1600 x 900

拍摄的，另一张是在

1920 x 1080

拍摄的。它们都不是我希望我的申请看起来的样子

1600 x 900

1920 x 1080

正如您从第一幅图像中看到的，在较低的分辨率下，UI的某些部分刚刚离开屏幕。我可以使用

ScrollViewer

，但我更喜欢元素实际上垂直地适合屏幕，然后在必要时水平地使用

ScrollViewer

在第二幅图中，由于我尝试调整程序，使其适合较低的分辨率，现在有大量未使用的空间，我希望用户界面填充，而不是留白。我觉得我对

*

和

auto

的宽度有一个全面的了解，但总的布局是错误的。下面是这些截图的一些XAML的快照

         <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="auto"/>
                <RowDefinition Height="auto"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="auto"/>
                <ColumnDefinition Width="auto" MinWidth="180"/>
                <ColumnDefinition Width="auto"/>
                <ColumnDefinition Width="auto"/>
                <ColumnDefinition Width="250"/>
                <ColumnDefinition Width="auto" MaxWidth="160"/>
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <Rectangle Fill="#FF5FCFBA" Stroke="Black" Grid.ColumnSpan="4" Grid.RowSpan="2"/>
            <Label x:Name="jobTitleLabel" Content="Job" HorizontalAlignment="Left" Margin="26,10,0,5" VerticalAlignment="Center" FontSize="18" FontWeight="Bold" Grid.ColumnSpan="4"/>
            <StackPanel Grid.Row="1" >
                <Label Content="Reference:" FontSize="14" HorizontalAlignment="Right" Margin="0,0,0,1" VerticalAlignment="Center" />
                <Label Content="Description:" FontSize="14" HorizontalAlignment="Right" Margin="0" VerticalAlignment="Center" />
                <Label Content="Created:" FontSize="14" HorizontalAlignment="Right" Margin="0,5,0,0" Grid.Row="1" VerticalAlignment="Center" />
                <Label Content="Deadline:" FontSize="14" HorizontalAlignment="Right" Grid.Row="2" VerticalAlignment="Center" Margin="-2,7,0,0" />
                <Label Content="Start Date:" FontSize="14" HorizontalAlignment="Right" Grid.Row="2" VerticalAlignment="Center" Margin="-2,7,0,0" />
                <Label Content="Employee Name:" FontSize="14" Grid.Row="3" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,4,0,0" />
                <Label Content="Who's Job:" FontSize="14" Grid.Row="3" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,7,0,0" />
                <Label Content="Priority:" FontSize="14" Grid.Row="3" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,7,0,0" />
            </StackPanel>
            <StackPanel Grid.Column="1" Grid.Row="1">
                <TextBox x:Name="jobReferenceTextBox" Margin="5" FontSize="14" Grid.Column="1" VerticalAlignment="Center"/>
                <TextBox x:Name="jobTitleTextBox" Margin="5" FontSize="14" Grid.Column="1" VerticalAlignment="Center" MaxWidth="291" MaxLength="30"/>
                <wpftk:DateTimePicker x:Name="createdPicker" AutoCloseCalendar="True"  
                                      Margin="5,7,5,5" Format="Custom" FormatString="dd/MM/yyyy"
                                      FontSize="14" TextAlignment="Left" 
                                      TimeFormat="LongDate" TimePickerAllowSpin="False" 
                                      TimePickerShowButtonSpinner="False" 
                                      TimePickerVisibility="Hidden" ShowButtonSpinner="False"
                                      AllowTextInput="False"/>
                <wpftk:DateTimePicker x:Name="deadlinePicker" AutoCloseCalendar="True" Margin="5,8,5,5" Format="Custom" FormatString="dd/MM/yyyy" FontSize="14" TextAlignment="Left" TimeFormat="LongDate" TimePickerShowButtonSpinner="False" TimePickerAllowSpin="False" TimePickerVisibility="Hidden" ShowButtonSpinner="False"/>
                <wpftk:DateTimePicker x:Name="startDatePicker" AutoCloseCalendar="True" Margin="5,8,5,5" Format="Custom" FormatString="dd/MM/yyyy" FontSize="14" TextAlignment="Left" TimeFormat="LongDate" TimePickerShowButtonSpinner="False" TimePickerAllowSpin="False" TimePickerVisibility="Hidden" ShowButtonSpinner="False"/>
                <TextBox x:Name="nameTextBox" Margin="5,6,5,5" FontSize="14" Grid.Column="1" Grid.Row="3" VerticalAlignment="Center" />
                <ComboBox x:Name="itNameComboBox" Margin="5,7,5,5" FontSize="14" SelectedValuePath="Tag">
                    <ComboBoxItem Content="Unallocated" Tag="Unallocated"/>
                    <ComboBoxItem Content="Adam" Tag="AdamD"/>
                    <ComboBoxItem Content="Chris" Tag="Chris"/>
                    <ComboBoxItem Content="Dan" Tag="DanD"/>
                    <ComboBoxItem Content="Emily" Tag="EmilyC"/>
                    <ComboBoxItem Content="Kit" Tag="KitL"/>
                    <ComboBoxItem Content="Matt" Tag="Matt"/>
                </ComboBox>
                <ComboBox x:Name="priorityComboBox" Margin="5,7,5,5" FontSize="14" SelectedValuePath="Tag">
                    <ComboBoxItem Content="High" Tag="High"/>
                    <ComboBoxItem Content="Medium" Tag="Medium"  />
                    <ComboBoxItem Content="Low" Tag="Low"  />
                </ComboBox>
            </StackPanel>
            <StackPanel Grid.Column="3" Grid.Row="1">
                <ComboBox x:Name="jobPresetComboBox" IsEnabled="False" IsEditable="True" IsReadOnly="True" Text="Choose Predefined Job"  Margin="5"  FontSize="14" Grid.Column="1" Grid.Row="4" SelectionChanged="JobPresetComboBoxSelectionChanged" />
                <Button x:Name="addJobButton" Content="Add a New Job" Margin="5" Click="AddJob" FontSize="14" Grid.Column="1" Grid.Row="4" />
                <Button x:Name="updateButton" Content="Update Job Details" Margin="5" FontSize="14" Grid.Column="1" Grid.Row="4" Click="UpdateJob"/>
                <Button x:Name="markAsCompletedButton" Content="Mark as Completed" Margin="5" FontSize="14" Click="MarkAsCompleted"/>
                <Button x:Name="deleteButton" Content="Delete Job" Margin="5" FontSize="14" Click="DeleteJobPermanently"/>
                <Button x:Name="excelButton" Content="Export to Excel" Margin="5" FontSize="14" Click="ExportToExcel"/>
                <Button x:Name="restoreButton" Content="Restore Selected Job" Margin="5" FontSize="14" Visibility="Collapsed" Click="RestoreJob"/>
                <Button x:Name="addToHistoryButton" Content="Add to History" Margin="5" FontSize="14" Visibility="Collapsed" Click="AddJobToHistory"/>
                <Button x:Name="cancelButton" Content="Cancel Job Add" Margin="5" FontSize="14" Visibility="Collapsed" Click="CancelJobAdd"/>
            </StackPanel>
            <StackPanel Grid.Column="2" Grid.Row="1">
                <TextBox x:Name="notesTextBox" ScrollViewer.VerticalScrollBarVisibility="Visible" Margin="5" FontSize="14" VerticalAlignment="Center" TextWrapping="Wrap" AcceptsReturn="True" MinHeight="260" MaxHeight="260" MaxWidth="400" MinWidth="400"/>
            </StackPanel>
            <Grid x:Name="bnumGrid" Grid.Column="4" Grid.Row="1" Margin="8,0,10,0" MinWidth="250">
                <DataGrid x:Name="bnumDataGrid" ItemsSource="{Binding CurrentBnumsCollectionView}" MaxHeight="270"
                      CanUserAddRows="False" AutoGenerateColumns="False" SelectionChanged="BnumDataGridSelectionChanged"
                      IsReadOnly="True">
                    <DataGrid.Columns>
                        <DataGridTextColumn Header="Job ID" Width="0.75*" Binding="{Binding JobID}"/>
                        <DataGridTextColumn Header="Job Description" Width="3*" Binding="{Binding JobDescription}"/>
                    </DataGrid.Columns>
                </DataGrid>
            </Grid>
            <StackPanel x:Name="searchGrid" Grid.Row="1" Grid.Column="5">
                <Label Content="Search (ID)" HorizontalAlignment="Left" Margin="5,5,0,5" VerticalAlignment="Center" FontSize="20" FontWeight="Bold"/>
                <TextBox x:Name="searchBox" TextWrapping="Wrap" Margin="20,5" FontSize="14" VerticalAlignment="Center" TextChanged="CallSearchBoxFilter"/>
                <Label Content="Press Esc to clear filter" Margin="5,10,5,5" FontSize="14"/>
            </StackPanel>
        </Grid>

可以理解，其中包含了很多不相关的代码，但我不想遗漏一些我看不到有效果的东西。总体布局是一个

导航框架

，位于

页面

内，该页面位于

窗口

内，以便我可以在程序中的页面间导航

---

在这个特定页面上有一个

网格

，有两行，一行包含数据网格，另一行包含上面图像中的元素。我不确定是否是父网格导致了问题，但我想我会先发布这篇文章，以防我的布局出现任何“明显”的问题。

对于采用的重新设计，您必须采用面板方法。您需要添加一些堆栈面板和包裹面板来完成此操作。你必须避免边缘的东西和高度和宽度的面板。好吧，用一个答案来结束它不是一个容易的话题

---

我可以在30到40分钟内为您重新设计整个面板。这将是采用，但我必须使用您的团队查看器帐户，并在您的PC中执行。我已将代码粘贴到我的应用程序中，但有很多错误和错误。如果你想让我重新设计，请告诉我

下面是一些我认为应该让您了解如何在屏幕上放置项目的内容

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
        <ColumnDefinition/>
        <ColumnDefinition/>
        <ColumnDefinition/>
        <ColumnDefinition/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>
    <Rectangle Grid.ColumnSpan="5" Grid.RowSpan="6" Fill="Red"/>
    <TextBlock Text="Reference:" HorizontalAlignment="Right" VerticalAlignment="Center"/>
    <TextBlock Text="Description:" Grid.Row="1" HorizontalAlignment="Right" VerticalAlignment="Center"/>
    <TextBox Grid.Column="1" />
    <TextBox Grid.Column="1" Grid.Row="1" />
    <TextBox Grid.Column="2" Grid.ColumnSpan="2" Grid.RowSpan="5" Text="Mahoosive Text Box" />
    <ComboBox Grid.Column="4"/>
    <ComboBox Grid.Column="4" Grid.Row="1"/>
    <Button Content="Save New Job" Grid.Column="4" Margin="5" Grid.Row="2" />
    <DataGrid Grid.Column="5" Grid.RowSpan="7">
        <DataGrid.Columns>
            <DataGridTextColumn Header="Job ID"/>
        </DataGrid.Columns>
    </DataGrid>
    <TextBlock Grid.Column="6" Text="Search (ID)"/>
    <TextBox Grid.Column="6" Grid.Row="1" TextWrapping="Wrap" Text="TextBox"/>

</Grid>  

正如我们在评论中所说，这就是我的意思。

---

创建一个测试

UserControl

，粘贴我的代码并观察它在设计器中的大小。

这是否有帮助：

Viewbox

的唯一问题是它会缩放整个页面，使文本框变大/变小。@ChrisF是否有合适的替代方法来代替

Viewbox

？在我开始测试之前，我只是想知道it@CBreeze有几种不同的方法-例如水平

包装

，但每种方法都对您的设计有影响。@ChrisF My design specific还是WPF的总体设计？