none
Rotating sequence of data bound canvases RRS feed

  • Question

  • I've got an XML data set consisting of a variable number of lists, each with a number of elements.  I want to display list 1 in a canvas, then transition to list 2 (using an opacity fade, slide, or other transition effect), then list 3, and so on, and do this in an infinite loop.  I know how to do this in C# code, but I'm not sure how to do this in XAML.  Essentially I want to create a storyboard, then have an animation every 10 seconds that transitions out the current canvas and transitions in the next canvas.  

    I've managed to get a single list to display by binding my data to an ItemsControl with a DataTemplate.  I'm just not sure how to create the XAML to create several rotating canvases.

    Thanks in advance.

    Sunday, May 19, 2019 3:29 AM

All replies

  • I've got an XML data set consisting of a variable number of lists, each with a number of elements.  I want to display list 1 in a canvas, then transition to list 2 (using an opacity fade, slide, or other transition effect), then list 3, and so on, and do this in an infinite loop.  I know how to do this in C# code, but I'm not sure how to do this in XAML.  Essentially I want to create a storyboard, then have an animation every 10 seconds that transitions out the current canvas and transitions in the next canvas.  

    I've managed to get a single list to display by binding my data to an ItemsControl with a DataTemplate.  I'm just not sure how to create the XAML to create several rotating canvases.

    Thanks in advance.

    Hi Magneto_9102,

    According to your description, I am not sure what you want to do, you said that you know how to do this in C#, can you provide some code about this?

    About rotating, I suggest you can take a look:

    https://docs.microsoft.com/en-us/dotnet/framework/wpf/graphics-multimedia/how-to-rotate-an-object

    Best Regards,

    Cherry


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    Monday, May 20, 2019 5:17 AM
    Moderator
  • Here's an example without any effects.  I'm binding to a dataset, then displaying 10 items every 5 seconds.  Is there a way to do this in XAML?

    using System;
    using System.Collections;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Threading.Tasks;
    using System.Windows.Controls;
    using System.Windows.Threading;

    namespace WpfApplication10
    {
        public class RotatingItemsControl : ItemsControl
        {
            private DispatcherTimer _timer;
            public int RowCount { get; set; } = 10;
            public int Interval { get; set; } = 5000;
            int _position = 0;

            List<object>  _source;
            public RotatingItemsControl()
            {
                this.Loaded += RotatingItemsControl_Loaded;
                this.Unloaded += RotatingItemsControl_Unloaded;
            }

            private void RotatingItemsControl_Unloaded(object sender, System.Windows.RoutedEventArgs e)
            {
                this.Loaded -= RotatingItemsControl_Loaded;
                this.Unloaded -= RotatingItemsControl_Unloaded;
                if (_timer != null)
                {
                    _timer.IsEnabled = false;
                    _timer.Tick -= T_Tick;
                    _timer = null;
                }
            }

            private void RotatingItemsControl_Loaded(object sender, System.Windows.RoutedEventArgs e)
            {
                _source = (this.ItemsSource as IEnumerable<object>).ToList();
                SetBinding();
                if (_source.Count > RowCount)
                {
                    _timer = new DispatcherTimer() { Interval = TimeSpan.FromMilliseconds(Interval) };
                    _timer.Tick += T_Tick;               
                    _timer.Start();
                }

            }

            private void SetBinding()
            {
                this.ItemsSource = _source.Skip(_position).Take(RowCount);
                _position = (_position + RowCount) % _source.Count;

            }

            private void T_Tick(object sender, EventArgs e)
            {
                SetBinding();
            }
        }
    }

    Monday, May 20, 2019 12:38 PM
  • Hi Magneto_9102,

    According to your code, you customize itemscontrol, and want to display 10 row data in a period of time, am I right?  

    Firstly, you have one collection that contains many data, you also need to create new observablecollection to get the changed data,you can bind this observablecollection to Itemscontrol, after a while, you can change the data in observablecollection, now you can see the itemscontrol display different 10 row data.

    Best Reagdrs,

    Cherry


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    Friday, May 24, 2019 9:36 AM
    Moderator