Marquee State Transition Updates

[Avid29]

Improved API for starting, pausing, resuming, and stopping the Marquee animations

[Avid29]

Added a fix for #755

[hawkerm]

I'd invert this paradigm, so you see it moving when your mouse isn't over it, as an accessibility thing folks are probably going to want to have the text stop moving if they're trying to put their mouse on it.

[hawkerm]

Ah, we talked on discord, both scenarios have use-cases, maybe add to the docs where and when to use each pattern?

[Avid29]

I actually think the StartAnimation on hover seen above makes more sense for the use case I was suggesting. I've replaced this sample with an inverted sample containing Hyperlinks.

[hawkerm]

Ah, think the PR package has fallen off the feed? Oh, looks like they won't get pushed if a fork? (Had to download from artifacts.)

[hawkerm]

@Avid29 noticed a change when updating to the latest package from the PR. The content no longer clips to the bounds of the control, so I can see the text before/after it's supposed to not be visible.

In the image above, I have a grid with a button on the right-most column. The Marquee is in the column to its left. With this update the text is now visible at the "start" and is overlapping the bottom on the right, compared to before where it wouldn't be visible and clipped by where it was bound. i.e. you can see the bounds of the Marquee control on the left:

I do see the test starts off screen now which is nice (took me a second to realize what was going on with above and the new AutoPlay property). Makes me think a configuration for where the text should start (either offscreen or in the normal layout position if it were a textblock) would be nice.

[hawkerm]

FYI, I did use the OpacityMaskView and it worked great to feather the edges (though had to realize I had to set the H/VContentAlignment on the OMV):

            <controls:OpacityMaskView.OpacityMask>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="8" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="8" />
                    </Grid.ColumnDefinitions>
                    <Rectangle>
                        <Rectangle.Fill>
                            <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                                <GradientStop Offset="0.0" Color="Transparent" />
                                <GradientStop Offset="1.0" Color="White" />
                            </LinearGradientBrush>
                        </Rectangle.Fill>
                    </Rectangle>
                    <Rectangle Grid.Column="1" Fill="White" />
                    <Rectangle Grid.Column="2">
                        <Rectangle.Fill>
                            <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                                <GradientStop Offset="0.0" Color="White" />
                                <GradientStop Offset="1.0" Color="Transparent" />
                            </LinearGradientBrush>
                        </Rectangle.Fill>
                    </Rectangle>
                </Grid>
            </controls:OpacityMaskView.OpacityMask>

So, this works with the current version, though I'd still expect it to clip to the bounds on its own otherwise you see the text covering other elements and just disappearing all at once.