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

あなたのレイアウトは、設計されているように、 のGrid中にBorderがありScrollViewerます。それらはすべて画面のサイズにデフォルト設定されているため、ScrollViewerは冗長であり、スクロールバーは表示されません。

ScrollViewer をスクロールするには、コンテンツのサイズが ScrollViewer より大きくなければなりません。これは、一部の子要素に固定サイズ、または少なくとも最小サイズを設定することを意味します。

あなたの場合、ボーダーに最小サイズを設定できます。

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

または、scor4er で提案されている列と行の最小サイズですが、実際には、外側の ScrollViewer にはあまり適していないため、デザインをより流動的に変更することをお勧めします。

また、単一のグリッドで行うグリッド内に複数のグリッドをネストし続けることにも注意してください。たとえば、次のレイアウトはあなたのものに似ていますが、次のようなグリッドを 1 つだけ使用しています。 レイアウト例

<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 の幅 width に設定することができます"*"。ページサイズが制限以下になると、スクロールバーが表示されます。

例えば:

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

または:

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