0

現在、コードを作成する必要なく、コントロールを WPF のボックス形状に表示するのに苦労しています。これが私がそれをどのように見せたいかの実際の例です:

  <Grid>
    <Grid.RowDefinitions>
      <RowDefinition Height="120"/>
      <RowDefinition Height="3" />
      <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <StackPanel Orientation="Horizontal">
      <Button Margin="6" VerticalAlignment="Stretch" Width="{Binding Path=ActualHeight, Mode=OneWay, RelativeSource={RelativeSource Self}}">
        <Grid>
          <Grid.RowDefinitions>
           <RowDefinition Height="*" />
           <RowDefinition Height="Auto" />
          </Grid.RowDefinitions>
          <Image Source="http://blog.joeclarmusic.com/images/rss-icon.jpg" />
          <TextBlock Foreground="Black" TextAlignment="Center" Grid.Row="1" FontSize="11" Text="{Binding Path=Name}" Margin="0, 5, 0, 0" HorizontalAlignment="Center" TextWrapping="Wrap" />
        </Grid>
      </Button>
    </StackPanel>
    <GridSplitter Grid.Row="1" Background="#DDDDDD" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" />
  </Grid>

わかりました、これはすべてクールでうまくいきます。私の現在のデザインでは、ItemsControl を使用して画像のリストを表示しています。このようなリストはウィンドウの幅を超える可能性があるため、VerticalScrollBar が無効になっている StackPanel の周りに ScrollViewer を追加したいと考えました (左から右にのみ流れるようにしたいので、Horizo​​ntalScrollBar のみが必要です)。

ScrollViewer を追加した後:

  <Grid>
    <Grid.RowDefinitions>
      <RowDefinition Height="120"/>
      <RowDefinition Height="3" />
      <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <ScrollViewer>
      <StackPanel Orientation="Horizontal">
        <Button Margin="6" VerticalAlignment="Stretch" Width="{Binding Path=ActualHeight, Mode=OneWay, RelativeSource={RelativeSource Self}}">
          <Grid>
          <Grid.RowDefinitions>
           <RowDefinition Height="*" />
           <RowDefinition Height="Auto" />
          </Grid.RowDefinitions>
          <Image Source="http://blog.joeclarmusic.com/images/rss-icon.jpg" />
          <TextBlock Foreground="Black" TextAlignment="Center" Grid.Row="1" FontSize="11" Text="{Binding Path=Name}" Margin="0, 5, 0, 0" HorizontalAlignment="Center" TextWrapping="Wrap" />
         </Grid>    
        </Button>
      </StackPanel>
    </ScrollViewer>
    <GridSplitter Grid.Row="1" Background="#DDDDDD" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" />
  </Grid>

私のコンピューターで kaxaml 1.7.1 を実行したときの上記の画像: jonatan.nilsson.is/wpf_with_scrollviewer.jpg

Kaxaml (または WPF ウィンドウ/ページ) で実行すると、ボタンはどんどん大きくなります (幅と高さの両方)。私が行った唯一の変更は、StackPanel の周りに ScrollViewer を追加することです。他のすべては同じですが、スクロールビューア内で大きくなり続けるのはなぜですか?

ここで何が間違っていますか?

編集: 2 番目の例の結果の画像を追加しました。

4

2 に答える 2

1

わかりました、解決策を見つけました。この「動作」は、次の条件が満たされた場合に発生します。

  • ボタンのコンテンツに画像が含まれています
  • 幅/高さは、その高さ/幅にバインドされています。
  • ボタンのコンテンツが幅よりも高い (バインディングが高さ -> 幅に設定されている場合)

これは非常に簡単にテストできます。画像を除く Button.Content 内のすべてを削除すると、すべてが「ほぼ」機能します (GridSplitter を使用して行の高さを小さくしてもボタンは小さくなりませんが、大きくなります)。

ただし、その後 Image に追加Margin="0, 0, 0, 1"すると、以前と同じ動作が発生します (つまり、無限に大きくなります)。

何が起こっているかは、基本的に次のとおりです。

  1. ボタンの高さが幅よりも高くなっています。
  2. バインディングはそれを見て、それをより広くします
  3. 画像は、幅が広くなり、比率を維持するために高くなります (この場合は 1:1)。
  4. 画像は自分自身をより高く押し上げます。
  5. ボタンの高さが幅よりも高くなっています。手順 2 に進みます。

基本的に、画像の動作は常に比率を維持するためです。この「動作」を回避するには、ボタンのコンテンツを高さよりも幅を広くします。ボタンのコンテンツの幅が高さよりも高い場合、バインディングは幅を低くします。これにより、画像が正しく動作します。

2 番目の例では、たとえば次のように追加します。

Margin="30 ,0" 

To Image は、終わりのない成長の問題を解決します。

これをうまく説明できたかどうかわからないので、この説明を改善するための提案があればコメントしてください。

于 2011-01-25T20:24:22.853 に答える
0

編集: OK、私はあなたのコードを少しいじりました。ボタンが実際に無限に大きくなっていることを確認できます。なぜこれが起こっているのか、私には本当に言えません。おそらく、内部測定の一部が機能していない可能性があります。StackPanel や DockPanel などと同様に、パネル コントロール (この場合は Grid) をボタン コンテンツとして使用すると問題が発生することがわかりました。おそらく、これらの項目をボタンに配置せず、代わりに他のコントロールを使用する方がよいでしょう。本当にボタンである必要がありますか?

OLD:
グリッド セル自体が大きくなり続けているためか、ボタンの高さが大きくなり続けています。グリッド スプリッターを使用してグリッド コンポーネントのサイズを変更すると、ボタンはそれが存在するセルの高さ全体を想定します。ボタンが「大きくなり続ける」状況を説明すると、より理にかなっているかもしれません。考えてみると、これが項目コントロールに存在するものである場合、そもそもなぜグリッド スプリッターと空のセルを使用するのでしょうか?

OLDER:
「オーバーフローすると高さが大きくなり続ける」とは、ボタンの高さだけでなく幅も意味していると思います。それは、幅が高さに直接バインドされているためです。

「オーバーフローしない....」という意味であれば、それはグリッド行のサイズに関係する別の話です。おそらく、実際の問題が何であるかを明確にし、有効な XAML を例として提供する必要があります。(投稿の XAML には、ボタン コンテンツの '' タグがありません。

于 2011-01-24T16:37:33.480 に答える