1

How can i scroll by sections using buttons in WPF?

I have the next ListBox:

enter image description here

I need each arrow (buttons) from left & right to perform the scroll action (back & next)

Here is my code of the ListBox (since the code of the buttons are not so important i am just pasting the ListBox code)

<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>

I cant perform ListBox.ScrollIntoView(categoryItem[position]); because the ListBox could have different row or values per row. Is there any function like "scrollToHorizontalOffset"?

Improve this question

1 Answer 1

Reset to default
1

Try this code..It is a referance

Create a Window in wpf like this...

<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>

Look the cs code of above window

  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 );
            }
        }
    }

    }
  }

Then Create a ResourceDirectory for change style of Window, like this

<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>

You can add items into the ListBox using Binding.So, create a class for it.

    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; }
         }
     }
Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.