Анимированный текст Glint On Анимированный текст

Question

У меня есть кнопка, которая загружает больше данных в сетку данных при нажатии.Чтобы указать прогресс, я изменяю текст кнопки, чтобы изменить с «Больше» на «Загрузка ...», где периоды анимированы.Далее я хотел добавить эффект «блика», чтобы текст был на виду.Если вы использовали iPhone / iPod Touch, я подумываю об эффекте «Слайд для разблокировки» текста экрана блокировки.

Для этого я сдвигаю среднюю, более светлую градиентную ступеньку изслева направо.Поскольку анимация постоянно зацикливается, я использовал смещения вне допустимого диапазона, чтобы создать задержку между моментами, когда остановка градиента света фактически видна.

Я реализовал это, но могу сказать, что по какой-то причинелегкий градиент не начинается с левого края текста.Начинается примерно с «а» в «Загрузка».Я принял это, и это было на месте некоторое время, но сейчас я возвращаюсь к нему, просто чтобы понять, почему.Кажется, возможно, он использует меру исходного текста при расчете анимации, но я подумал, что анимации должны были применяться друг к другу, когда в одной раскадровке.Вот мой код:

<UserControl.Resources>
    <local:EmptyBatchNumConverter x:Key="emptyBatchNumConverter" />

    <BeginStoryboard x:Key="bsbLoadingMore" x:Name="bsbLoadingMore">
        <Storyboard x:Name="sbLoadingMore">
            <StringAnimationUsingKeyFrames Storyboard.TargetName="txtBtnMoreText" Storyboard.TargetProperty="Text" Duration="0:0:2" FillBehavior="Stop" RepeatBehavior="Forever">
                <DiscreteStringKeyFrame Value="Loading" KeyTime="0:0:0" />
                <DiscreteStringKeyFrame Value="Loading." KeyTime="0:0:0.5" />
                <DiscreteStringKeyFrame Value="Loading.." KeyTime="0:0:1" />
                <DiscreteStringKeyFrame Value="Loading..." KeyTime="0:0:1.5" />
            </StringAnimationUsingKeyFrames>

            <!--Animate the OffSet of the light gradient stop for a "glint" effect. Using -4.5 to 4.5 to delay the visible effect between repeats (and 
                              control the speed relative to the duration). Using an extra .4 seconds to offset the frequency from the text animation. -->
            <DoubleAnimation Storyboard.TargetName="gs2" Storyboard.TargetProperty="Offset" From="-4.5" To="4.5" Duration="0:0:2.4" RepeatBehavior="Forever" />
        </Storyboard>
    </BeginStoryboard>
</UserControl.Resources>

...

<Button Name="btnMore" Grid.Row="1" Style="{StaticResource OasisGridMoreButton}" Click="btnMore_Click" Visibility="Visible" Height="16">
            <Button.Content>
                <TextBlock Name="txtBtnMoreText" MinWidth="48" Text="More..." /> <!--MinWidth = width of "Loading..."-->
            </Button.Content>
            <Button.Foreground>
                <LinearGradientBrush StartPoint="0.2,0" EndPoint="1,1">
                    <GradientStop x:Name="gs1" Color="Black"  Offset="0"/>
                    <GradientStop x:Name="gs2" Color="Cyan" Offset="-4.5"/>
                    <GradientStop x:Name="gs3" Color="Black" Offset="1" />
                </LinearGradientBrush>
            </Button.Foreground>
        </Button>

Answer 1

Вот проблема:

<LinearGradientBrush StartPoint="0.2,0" EndPoint="1,1">

Измените его на:

<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">

Вот полное тестовое приложение, которое я сделал (замедлил блеск, чтобы лучше его увидеть):

<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"
x:Class="WpfApplication4.MainWindow"
x:Name="Window"
Title="MainWindow"
Width="640" Height="480">
<Window.Resources>
    <Storyboard x:Key="OnLoaded1"/>
</Window.Resources>
<Window.Triggers>
    <EventTrigger RoutedEvent="FrameworkElement.Loaded">
        <BeginStoryboard x:Name="bsbLoadingMore">
                <Storyboard x:Name="sbLoadingMore">
                    <StringAnimationUsingKeyFrames Storyboard.TargetName="txtBtnMoreText" Storyboard.TargetProperty="Text" Duration="0:0:2" FillBehavior="Stop" RepeatBehavior="Forever">
                        <DiscreteStringKeyFrame Value="Loading" KeyTime="0:0:0" />
                        <DiscreteStringKeyFrame Value="Loading." KeyTime="0:0:0.5" />
                        <DiscreteStringKeyFrame Value="Loading.." KeyTime="0:0:1" />
                        <DiscreteStringKeyFrame Value="Loading..." KeyTime="0:0:1.5" />
                    </StringAnimationUsingKeyFrames>

                    <!--Animate the OffSet of the light gradient stop for a "glint" effect. Using -4.5 to 4.5 to delay the visible effect between repeats (and 
                                      control the speed relative to the duration). Using an extra .4 seconds to offset the frequency from the text animation. -->
                    <DoubleAnimation Storyboard.TargetName="gs2" Storyboard.TargetProperty="Offset" From="-4.5" To="4.5" Duration="0:0:5.4" RepeatBehavior="Forever" />
                </Storyboard>
            </BeginStoryboard>
    </EventTrigger>
</Window.Triggers>

<Grid x:Name="LayoutRoot">
    <Button x:Name="btnMore"  Visibility="Visible" Margin="0,213,0,182" d:LayoutOverrides="GridBox">
        <Button.Foreground>
            <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                <GradientStop x:Name="gs1" Color="Black"  Offset="0"/>
                <GradientStop x:Name="gs2" Color="Cyan" Offset="0"/>
                <GradientStop x:Name="gs3" Color="Black" Offset="1" />
            </LinearGradientBrush>
        </Button.Foreground>
            <TextBlock x:Name="txtBtnMoreText" MinWidth="48" Text="More..." />
    </Button>
</Grid>

По какой-то причине он не показывает </Window> в конце ...