WrapPanel隱藏每行最后一個uiElement的一半

我在stackPanel 中的每個UserControl 都有一個WrapPanel，而這個WrapPanel 中的每個UserControl 都是一個單詞（因此它們的大小彼此不同，取決于單詞的長度），因此出現了一個句子。

這是一張圖片，可以幫助您更好地理解：

• 粉紅色的是 UserControl “句子”，其中包含每個 一個 wrapPanel
• 在綠色中，所有用戶控制元件“單詞”都根據單詞長度具有不同的大小。

這是用戶控制元件“單詞”：

<UserControl x:Class="Coran_seul.UC.UserControl_WordInVerse"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:local="clr-namespace:Coran_seul.UC"
         mc:Ignorable="d" Margin="5,0,5,0">

<StackPanel>
    <TextBlock x:Name="textBlock_arabic" Text="??????????? " FontSize="20" HorizontalAlignment="Center" FontFamily="Noto Naskh Arabic" MouseEnter="textBlock_arabic_MouseEnter" MouseLeave="textBlock_arabic_MouseLeave" Cursor="Hand" MouseDown="textBlock_arabic_MouseDown"/>
    <TextBlock x:Name="textBlock_french" Text="Les surplus (de bénéfice)" FontSize="20" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</StackPanel>

這是UserControl“句子”（我有問題的wrapPanel）

<UserControl x:Name="userControl" x:Class="Coran_seul.UC.UserControl_VerseInSurah"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:local="clr-namespace:Coran_seul.UC"
         mc:Ignorable="d" Margin="0,5,0,5" 
         >
<Border x:Name="Border_Verse"  >
    <StackPanel Orientation="Horizontal" x:Name="grid">
        <Label x:Name="Label_VersetNum"  Content="2" Height="{Binding ActualHeight, ElementName=WrapPanel_Mots, Mode=OneWay}" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" VerticalAlignment="Stretch" HorizontalAlignment="Left" MouseDown="Label_VersetNum_MouseDown"/>

        <WrapPanel   x:Name="WrapPanel_Mots" Width="{Binding ActualWidth, ElementName=userControl, Mode=OneWay}" />
    </StackPanel>
</Border>

問題 ：

現在我已經輸入了代碼，這是我的 wrapPanel 遇到的問題：

每行的最后一個單詞不會換行，即使它大于剩余空間（= 因此它在 wrapPanel 的邊緣被隱藏/切斷）

我再次有一個視頻來更好地解釋這個問題：

https://streamable.com/lpdf38

我不知道這是什么原因，我從昨天開始就拼命尋找不再有這個問題，因為知道包含所有 userControls 的 stackPanel 的右邊距為 20，因此它不會隱藏在滾動條后面。

請幫助我找到一個解決方案，以便將即使隱藏一個像素的單詞也包裹到下一行。

謝謝，

uj5u.com熱心網友回復：

問題是您將 WrapPanel 的 Width 系結到其 UserControl 父級的寬度，而沒有減去 Label 元素的 Width。

當您使用合適的 Panel 元素（例如 Grid 或 DockPanel 而不是 StackPanel）時，您根本不需要系結任何 Width。

<Border x:Name="Border_Verse">
    <DockPanel>
        <Label x:Name="Label_VersetNum" DockPanel.Dock="Left" .../>
        <WrapPanel x:Name="WrapPanel_Mots">
    </DockPanel>
</Border>

<Border x:Name="Border_Verse">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <Label x:Name="Label_VersetNum" Grid.Column="0" .../>
        <WrapPanel x:Name="WrapPanel_Mots" Grid.Column="1">
    </DockPanel>
</Border>

您也可以考慮使用 ItemsControl 來顯示一個句子。它將使用 WrapPanel 作為其 ItemsPanel，并在其 ItemTemplate 中使用單詞 UserControl：

<ItemsControl ItemsSource="{Binding Words}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
           <uc:UserControl_VerseInSurah/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

其中Words是視圖模型中單詞資料項物件的集合，即視圖中的物件DataContext。單詞 UserControl 中的兩個 TextBlock 會將它們的 Text 屬性系結到單詞資料項類上的適當屬性。

您甚至可能根本不需要 UserControl 這個詞，因為您可以簡單地將元素從其 XAML 移動到用作 ItemTemplate 的 DataTemplate 中。

有關詳細資訊，請參閱資料模板概述。

標籤：C＃ wpf 视窗 包装板

上一篇：如何在相同的WindowsForm實體之間傳遞變數值

下一篇：如何防止MenuStrip處理WinForms中的某些鍵？