0

I'm new to WPF and using the loading animation i want to load the event on the dot changed of animation I tried a lot but the event loads before the window appears.

<StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center">
    <StackPanel.Triggers>
        <EventTrigger RoutedEvent="Rectangle.Loaded">
            <BeginStoryboard>
                <Storyboard Name="waitingAnimation" RepeatBehavior="1x" >
                    <DoubleAnimation Storyboard.TargetName="Dot1" BeginTime="0:0:0.0" Storyboard.TargetProperty="Opacity" From=".1" To="1" AutoReverse="False" Duration="0:0:5.0"/>
                    <DoubleAnimation Storyboard.TargetName="Dot2" BeginTime="0:0:5.0" Storyboard.TargetProperty="Opacity" From=".1" To="1" AutoReverse="False" Duration="0:0:5.0"  />
                    <DoubleAnimation Storyboard.TargetName="Dot3" BeginTime="0:0:10.0" Storyboard.TargetProperty="Opacity" From=".1" To="1" AutoReverse="False" Duration="0:0:5.0"  />
                    <DoubleAnimation Storyboard.TargetName="Dot4" BeginTime="0:0:15.0" Storyboard.TargetProperty="Opacity" From=".1" To="1" AutoReverse="False" Duration="0:0:5.0"/>
                    <DoubleAnimation Storyboard.TargetName="Dot5" BeginTime="0:0:20.0" Storyboard.TargetProperty="Opacity" From=".1" To="1" AutoReverse="False" Duration="0:0:5.0"/>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </StackPanel.Triggers>
    <Ellipse Name="Dot1" Fill="White" Opacity=".1" Width="8" Height="8" />
    <Ellipse Name="Dot2" Fill="White" Opacity=".1" Width="8" Height="8" Margin="2,0,0,0" />
    <Ellipse Name="Dot3" Fill="White" Opacity=".1" Width="8" Height="8" Margin="2,0,0,0"/>
    <Ellipse Name="Dot4" Fill="White" Opacity=".1" Width="8" Height="8" Margin="2,0,0,0" Loaded="Dot4_Loaded"/>
    <Ellipse Name="Dot5" Fill="White" Opacity=".1" Width="8" Height="8" Margin="2,0,0,0"/>
</StackPanel>

Code behind:

public StartUp()
{
    InitializeComponent();
    this.WindowState = WindowState.Maximized;
}

private void Dot4_Loaded(object sender, RoutedEventArgs e)
{
    MessageBox.Show("Hi");
}
Tobias Tengler
  • 6,848
  • 4
  • 20
  • 34
Saad Zahid
  • 7
  • 6
  • So you just want something to happen 15 or 20 seconds after the window is shown? – Clemens Jul 07 '19 at 14:00
  • i want different events for each loading dot – Saad Zahid Jul 07 '19 at 14:01
  • All dots are loaded immediately before the window is shown. Please explain what you are actually trying to achieve. – Clemens Jul 07 '19 at 14:02
  • Like i want to check the database connection of the application on first dot and on second dot i want to check the xml files and after all this on the last dot i want to redirect to login page – Saad Zahid Jul 07 '19 at 14:03
  • And this isn't something that should just happen after a certain timespan? – Clemens Jul 07 '19 at 14:03
  • @Clemens i want to load each dot step by step suppose i am checking database connection on the first dot event if the connection is not established then it will show a message box and closes the application – Saad Zahid Jul 07 '19 at 14:05
  • Sure, you already said that two times. Still you did not answer my question. Think about it. Is it something you could easily do by a timer or a sequence of actions with defined time delays? You may even set status properties in your view model that would update the UI, instead of abusing animations. – Clemens Jul 07 '19 at 14:07
  • yes i exactly want this – Saad Zahid Jul 07 '19 at 14:09
  • i want that the window appears and the first dot loads and then the others one by one – Saad Zahid Jul 07 '19 at 14:10
  • So what you actually want to do is the following: attach a Loaded event handler to the MainWindow. In the handler method, subsequently perform a couple of actions (e.g. call some methods). If there should really be a delay between these actions, call `await Task.Delay(...)` in between. After each action has performed, set the Visibility of the appropriate dot, or start an animation that animates its Opacity. – Clemens Jul 07 '19 at 14:31
  • Firstly, I have never heard `event loads` before so you need to explain what that means; do you mean `event triggers`? Secondly, why are you forcing your users to wait 25 seconds? – CodingYoshi Jul 07 '19 at 14:37
  • If you want to provide feedback to users about progress then search for WPF progress bars. You should not assume the work will take 25 seconds to complete. It man take less or longer. – CodingYoshi Jul 07 '19 at 14:39
  • You could make each of these operations a task and multi thread them so you start checking your database connection and the xml file at the same time. Such processes are likely to take a variable amount of time dependent on factors beyond your control. Hence it's common to show some loading animation which is independent of actual progress. An indeterminate loading animation like a spinner just shows the user something is going on. Load the window when these are both completed. – Andy Jul 07 '19 at 14:50
  • @CoadingYoshi i means to say that the animation loads before the window appears i just want to load the animation dot one by one and make an event one the load of each dot after that if their is no exception occurred the login window will appear – Saad Zahid Jul 07 '19 at 14:55

0 Answers0