WrapPanel孩子採取父母的全寬

Question

我有一個WrapPanel，一個按鈕和另一個WrapPanel內的兩個元素。該按鈕具有動態寬度。問題是子WrapPanel假定父WrapPanel的全部寬度，由於其左邊的按鈕而溢出到右邊。

<WrapPanel Height="200" VerticalAlignment="Top" Orientation="Vertical"> 
     <Button x:Name="BookCover" Click="ChangeImageFile" Margin="10"> 
      button style and content 
     </Button> 
     <WrapPanel Margin="10"> 
      <TextBox Text="New Book"></TextBox> 
      <TextBox Text="Lorem ipsum dolor sit amet, eos iusto graece consetetur cu, an dicam nonumy volutpat qui, usu at nullam alienum. Est suas autem augue ad, integre vituperatoribus quo id, delicata gloriatur pro ei. Vel at nisl decore, ut eum altera commune. Nec at agam menandri, putant insolens suavitate ei mei, ea possim veritus mea. Nec nemore iuvaret detracto at, quodsi consectetuer pri id. Integre suscipit voluptua no pro, nonumes incorrupte ut mea. Delenit democritum vel in, quem tale everti vim id, id vis melius necessitatibus. Paulo signiferumque per te. Cu mei modus exerci partiendo, ad iudico adolescens mea, et stet integre civibus mea." TextWrapping="Wrap"></TextBox> 
     </WrapPanel> 
    </WrapPanel> 

我怎樣才能使它適合窗口裏面？

Answer 1

正如我在評論說，你應該使用Grid像好：

<Window ...> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="Auto"/> <!--to fit to the content--> 
      <ColumnDefinition Width="*"/> <!--fill all the remaining--> 
     </Grid.ColumnDefinitions> 
     <Button x:Name="BookCover" Click="ChangeImageFile" Margin="10"> 
      button style and content 
     </Button> 
     <StackPanel Grid.Column="1" Margin="10"> 
      <TextBox Text="New Book"></TextBox> 
      <TextBox Text="Lorem ipsum dolor sit amet, eos iusto graece consetetur cu, an dicam nonumy volutpat qui, usu at nullam alienum. Est suas autem augue ad, integre vituperatoribus quo id, delicata gloriatur pro ei. Vel at nisl decore, ut eum altera commune. Nec at agam menandri, putant insolens suavitate ei mei, ea possim veritus mea. Nec nemore iuvaret detracto at, quodsi consectetuer pri id. Integre suscipit voluptua no pro, nonumes incorrupte ut mea. Delenit democritum vel in, quem tale everti vim id, id vis melius necessitatibus. Paulo signiferumque per te. Cu mei modus exerci partiendo, ad iudico adolescens mea, et stet integre civibus mea." TextWrapping="Wrap"></TextBox> 
     </StackPanel> 
    </Grid>  
</Window> 

結果：

Answer 2

該問題可能是由Orientation="Vertical"造成的。 根據MSDN, 如果Orientation屬性設置爲Horizo​​ntal，則子內容首先形成水平行，如果需要則形成垂直堆棧行。如果「方向」屬性設置爲「垂直」，則子內容首先位於垂直列中，如果沒有足夠的空間，則會發生纏繞並添加水平尺寸中的其他列。

此處您已將方向設置爲垂直，並且未將默認寬度設置爲Wrappanel。這會導致問題。包裝垂直髮生並導致子內容移出可見區域。 要麼爲wrappanel定義一個常量寬度，要麼適合窗口寬度，如：Width="{Binding ElementName=Window, Path=Width}"或嘗試考慮刪除Orientation="Vertical"。

編輯 我包括解決方案來解決您的問題。該方法是在內部父包裝中使用Grid，以將按鈕和內容之間的空間等分爲2個相等的列。檢查這是否有幫助。

<WrapPanel Height="200" 
      VerticalAlignment="Top" 
      Orientation="Vertical"> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition /> 
      <ColumnDefinition /> 
     </Grid.ColumnDefinitions> 
     <Button x:Name="BookCover" 
       Grid.Column="0" 
       Margin="10" 
       Click="ChangeImageFile"> 
      button style and content 
     </Button> 
     <WrapPanel Grid.Column="1" Margin="10"> 
      <TextBox Text="New Book" /> 
      <TextBox Text="Lorem ipsum dolor sit amet, eos iusto graece consetetur cu, an dicam nonumy volutpat qui, usu at nullam alienum. Est suas autem augue ad, integre vituperatoribus quo id, delicata gloriatur pro ei. Vel at nisl decore, ut eum altera commune. Nec at agam menandri, putant insolens suavitate ei mei, ea possim veritus mea. Nec nemore iuvaret detracto at, quodsi consectetuer pri id. Integre suscipit voluptua no pro, nonumes incorrupte ut mea. Delenit democritum vel in, quem tale everti vim id, id vis melius necessitatibus. Paulo signiferumque per te. Cu mei modus exerci partiendo, ad iudico adolescens mea, et stet integre civibus mea." TextWrapping="Wrap" /> 
     </WrapPanel> 
    </Grid> 
</WrapPanel>