Hack Forums
[.NET] PageControl v1 - Animated sliding between pages [Tutorial] - Printable Version

+- Hack Forums (https://hackforums.net)
+-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444)
+--- Forum: Coding (https://hackforums.net/forumdisplay.php?fid=151)
+---- Forum: Software Development (https://hackforums.net/forumdisplay.php?fid=118)
+---- Thread: [.NET] PageControl v1 - Animated sliding between pages [Tutorial] (/showthread.php?tid=2984498)

PageControl v1 - Animated sliding between pages [Tutorial] - BlackCap - Oct 30, 2012

After a request by MadGod I created this tutorial on my PageControl. You can find the source of the project in the original thread.
Spoiler (Click to View)

So lets get right to it :)
Open visual studio and create a new Windows Form Application. Right-click on your project in the solution explorer and chose "Open Folder In File Explorer". Open another folder browser and browse to the source of my PageControl project. Copy the "PageControl" folder and paste it in your own project folder.

Screenshot:
Spoiler (Click to View)

Press the "Show All Files" button in the upper right corner of the solution explorer window. Right-click the "PageControl" folder and chose "Include In Project".

Screenshot:
Spoiler (Click to View)

Right-click your project in the solution explorer and chose "Add Referance" and add System.Design.

Screenshot:
Spoiler (Click to View)

Create a new class, name it whatever and inherit from the PageControl:
Code
Public Class MyPages
    Inherits PageControl

End Class

Build your project and double-click the class you just created in the solution explorer.

Screenshot:
Spoiler (Click to View)

This is your designer, which is where you add your pages. We don't have any pages yet, so lets create some.
Create a new UserControl, name it whatever and design a page of your choice. This is my page:

Screenshot:
Spoiler (Click to View)

Browse to the designer code of your new page and change "Inherits System.Windows.Forms.UserControl" to "Inherits PageControl.Page".

Screenshot:
Spoiler (Click to View)

Build your project and head back to the page designer. The page you just created is now in your toolbox. Double-click it to add it to the designer and place it whereever you want. Add a couple more while your at it and place them at random locations in the table.

Screenshot:
Spoiler (Click to View)

You'll notice that the pages have different numbers in the bottom right corner. This indicates the index of the pages, which means that the one with 1 will be the first page, the one with 2 the secound and so on.
Their position on the grid is where they're placed in the control and they will animate thereafter.
You can find the PageControl in the toolbox in the form designer.

Screenshot:
Spoiler (Click to View)

You can navigate across the pages with the "PageControl.GoToPage" method.

Because I'm lazy I have included the gif from the previus thread which displays the animation:
[Image: PageControl.gif]

* - Hackedbyak47imaskid - Oct 30, 2012

Thank you a lot for this tutorial on how to use this.
This project you've done here is truly amazing.
Good job!

* - RainStorm - Oct 30, 2012

This is a really nice tutorial! I might use this for some things.

* - Occulta - Oct 30, 2012

Great tutorial and great work, it seems you're amazing with GDI. :3

* - mmaaxx - Jan 31, 2013

anyone please convert the codes to C# ... :D

* - Tidas - Feb 1, 2013

Type 'Pages.PageControl.Page' is not defined. DesignerControl.vb 15
'Pages' is not a member of '<Default>'. PagerAnimation.vb 27

Included it to project, made the class, referenced System.Design, built project, and those come up.

* - cech_3011a - Feb 13, 2013

ps un excelente trabajo el que has hecho

...

..xd

* - barukoru - Sep 22, 2013

This is a really nice tutorial! I might use this for some things.

* - Toqoz - Sep 22, 2013

Really good tutorial, thanks for this.

* - Nickhacker - Sep 29, 2015

How to fix >> Error : Mypage1.Gotopage"0" << "Gotopage" pls ?