0

我通过设置 DesignHeight="300" 和 DesignWidth="600" 创建了 Silverlight 页面。当我恢复浏览器窗口时,页面的控件也会变小。

如果我将浏览器窗口的大小重新调整到更小,那么我页面上的控件就会消失。我需要提供一个滚动条,但是当我添加滚动条时,页面上不会显示任何内容。

<UserControl x:Class="ResourceCenter.SMTest.Planogram"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:UI="clr-namespace:VISZERA.UI.Controls;assembly=VISZERA.UI"  
    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"  
    xmlns:doc="clr-namespace:VISZERA.UI;assembly=VISZERA.UI.DocumentViewer"  
    xmlns:ig="http://schemas.infragistics.com/xaml"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="1000">
    <ScrollViewer Background="AliceBlue">
        <Border x:Name="planoPage">
            <Grid x:Name="LayoutRoot" Background="White">
                <Grid.RowDefinitions>
                    <RowDefinition Height="20"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <Border BorderBrush="#94A8C0" BorderThickness="2" Padding="5"/>
                <!--<Border BorderBrush="Gray" BorderThickness="1" Grid.Row="0" />-->
                <Grid Grid.Row="1">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="3*"/>
                    </Grid.ColumnDefinitions>
                    <Border BorderBrush="#94A8C0" BorderThickness="2" Padding="5" Grid.Row="1"/>
                    <!--<Border BorderBrush="Gray" BorderThickness="1" Grid.Row="1" />-->
                    <Grid Margin="10">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="30" />
                            <RowDefinition />
                        </Grid.RowDefinitions>
                        <TextBlock Name="lblAssoProducts" Text="Associated Product" VerticalAlignment="Center" FontSize="13" HorizontalAlignment="Center" />
                        <ListBox Name="lstProducts" Grid.Row="1" />
                    </Grid>

                    <Grid Grid.Row="2" Grid.Column="1">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*"/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                        </Grid.ColumnDefinitions>
                        <!--Diplay Document Viewer in first Row of this Grid-->
                        <Border x:Name="brdCnt" BorderBrush="#94A8C0" BorderThickness="2" Padding="5"/>
                        <!--<Border x:Name="brdCnt" BorderBrush="Gray" BorderThickness="1" />-->
                        <doc:VISZERADocumentViewer x:Name="DocViewer" CanCutPages="False"></doc:VISZERADocumentViewer>
                        <Border BorderBrush="#94A8C0" BorderThickness="2" Grid.Row="1" />
                        <Grid Grid.Row="1" Margin="5">
                            <Grid.RowDefinitions>
                                <RowDefinition/>
                                <RowDefinition/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition />
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition />
                                <ColumnDefinition Width="100"/>
                            </Grid.ColumnDefinitions>
                            <!-- Labels-->
                            <TextBlock Name="lblCategory" Text="Category :" Height="20" HorizontalAlignment="Right" FontWeight="Bold"/>
                            <TextBlock Name="lblSubCategory" Text="Sub Category :" Grid.Row="1" Height="20" HorizontalAlignment="Right" FontWeight="Bold" />
                            <TextBlock Name="lblDC" Text="DC :" Grid.Row="2" Height="20" HorizontalAlignment="Right" FontWeight="Bold"/>
                            <TextBlock Name="lblFootage" Text="Footage :" Grid.Column="2" Height="20" HorizontalAlignment="Right" FontWeight="Bold"/>
                            <TextBlock Name="lblFileType" Text="File Type :" Grid.Row="1" Grid.Column="2" Height="20"  HorizontalAlignment="Right" FontWeight="Bold"/>
                            <TextBlock Name="lblReleasedOn" Text="Released On :" Grid.Row="2" Grid.Column="2" Height="20" HorizontalAlignment="Right" FontWeight="Bold"/>
                            <!--Input Controls-->
                            <TextBox Name="txtCategory" Grid.Column="1" Margin="2" Height="20"/>
                            <TextBox Name="txtSubCategory" Grid.Row="1" Grid.Column="1" Margin="2" Height="20" />
                            <TextBox Name="txtFootage" Grid.Column="3" Margin="2" Height="20"/>
                            <TextBox Name="txtFileType" Grid.Row="1" Grid.Column="3" Margin="2" Height="20"/>
                            <TextBox Name="txtReleasedOn" Grid.Row="2" Grid.Column="3" Margin="2" Height="20"/>
                            <telerik:RadComboBox x:Name="cmbDC" IsEditable="True" Grid.Row="2" Grid.Column="1" Margin="2" Height="20">
                                <telerik:RadComboBoxItem>CJ1</telerik:RadComboBoxItem>
                                <telerik:RadComboBoxItem>CJ3</telerik:RadComboBoxItem>
                                <telerik:RadComboBoxItem>CJ3</telerik:RadComboBoxItem>
                                <telerik:RadComboBoxItem>Excl</telerik:RadComboBoxItem>
                                <telerik:RadComboBoxItem>Sovereign</telerik:RadComboBoxItem>
                            </telerik:RadComboBox>
                            <!--Save & Delete Buttons-->
                            <telerik:RadButton Name="btnSave" Content="Save" Grid.Row="1" Grid.Column="4" Width="75" Height="25" ToolTipService.ToolTip="Save"/>
                            <telerik:RadButton Name="btnDelete" Content="Delete"  Grid.Row="1" Grid.Column="4" Width="75" Height="25" ToolTipService.ToolTip="Delete" Click="btnDelete_Click" />
                        </Grid>
                    </Grid>
                </Grid>
                <TextBlock Name="lblHeader" Text="Core Planogram" />
            </Grid>
        </Border>
    </ScrollViewer>
