WPF中水平垂直WrapPanel

Question

我尝试使用垂直按钮构建包装面板。 每个按钮由图像和文本块组成。 我想做一些微软在窗口左侧的Outlook中执行的操作，当用户移动GridSplitter时，窗口左边的是 。 当用户将降低包装面板的高度时，如果有任何按钮将不存在，则文本块将消失（该按钮将仅由图像组成）。

我该怎么做。

感谢

Answer 1

如果我理解正确。您想要显示具有文字和图像的按钮，但是如果按钮的宽度缩小到一定大小，则只会显示图像。

如果是这样，你应该能够用数据触发器来实现。

<Window x:Class="StackOverflow1.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="clr-namespace:StackOverflow1" 
    Title="MainWindow" Height="350" Width="525"> 
<Window.Resources> 
    <local:isLessThanConverter x:Key="MyisLessThanConverter"/> 
    <Style x:Key="myWidthTrigger" TargetType="TextBlock"> 
      <Style.Triggers> 
       <DataTrigger Binding="{Binding Path=ActualWidth, RelativeSource={RelativeSource AncestorType=Button}, Converter={StaticResource MyisLessThanConverter}, ConverterParameter=90}" Value="True"> 
        <Setter Property="Visibility" Value="Collapsed" /> 
       </DataTrigger> 
     </Style.Triggers> 
    </Style> 
</Window.Resources> 
<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"></ColumnDefinition> 
     <ColumnDefinition Width="Auto"></ColumnDefinition> 
     <ColumnDefinition Width="*"></ColumnDefinition> 
    </Grid.ColumnDefinitions> 
    <ListView HorizontalContentAlignment="Stretch"> 
     <Button x:Name="myButton" Width="Auto"> 
      <StackPanel Orientation="Horizontal"> 
       <TextBlock x:Name="MyTextBlock" Style="{StaticResource myWidthTrigger}" Text="Test"></TextBlock> 
       <Image Source="image.png" Height="15"></Image> 
      </StackPanel> 
     </Button> 
    </ListView> 
    <GridSplitter Width="5" Grid.Column="1" ResizeDirection="Columns" ResizeBehavior="PreviousAndNext"></GridSplitter> 
</Grid> 

也是用这个IValueConvertor：

[ValueConversion(typeof(double), typeof(string))] 
public class isLessThanConverter : IValueConverter 
{ 
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
      if ((double)value < double.Parse((string)parameter)) 
      { 
       return true; 
      } 
      else 
      { 
       return false; 
      } 

    } 

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
     throw new NotImplementedException(); 
    } 

} 

我不是这方面的专家，所以有可能是一个更清洁的方式。我也使用了一个列表视图，而不是你所请求的wrappanel。

希望这会有帮助

Answer 2

这听起来像你想使用什么是Expander控制。这个StackOverflow post解释了如何在打开另一个时自动关闭其他Expander。这将像你在Outlook中描述的那样工作。