Sliding Dialogs

Introduction

CFloatingDialog is a CDialog-derived class that I used to create the sliding effect of the dialog. There are already some classes available for this purpose, but most of the classes are for modal dialogs and not exactly what I was looking for.

Dialogs with different controls are used to capture the data, but when the volume of data is very great, different dialogs that contain the logical related set of data/controls are used. What I tried to do is: When the user completes one dialog, he is given a button for next or back, and rather then showing the next dialog at once, the current dialog will slide towards any direction (Left, Right, Top, Down) and can also slide back toward the center.

To make it more pleasing and different, the dialog (with controls) is required to be a Child, rather then Popup styled and also with no borders. At the main dialog, a placeholder window (CStatic) is placed, roughly to the size of the dialog. After that, all you need to do is derive your class from CFloatingDialog and use its member function to slide it. The dialog (with controls) will appear to be part of the main dialog (if CStatic has no borders or sunken style). Everything will appear as one piece, but when you displace the dialog, it will slide in the boundaries of the placeholder.

How To Use CFloatingDialog

  1. Create a dialog-based MFC project.
  2. Add CFloatingDialog.h and CFloatingDialog.cpp to your project.
  3. Create a dialog template; select “Child” for the style and “None” for borders from Style tab.
  4. Place whatever controls you want on your dialog resource.
  5. Simply by double-clicking the dialog template, the new class window will appear. Put any name for your class and derive it from CDialog. Yes, from CDialog at the moment.
  6. Now, go to your new dialog class and replace CDialog with CFloatingDialog. You’ll have to replace it at the start of the class where it will derive publically from CDialog. Beside that, at the body of the ctor, you’ll have to replace CDialog() with CFloatingDialog() and finally in the message map. Don’t forget to put
    #include "FloatingDialog.h"

    at the top of your dialog class.

  7. The file wi_header.h contains some enums and a define. If you don’t want to use that file, you can place the entries at the beginning of the class.
  8. Place a CStatic at the main dialog and name it IDC_PLACE_HOLDER. This will be used as parent of the dialog and also the reference of the displacement will be measured from the Rect of this place holder.
  9. Now, create a member variable of dialog (that you derived from CFloatingDialog) for the main dialog. Let’s call it “CFirstDialog m_oDlg1;”
  10. Place the following lines in OnInitDialog():
    m_oDlg1.Create(IDD_DIALOG1 , GetDlgItem(IDC_PLACE_HOLDER));
    m_oDlg1.ShowWindow(SW_SHOW);
    
  11. Now, use the DisplaceDialog(…) function with different enum values to slide in different directions.

Similarly, you can put more then one dialog as the member of the main dialog and create them similarly and at different occasions. You can call them in different sequences, giving the user the feel that certain parts of the dialog (mainly concerned with data I/O) are sliding.

Conclusion

The usage of CFloatingDialog is pretty easy. All you need to do is just inherit your class from it, rather then CDialog. You can work without any hassle of doing changes, except when changing the dialog style and border style, and putting in the placeholder where you want your dialog to be displayed.

More by Author

Get the Free Newsletter!

Subscribe to Developer Insider for top news, trends & analysis

Must Read