我正在尝试从代码隐藏中在我的应用程序中执行随机的平铺翻转动画。计时器应该使ranodom磁贴每3秒翻转一次。我一直在网上搜索如何执行这样的动画，但我似乎找不到任何有用的东西。
视图如下所示，其中一个容器视图保存了两个应该互相翻转的视图。一个是图像，另一个视图是两个文本块
//Create single news container
Canvas container = new Canvas
{
Height = viewHeight,
Width = viewWidth,
MaxWidth = viewWidth,
MaxHeight = viewHeight,
Margin = new Thickness(viewX, viewY, 0, 0)
};
//Create image container
Canvas imageContainer = new Canvas
{
Height = viewHeight,
Width = viewWidth,
MaxWidth = viewWidth,
MaxHeight = viewHeight,
Background = new SolidColorBrush(Colors.Transparent),
Visibility = Visibility.Collapsed
};
//Create title and leadtext container
Canvas textContainer = new Canvas
{
Height = viewHeight,
Width = viewWidth,
MaxWidth = viewWidth,
MaxHeight = viewHeight,
Background = GetCategoryColor(news.Cat[0]),
Visibility = Visibility.Visible,
};
//Set image source and crop image accordingly
var image = new BitmapImage(new Uri(news.ImageUrl[0]));
var viewImage = new Image
{
Source = image,
Height = viewHeight,
Width = viewWidth,
MaxWidth = viewWidth,
MaxHeight = viewHeight,
Stretch = Stretch.UniformToFill
};
//Set header view
TextBlock title = new TextBlock
{
MaxHeight = titleHeight,
MaxWidth = titleWidth,
Height = titleHeight,
Width = titleWidth,
Text = news.Title,
Margin = new Thickness(titleX, titleY, 0, 0),
Padding = new Thickness(framePadding),
Foreground = new SolidColorBrush(Colors.White),
TextWrapping = TextWrapping.Wrap,
FontWeight = FontWeights.Bold,
FontSize = 22,
FontFamily = new FontFamily("Calibri"),
TextTrimming = TextTrimming.WordEllipsis
};
//Set ingress view
TextBlock leadText = new TextBlock
{
MaxHeight = leadTextHeight,
MaxWidth = leadTextWidth,
Height = leadTextHeight,
Width = leadTextWidth,
Margin = new Thickness(leadTextX, leadTextY, 0, 0),
Padding = new Thickness(framePadding, 0, framePadding, framePadding),
Text = news.LeadText,
Foreground = new SolidColorBrush(Colors.White),
TextWrapping = TextWrapping.Wrap,
FontSize = 18,
FontFamily = new FontFamily("Calibri"),
TextTrimming = TextTrimming.WordEllipsis
};
//Add subviews to container and viewlist
imageContainer.Children.Add(viewImage);
textContainer.Children.Add(title);
textContainer.Children.Add(leadText);
container.Children.Add(imageContainer);
container.Children.Add(textContainer);
_viewsList.Add(container);
//Add single news container to main content canvas
ContentCanvas.Children.Add(container);
希望有人可以帮助我！
答案 0 :(得分：6)
在我创建问题后的几分钟内找到了我的问题的答案，并且得到答案（http://codepaste.net/xyo2ib）
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Animation;
public class Flipper
{
public enum Directions { LeftToRight, RightToLeft }
public static void FlipItem(UIElement over, UIElement under, Directions direction = Directions.LeftToRight, int duration = 200)
{
// setup visible plane
over.Visibility = Visibility.Visible;
over.Projection = new PlaneProjection { CenterOfRotationY = 0 };
// setup hidden plane
under.Visibility = Visibility.Collapsed;
under.Projection = new PlaneProjection { CenterOfRotationY = 0 };
// gen storyboard
var _StoryBoard = new System.Windows.Media.Animation.Storyboard();
var _Duration = TimeSpan.FromMilliseconds(duration);
// add animation: hide-n-show items
_StoryBoard.Children.Add(CreateVisibility(_Duration, over, false));
_StoryBoard.Children.Add(CreateVisibility(_Duration, under, true));
// add animation: rotate items
if (direction == Directions.LeftToRight)
{
_StoryBoard.Children.Add(CreateRotation(_Duration, 0, -90, -180, (PlaneProjection)over.Projection));
_StoryBoard.Children.Add(CreateRotation(_Duration, 180, 90, 0, (PlaneProjection)under.Projection));
}
else if (direction == Directions.RightToLeft)
{
_StoryBoard.Children.Add(CreateRotation(_Duration, 0, 90, 180, (PlaneProjection)over.Projection));
_StoryBoard.Children.Add(CreateRotation(_Duration, -180, -90, 0, (PlaneProjection)under.Projection));
}
// start animation
_StoryBoard.Begin();
}
private static DoubleAnimationUsingKeyFrames CreateRotation(TimeSpan duration, double degreesFrom, double degreesMid, double degreesTo, PlaneProjection projection)
{
var _One = new EasingDoubleKeyFrame { KeyTime = new TimeSpan(0), Value = degreesFrom, EasingFunction = new CubicEase() { EasingMode = EasingMode.EaseIn } };
var _Two = new EasingDoubleKeyFrame { KeyTime = new TimeSpan(duration.Ticks / 2), Value = degreesMid, EasingFunction = new CubicEase() { EasingMode = EasingMode.EaseIn } };
var _Three = new EasingDoubleKeyFrame { KeyTime = new TimeSpan(duration.Ticks), Value = degreesTo, EasingFunction = new CubicEase() { EasingMode = EasingMode.EaseOut } };
var _Animation = new DoubleAnimationUsingKeyFrames { BeginTime = new TimeSpan(0) };
_Animation.KeyFrames.Add(_One);
_Animation.KeyFrames.Add(_Two);
_Animation.KeyFrames.Add(_Three);
Storyboard.SetTargetProperty(_Animation, new PropertyPath("RotationY"));
Storyboard.SetTarget(_Animation, projection);
return _Animation;
}
private static ObjectAnimationUsingKeyFrames CreateVisibility(Duration duration, UIElement element, bool show)
{
var _One = new DiscreteObjectKeyFrame { KeyTime = new TimeSpan(0), Value = (show ? Visibility.Collapsed : Visibility.Visible) };
var _Two = new DiscreteObjectKeyFrame { KeyTime = new TimeSpan(duration.TimeSpan.Ticks / 2), Value = (show ? Visibility.Visible : Visibility.Collapsed) };
var _Animation = new ObjectAnimationUsingKeyFrames { BeginTime = new TimeSpan(0) };
_Animation.KeyFrames.Add(_One);
_Animation.KeyFrames.Add(_Two);
Storyboard.SetTargetProperty(_Animation, new PropertyPath("Visibility"));
Storyboard.SetTarget(_Animation, element);
return _Animation;
}
}
答案 1 :(得分：1)
为什么不使用http://phone.codeplex.com/
上提供的Windows Phone Toolkit中的HubTile控件您还可以使用Telerik在http://www.telerik.com/products/windows-phone/overview/all-controls/hubtile.aspx处提供的HubTile控件来实现此目的。