Я хочу, чтобы в моем приложении была анимация выделения границ - PullRequest
Новая
       43

Я хочу, чтобы в моем приложении была анимация выделения границ

0 голосов
/ 30 октября 2019

Я хочу, чтобы после нажатия кнопки я увидел, что появляется анимация и приземляется на картинку, которая является номером _random, но я не могу найти что-либо в Google

Я пытался Google и спрашивать, но все ещене получил то, что я хочу 

public sealed partial class FilePage : Page
    {
        DataPage value = new DataPage();
        Random _random = new Random();
        private int time = 0;
        DispatcherTimer Timer;

        public FilePage()
        {
            this.InitializeComponent();
        }

        private void ButtonClick1(object sender, RoutedEventArgs e)
        {

 //////////
 //////////cut some off to keep this short (turning the border black again)
 //////////


            Timer = new DispatcherTimer();
            Timer.Interval = new TimeSpan(0, 0, 3);
            Timer.Tick += Timer_Tick;
            Timer.Start();
        }

        public void Timer_Tick(object sender, object e)
        {
            int value = _random.Next(1, 13);
            ((Grid)gMainGrid.FindName($"g{value}")).BorderBrush = new SolidColorBrush(Colors.White);
            Timer.Stop();
            SpinnerSecond.Visibility = Visibility.Collapsed;

            DataWatch.valueWatch = value;
            RollKnop.Visibility = Visibility.Visible;



        }
    }
}

, поэтому я хочу иметь анимацию, которая выходит за границы следующим образом: https://docs.microsoft.com/en-us/windows/apps/images/fluent/traveling-focus-fullscreen-light-rf.gif примерно на 3 секунды и затем приземляется на нужную, извинитеесли я звучу как демордер, но я уже гуглю 2 дня

Ответы [ 2 ]

0 голосов
/ 30 октября 2019

Короче говоря, вы можете создать цикл, который пересекает элементы внутри контейнера и устанавливает для них BorderBrush и BorderThickness.

Это простой пример кода:

ColorBorderPage.xaml 

<StackPanel>
    <controls:WrapPanel x:Name="ItemsContainer" HorizontalAlignment="Center" Width="160" Height="120" Margin="0,50">
        <StackPanel Background="Gray" Width="100" Height="50" Margin="0,0,10,10"/>
        <StackPanel Background="Gray" Width="50" Height="50" Margin="0,0,0,10"/>
        <StackPanel Background="Gray" Width="160" Height="50"/>
    </controls:WrapPanel>
    <Button Content="Click Me" Click="Button_Click" HorizontalAlignment="Center"/>
</StackPanel>

Я создал панель с именем ItemsContainer, которая заменяет изображениес StackPanel и добавьте кнопку для запуска анимации.

ColorBorderPage.xaml.cs 

private async void Button_Click(object sender, RoutedEventArgs e)
{
    int count = ItemsContainer.Children.Count;
    int index = 0;
    while (true)
    {
        var item = ItemsContainer.Children[index] as StackPanel;
        item.BorderBrush = new SolidColorBrush(Colors.LightGreen);
        item.BorderThickness = new Thickness(3);
        await Task.Delay(3000);
        item.BorderThickness = new Thickness(0);
        index = index == count - 1 ? 0 : index + 1;
    }
}

В коде, сначала получив числодочерние элементы в контейнере, затем установка Border один за другим через цикл while и перезапуск при завершении цикла до конца.

В соответствии с вашими требованиями к анимации вы можете использовать Task.Delay(), что приведет к задержкеуказанное время, прежде чем перейти к следующему шагу.

Это только пример, но он должен быть в состоянии удовлетворить ваши потребности, вам просто нужно заменить StackPanel на Image.

С уважением.

0 голосов
/ 30 октября 2019

Уверен, что вы должны использовать ControlPaint.DrawBorder, если изображения находятся в ящиках с картинками, вы рисуете для одного изображения, после небольшой задержки вы удаляете его, затем рисуете его на другом и т. Д.
Через 3 секунды выпродолжайте так до тех пор, пока он не попадет на хорошую картинку, тогда вы остановите все

РЕДАКТИРОВАТЬ: Возможно, вы захотите проверить это, если это еще не сделано: Как создать цветную рамку на PictureBoxКонтроль

...