第二十一章：变换（六）

两个按钮的Clicked处理程序每个都启动一个独立的动画。 第一个Button的Clicked处理程序将其Scale属性从1设置为5并再次返回，而第二个Button的Clicked处理程序将其FontSize属性设置为1到5的比例因子，然后再返回。
这是关于中途的Scale属性的动画：

正如您所看到的，Button的缩放不会考虑屏幕上可能出现的任何其他内容，而在iOS和Windows 10 Mobile屏幕上，您实际上可以通过Button的透明区域看到顶部BoxView元素，而 opaque Android Button完全隐藏了顶级BoxView。 顶部按钮下面的BoxView实际上位于按钮的顶部，并且在所有三个平台上都可见。
在三个平台上，FontSize属性的动画增加处理方式略有不同：

在iOS上，Button文本在中间被截断，Button按钮保持相同的高度。在Android上，Button文本换行，放大的Button将两个BoxView元素推到一边。 Windows运行时按钮也会截断文本，但方式与iOS不同，与Android一样，增加的Button高度也会推动两个BoxView元素。
动画“缩放”属性不会影响布局，但动画化FontSize属性显然会影响布局。
ButtonScaler中实现的小动画系统可以独立和同时为两个按钮设置动画，但它仍然存在严重的缺陷。当该Button正在设置动画时，尝试点击按钮。将为该Button启动一个新动画，这两个动画将相互干扰。
有几种方法可以解决这个问题。一种可能性是将CancellationToken值作为AnimateAndBack方法的参数包含在内，以便可以取消该方法。 （您可以将相同的CancellationToken值传递给Task.Delay调用。）这将允许Button的Clicked处理程序在开始新动画之前取消任何正在进行的动画。
另一个选项是AnimateAndBack返回Task对象。这允许按钮的Clicked处理程序将await运算符与AnimateAndBack一起使用。在AnimateAndBack完成动画时，Button可以在调用AnimateAndBack之前轻松禁用自身并重新启用自身。
无论如何，如果您希望通过短暂增加和减少按钮大小来向用户实施反馈，那么动画缩放比使用FontSize更安全，更有效。您将在下一章动画和第23章“触发器和行为”中看到其他技术。
Scale属性的另一个用途是调整元素大小以适合可用空间。 您可能会在第5章“处理大小”结束时回想起FitToSizeClock程序。您可以使用Scale属性执行非常类似的操作，但不需要进行估计或递归计算。
ScaleToSize程序的XAML文件包含缺少某些文本的标签，并且还缺少“缩放”设置以使标签更大：

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="ScaleToSize.ScaleToSizePage"
             SizeChanged="OnSizeChanged">
 
    <Label x:Name="label"
           HorizontalOptions="Center"
           VerticalOptions="Center"
           SizeChanged="OnSizeChanged" />
</ContentPage>

ContentPage和Label都安装了SizeChanged处理程序，它们都使用相同的处理程序。 此处理程序只是将Label的Scale属性设置为页面宽度和高度的最小值除以Label的宽度和高度：

public partial class ScaleToSizePage : ContentPage
{
    public ScaleToSizePage()
    {
        InitializeComponent();
        UpdateLoop();
    }
    async void UpdateLoop()
    {
        while (true)
        {
            label.Text = DateTime.Now.ToString("T");
            await Task.Delay(1000);
        }
    }
    void OnSizeChanged(object sender, EventArgs args)
    {
        label.Scale = Math.Min(Width / label.Width, Height / label.Height);
    }
}

因为设置Scale属性不会触发另一个SizeChanged事件，所以不存在触发无限递归循环的危险。 但使用Task.Delay的实际无限循环使Label更新为当前时间：

当然，将手机侧向转动会使标签更大：

在这里，您可以检测到与Android和Windows运行时相比，iOS中Scale属性的实现略有不同。 在Android和Windows上，生成的文本看起来好像是用大字体绘制的。 但是，iOS屏幕上的文字看起来有点模糊。 当操作系统光栅化预分频标签时，会出现这种模糊，这意味着操作系统将其转换为位图。 然后根据“比例”设置扩展位图。