4

DockPanel含むいくつかのコントロールを含む がありScrollViewerます。

私が望んでScrollViewerいるのは、フォームの下部から他のコントロールを押し出すことなく、グリッドをスクロールできるようにすることです。

代わりに、 はScrollViewerの上部ではなく、ウィンドウの高さまで拡大し、フォームの下部に向けて をButton押し出します。Buttonどうしてこれなの?どうすれば修正できますか?

<Window x:Class="Class1.MainWindow"
    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:local="clr-namespace:Class1"
    mc:Ignorable="d"
    Title="MainWindow" Height="800" Width="600"
    WindowStartupLocation="CenterScreen">
<DockPanel LastChildFill="False">
    <Menu DockPanel.Dock="Top">
        <MenuItem Header="File">
            <MenuItem Name="miQuit" Header="Quit" Click="miQuit_Click" />
        </MenuItem>
    </Menu>
    <ToolBarTray DockPanel.Dock="Top" IsLocked="True">
        <ToolBar>
            <Button Name="btnQuit" ToolBar.OverflowMode="Never" Click="btnQuit_Click">
                Quit
            </Button>
        </ToolBar>
    </ToolBarTray>
    <ScrollViewer VerticalScrollBarVisibility="Auto" DockPanel.Dock="Top" VerticalAlignment="Stretch">
        <Grid Name="gMainGrid" ScrollViewer.CanContentScroll="True">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>
            <TextBox Grid.Column="0" Grid.Row="0"   Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="1"   Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="2"   Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="3"   Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="4"   Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="5"   Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="6"   Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="7"   Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="8"   Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="9"   Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="10"  Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="11"  Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="12"  Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="13"  Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="14"  Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="15"  Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="16"  Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="17"  Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="18"  Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="19"  Width="100" Margin="10,10,10,10"/>
            <TextBox Grid.Column="0" Grid.Row="20"  Width="100" Margin="10,10,10,10"/>
        </Grid>
    </ScrollViewer>
    <Button Name="btnButton1" DockPanel.Dock="Bottom" Click="btnButton1_Click" >ButtonText</Button>
</DockPanel>

画面の上部にメニュー バー、画面の下部にボタンScrollViewer、中央に のグリッドが必要です。私は何を間違っていますか?

4

2 に答える 2

2

問題は、ScrollViewerがどのくらいの高さを取得すべきかわからないことです。ScrollViewer子が必要とするだけのサイズを取得しようとするコントロールです。DockPanelまた、必要なだけのサイズを提供するScrollViewerため、問題が発生します。ScrollViewerの高さをピクセルで固定できます(つまりHeight=100、固定の高さにします)。ユースケースがわからないので、たとえば画像カルーセルを表示している場合に役立つ可能性があります。

より一般的なレイアウトのアドバイスとして、DockPanel の代わりにグリッドを使用する方がよいと言えます。

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="auto" />
        <RowDefinition Height="auto" />
        <RowDefinition Height="auto" />
        <!-- Next one is for middle part of the page -->
        <RowDefinition Height="*" />
        <RowDefinition Height="auto" />
    </Grid.RowDefinitions>
    <!-- your controls here -->
</Grid>
于 2016-12-18T05:51:27.603 に答える
0

DockPanel全体をグリッドに貼り付ければ、動的な高さを持つことができることがわかりました。の動的な高さを使用できるようになったため、これは機能しているようScrollViewerです。

<Window x:Class="Class1.MainWindow"
    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:local="clr-namespace:Class1"
    mc:Ignorable="d"
    Title="MainWindow" Height="800" Width="600"
    WindowStartupLocation="CenterScreen">
  <Grid>
      <Grid.ColumnDefinitions>
          <ColumnDefinition />
      </Grid.ColumnDefinitions>
      <Grid.RowDefinitions>
          <RowDefinition Height="*" />
          <RowDefinition Height="Auto" />
      </Grid.RowDefinitions>
      <DockPanel Grid.Column="0" Grid.Row="0" LastChildFill="False">

ボタンを DockPanel の外に移動し、グリッドの 2 行目に移動することを除いて、すべてが通常どおりです。

        </DockPanel>
    <Button Grid.Column="0" Grid.Row="1" Name="btnButton1" DockPanel.Dock="Bottom" Click="btnButton1_Click" >ButtonText</Button>
</Grid>

「自動」の行は、Heightその内容に合わせてサイズ変更されます。アスタリスク (*) の付いた行Heightは、Autos のサイズが計算された後、残りのスペースを埋めるようにサイズ設定されます。したがって、すべてが正しく適切にサイズ調整されます。

または、この時点で、Emad が回答で示唆しているように、 、 、 、および、、、およびを個別のグリッド行にDockPanel完全に配置することができます (ただし、例の余分な行が何のためのものかはわかりません)。 .MenuToolBarTrayScrollViewerButton

    <Grid.ColumnDefinitions>
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

私は最終的にそのアプローチを採用することに決めたので、それを答えとしてマークしますが、完全な説明のために、完全を期すためにこれをすべてここに置いています(人々がたまたまそれらを保持したい場合に備えてDockPanel)。

于 2016-12-26T09:59:03.277 に答える