使用按钮WPF滚动ListBox
如何使用WPF中的按钮按部分滚动？
我有下一个ListBox：
我需要左边的每个箭头（按钮）和正确执行滚动操作（后退和下一步）
这是我的ListBox代码（因为按钮代码不是那么重要，我只是粘贴ListBox代码）
<ListBox Grid.Column="1" Grid.Row="1" Name="CategoriesListBox" ScrollViewer.VerticalScrollBarVisibility="Disabled" ScrollViewer.HorizontalScrollBarVisibility="Hidden" Background="#00FFFFFF" BorderBrush="{x:Null}">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Rows="2" VerticalAlignment="Center" Background="#00FFFFFF"/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="Focusable" Value="False"/>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<Button Height="{Binding ElementName=DummyGrid, Path=ActualHeight}" Width="{Binding ElementName=DummyGrid, Path=ActualWidth}" Margin="2">
<Button.Content>
<Viewbox Stretch="Uniform" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<TextBlock Foreground="White" FontFamily="/BundyPOS;component/Fonts/#HelveticaRounded" TextAlignment="Center" Margin="7" Text="{Binding a}"></TextBlock>
</Viewbox>
</Button.Content>
<Button.Style>
<Style TargetType="{x:Type Button}">
<Setter Property="Background" Value="{Binding color}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border CornerRadius="15" BorderBrush="White" BorderThickness="2,2,2,2" Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="#3cb878"/>
<Setter Property="Foreground" Value="Black"/>
</Trigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
我无法执行ListBox.ScrollIntoView(categoryItem[position]);因为ListBox每行可能有不同的行或值。有没有像＆＃34; scrollToHorizontalOffset＆＃34;？
1 个答案:
答案 0 :(得分：1)
试试这个代码..这是一个参考
在wpf中创建一个像这样的窗口......
<Window x:Class="AutoScrollListBox.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:AutoScrollListBox"
Title="AutoScrollListBox" Height="600" Width="800" WindowStartupLocation="CenterScreen"
>
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="AutoScrollListBoxDictionary.xaml"/>
</ResourceDictionary.MergedDictionaries>
<LinearGradientBrush x:Key="EquipmentItemBackground" EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FF223B84" Offset="1"/>
<GradientStop Color="#FF4B94EC" Offset="0.7"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="EquipmentItemSelectedBackground" EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FF1C9B37" Offset="1"/>
<GradientStop Color="#FF26DE2C" Offset="0.7"/>
</LinearGradientBrush>
<DataTemplate DataType="{x:Type local:EquipmentItem}" >
<Border x:Name="Border" BorderBrush="Black" BorderThickness="1" CornerRadius="4" Width="84" Height="68"
VerticalAlignment="Center" HorizontalAlignment="Center" Padding="1"
Background="{StaticResource EquipmentItemBackground}">
<StackPanel >
<TextBlock Text="{Binding Name}" Foreground="White" FontSize="12" TextAlignment="Left"
VerticalAlignment="Center" HorizontalAlignment="Center" Margin="5"/>
<TextBlock Text="{Binding CampaignName}"
Foreground="White"
FontSize="12"
TextAlignment="Left"
VerticalAlignment="Center" HorizontalAlignment="Center" Margin="5"/>
</StackPanel>
</Border>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}}}" Value="True" >
<Setter TargetName="Border" Property="Background" Value="{StaticResource EquipmentItemSelectedBackground}" />
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</ResourceDictionary>
</Window.Resources>
<Grid>
<TabControl Margin="0" Name="tabControl1" VerticalAlignment="Stretch">
<TabItem Header="Horizontal ListBox" >
<StackPanel>
<ListBox x:Name="horizontalListBox" SelectionMode="Extended"
Style="{ StaticResource ListBoxWithAutoScroll_Horizontal }"
Selector.SelectionChanged="horizontalListBox_SelectionChanged">
</ListBox>
<ListBox x:Name="horizontalSelectedItemsListBox" Height="100"
Style="{StaticResource ListBoxWithAutoScroll_Horizontal}"
>
</ListBox>
</StackPanel>
</TabItem>
<TabItem Header="Vertical ListBox" >
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
<ListBox x:Name="verticalListBox" SelectionMode="Extended"
Style="{StaticResource ListBoxWithAutoScroll_Vertical}"
Selector.SelectionChanged="verticalListBox_SelectionChanged">
</ListBox>
<ListBox x:Name="verticalSelectedItemsListBox" Width="100"
Style="{StaticResource ListBoxWithAutoScroll_Vertical}"
ItemContainerStyle="{StaticResource CustomListBoxItem}"
>
</ListBox>
</StackPanel>
</TabItem>
</TabControl>
</Grid>
查看上面窗口的cs代码
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Collections.ObjectModel;
namespace AutoScrollListBox
{
public partial class MainWindow : Window
{
ObservableCollection<EquipmentItem> m_selectedEquipmentHorizontal = new ObservableCollection<EquipmentItem>();
ObservableCollection<EquipmentItem> m_selectedEquipmentVertical = new ObservableCollection<EquipmentItem>();
public MainWindow()
{
InitializeComponent();
}
protected override void OnInitialized( EventArgs e )
{
base.OnInitialized( e );
ObservableCollection<EquipmentItem> equipmentList1 = new ObservableCollection<EquipmentItem>();
this.horizontalListBox.ItemsSource = equipmentList1;
CreateEquipments( equipmentList1, "Tank-" );
this.horizontalSelectedItemsListBox.ItemsSource = m_selectedEquipmentHorizontal;
ObservableCollection<EquipmentItem> equipmentList2 = new ObservableCollection<EquipmentItem>();
this.verticalListBox.ItemsSource = equipmentList2;
CreateEquipments( equipmentList2, "Tank-" );
this.verticalSelectedItemsListBox.ItemsSource = m_selectedEquipmentVertical;
}
private ObservableCollection<EquipmentItem> CreateEquipments( ObservableCollection<EquipmentItem> equipmentList, string prefix )
{
int maxItemCount = 20;
for( int i = 0; i < maxItemCount; i++ )
{
equipmentList.Add( new EquipmentItem() { Name = prefix + i.ToString(), CampaignName = "Batch_ " + i.ToString() } );
}
return equipmentList;
}
private void horizontalListBox_SelectionChanged( object sender, SelectionChangedEventArgs e )
{
if( e.AddedItems.Count > 0 )
{
foreach( EquipmentItem item in e.AddedItems )
{
m_selectedEquipmentHorizontal.Add( item );
}
}
if( e.RemovedItems.Count > 0 )
{
foreach( EquipmentItem item in e.RemovedItems )
{
m_selectedEquipmentHorizontal.Remove( item );
}
}
}
private void verticalListBox_SelectionChanged( object sender, SelectionChangedEventArgs e )
{
if( e.AddedItems.Count > 0 )
{
foreach( EquipmentItem item in e.AddedItems )
{
m_selectedEquipmentVertical.Add( item );
}
}
if( e.RemovedItems.Count > 0 )
{
foreach( EquipmentItem item in e.RemovedItems )
{
m_selectedEquipmentVertical.Remove( item );
}
}
}
}
}
然后为Window的更改样式创建一个ResourceDirectory，就像这样
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<!-- Fill Brushes -->
<SolidColorBrush x:Key="NormalBrush" Color="#FFCCCCCC"/>
<SolidColorBrush x:Key="PressedBrush" Color="#FFEEEEEE"/>
<SolidColorBrush x:Key="DisabledForegroundBrush" Color="#888" />
<!-- Border Brushes -->
<LinearGradientBrush x:Key="NormalBorderBrush" StartPoint="0,0" EndPoint="0,1">
<GradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Color="#CCC" Offset="0.0"/>
<GradientStop Color="#444" Offset="1.0"/>
</GradientStopCollection>
</GradientBrush.GradientStops>
</LinearGradientBrush>
<Style x:Key="ScrollBarLineButton" TargetType="{x:Type RepeatButton}">
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="Focusable" Value="false"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Border Name="Border" CornerRadius="2" Background="{StaticResource NormalBrush}"
BorderBrush="{StaticResource NormalBorderBrush}" >
<Path HorizontalAlignment="Center" VerticalAlignment="Center" Fill="Gray"
Data="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}"
Opacity="{Binding Path=Opacity, RelativeSource={RelativeSource TemplatedParent}}" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsPressed" Value="true">
<Setter TargetName="Border" Property="Background" Value="{StaticResource PressedBrush}" />
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ScrollBarPageButton" TargetType="{x:Type RepeatButton}">
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="IsTabStop" Value="false"/>
<Setter Property="Focusable" Value="false"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Border Background="Transparent" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ScrollBarThumb" TargetType="{x:Type Thumb}">
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="IsTabStop" Value="false"/>
<Setter Property="Focusable" Value="false"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Thumb}">
<Border CornerRadius="2" Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="CustomListBoxItem" TargetType="{x:Type ListBoxItem}">
<Setter Property="SnapsToDevicePixels" Value="true"/>
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Border Name="Border" Padding="1" SnapsToDevicePixels="true">
<ContentPresenter />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!--listBoxWithAutoScroll_Horizontal-->
<Style x:Key="ListBoxWithAutoScroll_Horizontal" TargetType="{x:Type ListBox}" >
<Setter Property="SnapsToDevicePixels" Value="true"/>
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
<Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="ItemContainerStyle" Value="{StaticResource CustomListBoxItem}"/>
<Setter Property="Template">
<Setter.Value >
<ControlTemplate>
<Grid >
<ScrollViewer x:Name="scrollviewer" >
<ScrollViewer.Template>
<ControlTemplate TargetType="{x:Type ScrollViewer}" >
<Grid>
<ScrollBar x:Name="PART_HorizontalScrollBar" Orientation="Horizontal"
Value="{TemplateBinding HorizontalOffset}"
Maximum="{TemplateBinding ScrollableWidth}"
ViewportSize="{TemplateBinding ViewportWidth}"
Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
Height="{Binding Height, ElementName=Panel}">
<ScrollBar.Template>
<ControlTemplate>
<Track x:Name="PART_Track">
<Track.DecreaseRepeatButton>
<RepeatButton Command="ScrollBar.PageLeftCommand"
Style="{StaticResource ScrollBarPageButton}"/>
</Track.DecreaseRepeatButton>
<Track.IncreaseRepeatButton>
<RepeatButton Command="ScrollBar.PageRightCommand"
Style="{StaticResource ScrollBarPageButton}"/>
</Track.IncreaseRepeatButton>
<Track.Thumb>
<Thumb Style="{StaticResource ScrollBarThumb}"
Background="Gray" Opacity="0.8" Margin="0,-1" />
</Track.Thumb>
</Track>
</ControlTemplate>
</ScrollBar.Template>
</ScrollBar>
<ScrollContentPresenter Margin="0,2" Height="Auto" VerticalAlignment="Center"/>
</Grid>
</ControlTemplate>
</ScrollViewer.Template>
<ItemsPresenter/>
</ScrollViewer>
<Grid x:Name="Panel" Margin="0,2" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<RepeatButton x:Name="LineLeftButton" Grid.Column="0" Width="20" Opacity="0" Visibility="Collapsed"
Style="{StaticResource ScrollBarLineButton}"
Content="M 8 0 L 8 32 L 0 16 Z"
Command="{x:Static ScrollBar.LineLeftCommand}"
CommandTarget="{Binding ElementName=scrollviewer}"
ClickMode="Hover" />
<RepeatButton x:Name="LineRightButton" Grid.Column="2" Width="20" Opacity="0" Visibility="Collapsed"
Style="{StaticResource ScrollBarLineButton}"
Content="M 0 0 L 8 16 L 0 32 Z"
Command="{x:Static ScrollBar.LineRightCommand}"
CommandTarget="{Binding ElementName=scrollviewer}"
ClickMode="Hover"/>
</Grid>
</Grid>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True"/>
<Condition Property="ComputedHorizontalScrollBarVisibility" SourceName="scrollviewer" Value="Visible"/>
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter TargetName="LineLeftButton" Property="Visibility" Value="Visible" />
<Setter TargetName="LineRightButton" Property="Visibility" Value="Visible" />
</MultiTrigger.Setters>
<MultiTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="LineLeftButton"
Storyboard.TargetProperty="Opacity" To="0.8" Duration="0:0:0.25"/>
<DoubleAnimation Storyboard.TargetName="LineRightButton"
Storyboard.TargetProperty="Opacity" To="0.8" Duration="0:0:0.25"/>
</Storyboard>
</BeginStoryboard>
</MultiTrigger.EnterActions>
<MultiTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="LineLeftButton"
Storyboard.TargetProperty="Opacity" To="0" Duration="0:0:0.25"/>
<DoubleAnimation Storyboard.TargetName="LineRightButton"
Storyboard.TargetProperty="Opacity" To="0" Duration="0:0:0.25"/>
</Storyboard>
</BeginStoryboard>
</MultiTrigger.ExitActions>
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="ItemsPanel">
<Setter.Value >
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</Setter.Value>
</Setter>
</Style>
<!--listBoxWithAutoScroll_Vertical-->
<Style x:Key="ListBoxWithAutoScroll_Vertical" TargetType="{x:Type ListBox}" >
<Setter Property="SnapsToDevicePixels" Value="true"/>
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
<Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="ItemContainerStyle" Value="{StaticResource CustomListBoxItem}"/>
<Setter Property="Template">
<Setter.Value >
<ControlTemplate>
<Grid >
<ScrollViewer x:Name="scrollviewer" >
<ScrollViewer.Template>
<ControlTemplate TargetType="{x:Type ScrollViewer}" >
<Grid>
<ScrollBar x:Name="PART_VerticalScrollBar" Orientation="Vertical"
Value="{TemplateBinding VerticalOffset}"
Maximum="{TemplateBinding ScrollableHeight}"
ViewportSize="{TemplateBinding ViewportHeight}"
Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
Width="{Binding Width, ElementName=Panel}">
<ScrollBar.Template>
<ControlTemplate>
<Track x:Name="PART_Track" IsDirectionReversed="True">
<Track.DecreaseRepeatButton>
<RepeatButton Command="ScrollBar.PageUpCommand"
Style="{StaticResource ScrollBarPageButton}"/>
</Track.DecreaseRepeatButton>
<Track.IncreaseRepeatButton>
<RepeatButton Command="ScrollBar.PageDownCommand"
Style="{StaticResource ScrollBarPageButton}"/>
</Track.IncreaseRepeatButton>
<Track.Thumb>
<Thumb Style="{StaticResource ScrollBarThumb}"
Background="Gray" Opacity="0.8" Margin="-1,0" />
</Track.Thumb>
</Track>
</ControlTemplate>
</ScrollBar.Template>
</ScrollBar>
<ScrollContentPresenter Margin="2,0" Width="Auto" HorizontalAlignment="Center"/>
</Grid>
</ControlTemplate>
</ScrollViewer.Template>
<ItemsPresenter/>
</ScrollViewer>
<Grid x:Name="Panel" Margin="2,0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<RepeatButton x:Name="LineUpButton" Grid.Row="0" Height="20" Opacity="0" Visibility="Collapsed"
Style="{StaticResource ScrollBarLineButton}"
Content="M 0 8 L 32 8 L 16 0 Z"
Command="{x:Static ScrollBar.LineUpCommand}"
CommandTarget="{Binding ElementName=scrollviewer}"
ClickMode="Hover" />
<RepeatButton x:Name="LineDownButton" Grid.Row="2" Height="20" Opacity="0" Visibility="Collapsed"
Style="{StaticResource ScrollBarLineButton}"
Content="M 0 0 L 16 8 L 32 0 Z"
Command="{x:Static ScrollBar.LineDownCommand}"
CommandTarget="{Binding ElementName=scrollviewer}"
ClickMode="Hover"/>
</Grid>
</Grid>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True"/>
<Condition Property="ComputedVerticalScrollBarVisibility" SourceName="scrollviewer" Value="Visible"/>
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter TargetName="LineUpButton" Property="Visibility" Value="Visible" />
<Setter TargetName="LineDownButton" Property="Visibility" Value="Visible" />
</MultiTrigger.Setters>
<MultiTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="LineUpButton"
Storyboard.TargetProperty="Opacity" To="0.8" Duration="0:0:0.25"/>
<DoubleAnimation Storyboard.TargetName="LineDownButton"
Storyboard.TargetProperty="Opacity" To="0.8" Duration="0:0:0.25"/>
</Storyboard>
</BeginStoryboard>
</MultiTrigger.EnterActions>
<MultiTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="LineUpButton"
Storyboard.TargetProperty="Opacity" To="0" Duration="0:0:0.25"/>
<DoubleAnimation Storyboard.TargetName="LineDownButton"
Storyboard.TargetProperty="Opacity" To="0" Duration="0:0:0.25"/>
</Storyboard>
</BeginStoryboard>
</MultiTrigger.ExitActions>
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="ItemsPanel">
<Setter.Value >
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Vertical"/>
</ItemsPanelTemplate>
</Setter.Value>
</Setter>
</Style>
您可以使用Binding.So将项目添加到ListBox中，为其创建一个类。
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
namespace AutoScrollListBox
{
public class EquipmentItem
{
public string Name { get; set; }
public string CampaignName { get; set; }
public string ImagePath { get; set; }
}
}
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？