</UserControl>
4

2 回答 2

3

按照设计,您的布局有一个Gridinside a Borderinside a ScrollViewer。它们都默认为屏幕大小,因此ScrollViewer是多余的,不会显示滚动条。

要使 ScrollViewer 滚动,内容的大小必须大于 ScrollViewer。这意味着在某些子元素上设置固定的或至少最小的大小。

在您的情况下,您可以在边框上设置最小尺寸,例如:

<ScrollViewer Background="AliceBlue">
        <Border x:Name="planoPage" MinHeight="400" MinWidth="500">
            <Grid x:Name="LayoutRoot" Background="White">

或者 scor4er 建议的列和行的最小尺寸,但是我实际上建议对设计进行更流畅的更改,因为它并不真正适合外部 ScrollViewer。

我还注意到您在 Grids 中不断嵌套多个 Grids,而单个 Grid 将执行此操作。例如,以下布局与您的类似,但仅使用一个网格,如下所示: 布局示例

<Grid x:Name="LayoutRoot" Background="White">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="0.238*"/>
        <ColumnDefinition Width="0.762*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="20"/>
        <RowDefinition/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Border BorderBrush="#94A8C0" BorderThickness="2" Padding="5" Grid.ColumnSpan="2" Margin="0" Background="#FFECED5F"/>
    <Border BorderThickness="2" Padding="5" Margin="0" Grid.RowSpan="2" Grid.Row="1" Background="#FFDB69FF"/>
    <Border x:Name="brdCnt" BorderBrush="#94A8C0" BorderThickness="2" Padding="5" Margin="0" Grid.Column="1" Grid.Row="1" Background="#FF7595E4"/>
    <Border BorderBrush="#94A8C0" BorderThickness="2" Grid.Row="2" Margin="0" Grid.Column="1" Background="#FF40F1B4" />
</Grid>

然后在蓝色区域(可能还有紫色和绿色区域)中有一个是有意义的,ScrollViewer因为这些是唯一可以动态调整大小的窗格。

您仍然可以为整个屏幕使用外部 ScrollViewer,在这种情况下,结合上述建议。

于 2012-05-29T09:05:20.380 回答
1

您可以尝试将具有"*"高度或 MinWidth 的 RowDefinitions 的 MinHeight 属性设置为 ColumnDefinitions 宽度"*"宽度。如果页面大小变得小于限制,将出现滚动条。

例如:

<RowDefinition Height="*" MinHeight="500"/>

或者:

<ColumnDefinition Width="*" MinWidth="300"/>
于 2012-05-26T17:12:43.113 回答