Jak sprawić, by element podrzędny był ograniczony przez jego rodzica w WPF?

Question

Mam StackPanel, który jest większy niż jego rodzic Grid. Potwierdziłem, że za pomocą Snoop WPF Spy. Width s są ustawione domyślnie. Jak to ograniczyć?

Nie podoba mi się rozwiązanie ViewBox, ponieważ pomniejsza mój tekst i chcę go zapakować/przyciąć.

Edit XAML jako wezwanego

<Grid> 
    <StackPanel 
     Orientation="Horizontal"> 
     <Border 
      BorderBrush="Black" 
      BorderThickness="1" 
      Width="{ Binding BorderScreenShot }" 
      Margin="0,-8,0,0"> 
      <Image 
       ToolTip="Some Text" 
       Cursor="Hand" 
       Source="{ Binding Image }" 
       Stretch="Fill" 
       Visibility="{ Binding ImageVisibility }" 
       MouseLeftButtonUp="Image_MouseLeftButtonUp" /> 
     </Border> 
     <StackPanel 
      Orientation="Vertical" 
      Margin="10,0,0,0"> 
      <TextBlock 
       Text="{ Binding Name }" 
       TextWrapping="Wrap" /> 
      <TextBlock 
       Text="{ Binding LongText }" 
       TextWrapping="Wrap" /> 
      <StackPanel 
       Orientation="Horizontal"> 
       <TextBlock 
        Text="{ Binding Category }" /> 
       <TextBlock 
        Text="{ Binding Version }" /> 
      </StackPanel> 
     </StackPanel> 
    </StackPanel> 
</Grid> 

Answer 1

Można spróbować zmienić StackPanel Do DockPanel (z odpowiednimi DockPanel.Dock właściwości na dzieci).

To będzie naśladować efekt StackPanel, ale pozwoli dzieciom być ograniczonym.

Lub użyj WrapPanel zamiast StackPanel.

StackPanele mają nieskończony rozmiar klienta, więc nic wewnątrz StackPanelu nie będzie zawijane ani przycinane bez ustawiania jawnych wymiarów (zamiast tego StackPanel powiększa się, aby dopasować zawartość).

Answer 2

To nie jest możliwe, aby element podrzędny być większe niż to elementu nadrzędnego, chyba że jego zawartość jest większa. Jeśli chcesz przyciąć tekst, możesz użyć TextBlock.TextTrimming = WordEllipsis/CharacterEllipsis. Dałoby to pożądane zachowanie, jeśli moja interpretacja pytania jest prawidłowa.

Jednak to nie działa poprawnie z StackPanel. Jak sugeruje inna odpowiedź, można użyć obiektu DockPanel lub Grid do uporządkowania zawartości.

Alternatywnie można owinąć swój StackPanel w ScrollViewer i użyć paska przewijania, aby obsłużyć przepełnienie.

Aktualizacja To powinno rozwiązać to

<DockPanel> 
    <Border  
     DockPanel.Dock="Left" 
     BorderBrush="Black"    
     BorderThickness="1"    
     Width="{ Binding BorderScreenShot }"   
     Margin="0,-8,0,0"> 
     <Image    ToolTip="Some Text"    Cursor="Hand"    Source="{ Binding Image }"    Stretch="Fill"    Visibility="{ Binding ImageVisibility }"    MouseLeftButtonUp="Image_MouseLeftButtonUp" /> 
    </Border> 
    <StackPanel    
      DockPanel.Dock="Bottom" 
      Orientation="Horizontal"> 
     <TextBlock     Text="{ Binding Category }" /> 
     <TextBlock     Text="{ Binding Version }" /> 
    </StackPanel> 
    <TextBlock    
     DockPanel.Dock="Top" 
     Text="{ Binding Name }"     
     TextWrapping="Wrap" /> 
    <TextBlock     
     Text="{ Binding LongText }"     
     TextTrimming="WordEllipsis" 
     TextWrapping="Wrap" /> 
</DockPanel> 

Answer 3

Jeśli nie chcesz zmniejszać zawartości, naprawdę nie ma innego sposobu na jej ograniczenie - zwłaszcza, że ​​w grę wchodzą obrazy.

To pozostawia wiele z ScrollViewer, który został zaprojektowany tylko dla tego scenariusza. Osobiście lubię łączenie możliwości powiększania/pomniejszania z funkcją ScrollViewer. Daje to użytkownikom najwięcej opcji w zakresie ich wyglądu.