This example shows how to configure the transition effects in ContentTransition.
Example
Description
ContentTransition is an advanced content control that allow you to add interactive visual transition when a new object is assigned to the content of the control The transition effect will appear when the content of the ContentTransition is changed.
The following code shows the content of ContentTransition will be changed every three second. The ContentTransition will be using default transition effect with 0.7 second as the TransitionDuration.
Code
| XAML |  Copy Code |
|---|---|
<Grid x:Name="LayoutRoot"> <Intersoft:ContentTransition Height="200" HorizontalAlignment="Left" Name="contentTransition1" VerticalAlignment="Top" Width="200" TransitionDuration="0.7"> <Image Source="/ClientUIApplication1;component/Images/Application_and_Software_1.jpg"></Image> </Intersoft:ContentTransition> </Grid> |
|
| C# | Copy Code |
|---|---|
public partial class Transition : UXPage { DispatcherTimer dt; private int CurrentIndex { get; set; } static readonly List<string> Images = new List<string>() { "Application_and_Software_1.jpg", "Application_and_Software_2.jpg", "Computer_programming_1.jpg", "Computer_programming_2.jpg", "Computer_science_1.jpg" }; public Transition() { dt = new DispatcherTimer(); CurrentIndex = 1; InitializeComponent(); //Define the event that will occur at timer tick dt.Tick += new EventHandler(ChangeImage); //Set the timer interval dt.Interval = TimeSpan.FromSeconds(3); //strat the timer dt.Start(); } void ChangeImage(object sender, EventArgs e) { Image newImage= new Image(); newImage.Source = new BitmapImage( new Uri("/ClientUIApplication1;component/Images/" + Images[CurrentIndex], UriKind.RelativeOrAbsolute)); contentTransition1.Content = newImage; if (CurrentIndex == 4) CurrentIndex = 0; else CurrentIndex++; } } |
|