如何根据 window 大小有选择地启用和禁用滚动按钮
How to selectively enable and disable scroll button based on window size
我正在尝试制作一个滚动查看器,其中滚动按钮仅在 window 尺寸太小而无法显示所有内容时可见。我已将一些按钮放入滚动查看器中的堆栈面板中。
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="20"/>
<RowDefinition Height="*"/>
<RowDefinition Height="20"/>
<RowDefinition/>
</Grid.RowDefinitions>
<RepeatButton x:Name="LineLeftButton"
Grid.Column="0"
Grid.Row="0"
Command="{x:Static ScrollBar.LineDownCommand}"
Background="{StaticResource uparrow}"
CommandTarget="{Binding ElementName=scrollViewer}"/>
<RepeatButton x:Name="LineRightButton"
Grid.Column="0"
Grid.Row="2"
Background="{StaticResource downarrow}"
Command="{x:Static ScrollBar.LineUpCommand}"
CommandTarget="{Binding ElementName=scrollViewer}"/>
<ScrollViewer Grid.Column="1" Grid.Row="1" x:Name="scrollViewer"
VerticalScrollBarVisibility="Hidden"
HorizontalScrollBarVisibility="Hidden">
<StackPanel Orientation="Vertical">
<Button Width="150" Height="20"/>
<Button Width="150" Height="20"/>
<Button Width="150" Height="20"/>
<Button Width="150" Height="20"/>
<Button Width="150" Height="20"/>
<Button Width="150" Height="20"/>
<Button Width="150" Height="20"/>
</StackPanel>
</ScrollViewer>
</Grid>
滚动正在工作 kk 但是当堆栈中没有足够的元素以至于不需要滚动时如何禁用它?
您可以像下面这样创建一个转换器
public class MyConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
if (value is double)
{
return ((double)value < 140) ? Visibility.Visible : Visibility.Collapsed;
}
return Visibility.Collapsed;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
其中 140 是所需的总高度(您可以将此参数动态化)。然后你只需要绑定按钮的可见性
<RepeatButton x:Name="LineRightButton"
Visibility="{Binding ActualHeight, Converter={StaticResource MyConv}, ElementName=scrollViewer, Mode=OneWay}"
Grid.Column="0"
Grid.Row="2"
Background="{StaticResource downarrow}"
Command="{x:Static ScrollBar.LineUpCommand}"
CommandTarget="{Binding ElementName=scrollViewer}"/>
你只需要在你的资源中定义上面提到的转换器就可以了
编辑 解决方案编号 2,具有多重绑定:
如果您想避免对按钮的总高度进行硬编码,您可以使用多值转换器和多绑定
public class MyConverter : IMultiValueConverter
{
public object Convert(object[] value, Type targetType, object parameter, CultureInfo culture)
{
if (value[0] is double && value[1] is double)
{
return ((double)value[0] < (double)value[1]) ? Visibility.Visible : Visibility.Collapsed;
}
return Visibility.Collapsed;
}
public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
并以这种方式修改您的按钮
<RepeatButton x:Name="LineRightButton"
Grid.Column="0"
Grid.Row="2"
Background="Black"
Command="{x:Static ScrollBar.LineUpCommand}"
CommandTarget="{Binding ElementName=scrollViewer}">
<RepeatButton.Visibility>
<MultiBinding Converter="{StaticResource MyConv}">
<Binding Path="ActualHeight" ElementName="scrollViewer"/>
<Binding Path="ActualHeight" ElementName="test"/>
</MultiBinding>
</RepeatButton.Visibility>
</RepeatButton>
其中“test 是包含按钮的堆栈面板的名称
我正在尝试制作一个滚动查看器,其中滚动按钮仅在 window 尺寸太小而无法显示所有内容时可见。我已将一些按钮放入滚动查看器中的堆栈面板中。
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="20"/>
<RowDefinition Height="*"/>
<RowDefinition Height="20"/>
<RowDefinition/>
</Grid.RowDefinitions>
<RepeatButton x:Name="LineLeftButton"
Grid.Column="0"
Grid.Row="0"
Command="{x:Static ScrollBar.LineDownCommand}"
Background="{StaticResource uparrow}"
CommandTarget="{Binding ElementName=scrollViewer}"/>
<RepeatButton x:Name="LineRightButton"
Grid.Column="0"
Grid.Row="2"
Background="{StaticResource downarrow}"
Command="{x:Static ScrollBar.LineUpCommand}"
CommandTarget="{Binding ElementName=scrollViewer}"/>
<ScrollViewer Grid.Column="1" Grid.Row="1" x:Name="scrollViewer"
VerticalScrollBarVisibility="Hidden"
HorizontalScrollBarVisibility="Hidden">
<StackPanel Orientation="Vertical">
<Button Width="150" Height="20"/>
<Button Width="150" Height="20"/>
<Button Width="150" Height="20"/>
<Button Width="150" Height="20"/>
<Button Width="150" Height="20"/>
<Button Width="150" Height="20"/>
<Button Width="150" Height="20"/>
</StackPanel>
</ScrollViewer>
</Grid>
滚动正在工作 kk 但是当堆栈中没有足够的元素以至于不需要滚动时如何禁用它?
您可以像下面这样创建一个转换器
public class MyConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
if (value is double)
{
return ((double)value < 140) ? Visibility.Visible : Visibility.Collapsed;
}
return Visibility.Collapsed;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
其中 140 是所需的总高度(您可以将此参数动态化)。然后你只需要绑定按钮的可见性
<RepeatButton x:Name="LineRightButton"
Visibility="{Binding ActualHeight, Converter={StaticResource MyConv}, ElementName=scrollViewer, Mode=OneWay}"
Grid.Column="0"
Grid.Row="2"
Background="{StaticResource downarrow}"
Command="{x:Static ScrollBar.LineUpCommand}"
CommandTarget="{Binding ElementName=scrollViewer}"/>
你只需要在你的资源中定义上面提到的转换器就可以了
编辑 解决方案编号 2,具有多重绑定:
如果您想避免对按钮的总高度进行硬编码,您可以使用多值转换器和多绑定
public class MyConverter : IMultiValueConverter
{
public object Convert(object[] value, Type targetType, object parameter, CultureInfo culture)
{
if (value[0] is double && value[1] is double)
{
return ((double)value[0] < (double)value[1]) ? Visibility.Visible : Visibility.Collapsed;
}
return Visibility.Collapsed;
}
public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
并以这种方式修改您的按钮
<RepeatButton x:Name="LineRightButton"
Grid.Column="0"
Grid.Row="2"
Background="Black"
Command="{x:Static ScrollBar.LineUpCommand}"
CommandTarget="{Binding ElementName=scrollViewer}">
<RepeatButton.Visibility>
<MultiBinding Converter="{StaticResource MyConv}">
<Binding Path="ActualHeight" ElementName="scrollViewer"/>
<Binding Path="ActualHeight" ElementName="test"/>
</MultiBinding>
</RepeatButton.Visibility>
</RepeatButton>
其中“test 是包含按钮的堆栈面板的名称