Use WPF to implement the "wait" Small Turntable

Source: Internet
Author: User

During the development process, we often encounter some time-consuming operations, such as a slow network access or copying a large file. If multithreading is not used, instead, you can directly use the UI thread to perform these actions, which will cause the user interface to lose response and bring a bad user experience. A good practice is to present a small animation on the interface. When a user sees something moving, he does not think the program has died. For example:

Of course, a better way is to implement a progress bar, but many times we cannot get the progress, so we can only display such a small turntable, the simple implementation of the Small turntable effect is to display a small GIF, but the default image control of WPF does not directly support GIF animation effect. Fortunately, we can callWpfanimatedgif"Third-Party libraries can easily display the animation effect. This library can be obtained through nuget and can also be downloaded from the complete code provided by me. This is my demo:

When a small turntable appears, we hope to temporarily block user operations. The earliest way I thought was to disable the window, that is, to set its isenabled attribute to false, however, this can not achieve the desired effect, because it can only disabled the customer area of the window, but can still be operated not in the customer area, such as minimizing the title bar, to maximize and close the button, use a modal dialog box. This is the modal dialog box I designed:

<Window X: class = "waitingdemo. waitingdlg "xmlns =" http://schemas.microsoft.com/winfx/2006/xaml/presentation "xmlns: x =" http://schemas.microsoft.com/winfx/2006/xaml "xmlns: GIF = "http://wpfanimatedgif.codeplex.com" Title = "waitingdlg" Height = "100" width = "400" windowstyle = "NONE" background = "Transparent" allowstransparency = "true" windowstartuplocation = "centerowner" closing = "window_closing" loaded = "window_loaded" textoptions. textformattingmode = "display"> <grid> <border cornerradius = "5" Height = "40" borderbrush = "black" borderthickness = "1" background = "white" width = "350 "> <border. effect> <dropshadoweffect color = "black"> </dropshadoweffect> </border. effect> <grid verticalalignment = "center"> <image GIF: imagebehavior. animatedsource = "loading.gif" width = "28" Height = "28" verticalignment = "TOP" horizontalalignment = "Left" margin = "5, 0, 0, 0 "/> <textblock name =" tbprompt "verticalignment =" center "horizontalalignment =" center "grid. columnspan = "2" margin = ""> the task is being executed... </textblock> </GRID> </Border> </GRID> </WINDOW>

Here are several important attribute settings:

  • Windowstyle-set to none so that the modal dialog box does not have a title bar. Of course, the buttons for minimizing, maximizing, and closing are also absent.
  • Background-set to transparent to make the background of this modal dialog box transparent
  • Allowstransparency-if this attribute is not set to true, the modal dialog box is still not transparent and you will see a black box.
  • Windowstartuplocation-set to centerowner to center the modal dialog box by default.

You may have noticed that it is not enough to show the close button. You can close the dialog box by <alt> + <F4>, so you need to handle the closing event, determine whether this close action is proposed by our program.

For task processing, I created an interface:

    public interface ILongTimeTask    {        void Start(WaitingDlg dlg);    }

The reason for passing waitingdlg in is to close this modal dialog box when the worker thread ends:

Public void taskend (Object result) {m_taskresult = result; // return the execution result (or null) m_bclosebyme = true; // this flag indicates that the "close" action is initiated by our program dispatcher. begininvoke (New closemethod (close); // This call method must be used by the working thread to perform operations on interface elements}

Complete code: Download

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.