animate listbox items to scroll

Question

how to animate listbox items to scroll and fade out

Answer 1

Can you give some more details

Answer 2

i have a small project i'm working on thats Similar to the RSS Feeder in the Vista SideBar...So the Question is where can i get a good example for Scrolling the RSS Feeds Upon the ListBox being Populated??

As of right now my project just uses a Veritcal ScrollBar,i want it to Auto Scroll on its own as the Feeds are Feed into the project,and have a Fading appearance,as the Feeds reach the top of the ListBox

Right now i use the following which scrolls the entire list box. I need to scroll only the items inside the listbox and to fade it out on reaching the top of the listbox.

<DataTemplate x:Key="dt1">
<TextBlock Height="30">
<TextBlock Text="{Binding}"/>
</Hyperlink>
</TextBlock>
</DataTemplate>
</Window.Resources>

<Canvas Width="150" Height="200">
<ListBox Name="list1" Width="150" Height="200" BorderBrush="{x:Null}" ItemTemplate="{StaticResource dt1}" ScrollViewer.CanContentScroll="True" ScrollViewer.VerticalScrollBarVisibility="Hidden">

<ListBox.Style>
<Style>
<Style.Triggers>
<EventTrigger RoutedEvent="ListBox.Loaded">
<EventTrigger.Actions>
<BeginStoryboard Name="MyBeginStoryboard">
<Storyboard Storyboard.TargetProperty="(Canvas.Top)">
<DoubleAnimation From ="220" To ="-250" RepeatBehavior="Forever" Duration="0:0:5"></DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
<EventTrigger RoutedEvent="ListBox.MouseMove">
<EventTrigger.Actions>
<PauseStoryboard BeginStoryboardName="MyBeginStoryboard" />
</EventTrigger.Actions>
</EventTrigger>
<EventTrigger RoutedEvent="ListBox.MouseLeave">
<EventTrigger.Actions>
<ResumeStoryboard BeginStoryboardName="MyBeginStoryboard" />
</EventTrigger.Actions>
</EventTrigger>
</Style.Triggers>
</Style>
</ListBox.Style>
</ListBox>
</Canvas>

Thanks lee d

 

Answer 3

If you bind the ListBox to an ObservableCollection<Whatever> then you can hook it's CollectionChanged event.  In that event handler, if you notice that an item was added to the collection, call ScrollIntoView on the ListBox, passing in the new item.

Answer 4

you can try using a timer

System.Windows.Threading.DispatcherTimer timer = new System.Windows.Threading.DispatcherTimer();

<DataTemplate x:Key="dt1">

<TextBlock Text="{Binding}" Height="30"></TextBlock>

</DataTemplate>

<Canvas>

<ListBox Name="list1" ItemTemplate="{StaticResource dt1}" Height="77" ScrollViewer.VerticalScrollBarVisibility="Hidden" Canvas.Left="100" Canvas.Top="200">

</ListBox>

</Canvas>

void Window2_Loaded(object sender, RoutedEventArgs e)

        {

            for (int i = 0; i < 10; i++)

                list1.Items.Add(" Item ....." + i.ToString());

 

            timer.Interval = TimeSpan.FromSeconds(3);

            timer.Tick += new EventHandler(timer_Tick);

            timer.Start();

        }

        int index = 0;

        void timer_Tick(object sender, EventArgs e)

        {

            if (index >= list1.Items.Count)

                index = 0;

         

            list1.ScrollIntoView(list1.Items[index]);

            index += 3;

        }

you can make the items to be hyperlinks( http://forums.microsoft.com/MSDN/ShowPost.aspx?PostID=786543&SiteID=1 )

you can template the listbox to have 2 buttons, when clicked will effectively call the logic to do the samething as timer_tick

Answer 5

ScrollIntoView will provide some functionality, but if you want better control over how the text animates, its speed, direction, etc you might consider creating a small animation framework for your elements. It's fairly simple to create some animated scrolling control containers that will scroll any elements inside of it. I created one called ScrollingCanvas Container which you can find an example and source code for over at xamlXaml.com: http://xamlxaml.com/2006/09/27/scroll-text-and-almost-anything-else-with-the-scrollingcanvas-container/

Michael G. Emmons
http://xamlXaml.com