FancyProgressbar - 3 - (User Control) - 180430Sa

FancyProgressbar - 3 (User control)

.

Version: 180430Sa

.

Other versions Version Link 141204We Fancy Progressbar - Ver 2 - C Sharp 170410Mo FG Progressbar 03.01 - 170410Mo

.

Few days ago I specially searched on hard-drive of computer for an application I had made some years ago in c# (c sharp) for demonstrating a progressbar (user control). I had made that demonstration applicaton for testing progressbar usercontrol I had made in c# (c sharp). After finding that application I ran it for some time and after testing/revising it's different options I took and saved some screen-shots at different levels/states of application. I did that for sharing online. I had named that progressbar "FancyProgressbar - 3".

.

In this blog entry I am going to discus that progressbar in some detail.

.

First the purpose of making this progressbar was to have a progressbar which can display progress status of the process over it. This progressbar can display, user chose-able, following type of information over it:

.

Progress status/state Ready Working Cancel Error Complete Progress percent Completed Remaining Time Elapsed Remaining

.

Following are some screen-shots of the above mentioned progressbar demonstrating application I made in c#.

.

.

[ (1) Application loaded]

Application is loaded and is ready for use.

.

.

.

.

[(1a) Application tab is active]

Application tab, out of it's three tabs, is active.

.

.

.

[(1a1) Error generation]

Generate ERROR during process option (CheckBox) is checked/selected. Purpose of this option is to have ability to generate ERROR programmatically during process for testing purpose. When this option is checked process randomly aborts between progress percent of 33 to 66.

.

.

.

[(1a2) Progressbar width]

Progressbar with is modified (increased). Purpose of this option is to have ability for test application to change width of progressbar for testing.

.

.

.

[(1a3) Progressbar text]

Progressbar text options are expended. Purpose of this option is to give ability to select different combination of text/information over progressbar.

.

.

.

[(1a4) Process related]

.

[(1a4a) Start button clicked]

[Process is running . . .] Start button is clicked and process is started and is running. Progressbar background color is light-Blue and progressbar color is dark-Green. Progressbar is displaying from left to right progress percent completed, time elapsed, progress state i.e. working, Time remaining, progress percent remaining.

.

.

.

[Process completed successfully] Start button was clicked and process was started and process is completed successfully. Progressbar background color is light-Blue and progressbar color is dark-Green. Progressbar is displaying from left to right progress percent completed, time elapsed, progress state i.e. working, Time remaining, progress percent remaining.

.

.

.

[(1a4b) Cancel button clicked]

During a running process Cancel button is clicked and process aborted itself. Progressbar color is changed to Orange.

.

.

.

[(1a4c) ERROR generated]

During a running process ERROR is generated programmatically. This happened because "Error generation" CheckBox was checked. Progressbar color is changed to Red.

.

.

.

[(1b) Help tab is active]

Useful information about application are displayed in this Help tab

.

.

.

[(1b1) About and Author]

In this image About and Author sections of Help tab are visible. About section displays basic information about application. Author section displays basic information about author of application i.e. me "Khursheed Fateh".

.

.

.

[(1b2) How to Use]

Help tab's "How to Use" section in simple text describes/explains how to use this application.

.

.

.

[(1b3) Features of Progressbar]

"Features of Progressbar" section of Help tab describes and explains different features of this application. This section is further divided into 2 parts. (Labels: Three type of information displayed over progressbar), (Status: Five status options for progressbar).

.

.

.

[(1c) Exit tab is active]

User can EXIT from this application only from here. This tab displays a button with text "EXIT FROM HERE". Clicking this button closes this application. This button occupies entire area of the tab and has red background color and white text color.

.

.

.

[(1d) Application Exiting methods]

.

[(1d1) Application System menu is expanded]

Application's system menu is expanded by clicking on the application/form icon on Left-Top of the application form.

.

.

.

[(1d2a) Close button of form is clicked]

Close button of the form situated on the right-top of the form is clicked and this opens a Hint window explaining how to exit from application.

.

.

.

.

[(1d2b) Close option of System menu clicked]

First application/form icon on the left top of the formis clicked. Second System menu is displayed. Third Close option from System menu is clicked. This opens a Hint window explaining how to exit from application.

.

.

.

[(1d2c) Alt+F4 is pressed on Keyboard]

Alt+F4 key combination is pressed from keyboard and this opens a Hint window explaining how to exit from application.

.

.

.

Colors used for Border and Background of this post Color HSL RGB Hex 174°, 52%, 33% 40, 128, 119 #fcba03 174°, 62%, 90% 213, 245, 242 #d5f5f2

.

.

If there are any mistakes in this post then I will remove them whenever I will know about them.

.

FG Progressbar 03.01 - 170410Mo

FG Progressbar - 3.1

.1);">.

Version: 170410Mo

.

Other versions Version Link 2 Fancy Progressbar - Ver 2 - C Sharp

.

Few month ago while going through posts on my this blog I reached on a post with title “Fancy Progressbar - Ver 2 - C Sharp”. After reading that post I searched on HDD of pc for the project discussed and shared in that post. In search result I found many more Progressbars made by me as UserControl in c# (c sharp) with different look and abilities.

.

Out of that search result list I found a progressbar project which was next version (version 3) of above mentioned progressbar project (version 2). I ran that version 3 few times and then made another project based on it for sharing here and named it “FG ProgressBar – 3.1”. I made some modification, improvements to UI and logic of the new project. When I found workings and looks of the new application Ok then I took it’s ScreenShots at it’s different stages. After that I added watermarks to all ScreenShots.

.

This progressbar version 3.1 application is a demo project. First it demonstrates a good and simple looking progressbar. Second it demonstrates how to find prime numbers between 2 randomly selected numbers with a gap of 100000000. Third it demonstrates how to create a form programmatically and use it to show Help information.

.

A simple looking progressbar:

This simple looking progressbar is actually made of 3 controls one TableLayoutPanel with one row and two columns and two Labels. First Label for showing completed progress and second Label for showing remaining progress. Resultant Progressbar is made to look simple and user friendly. Progressbar displays status of process end with 3 colors. Green is for SUCCESS, Orange is for CANCEL and Red is for ERROR. This progressbar’s use is demonstrated during finding of prime numbers.

.

Finding Prime numbers:

Application runs a long process for finding prime numbers between 2 randomly generated numbers with a gap of 100000000 and updates fancy progressbar based on calculated percentage of work done by that process for each number it processes. Method for finding prime number is not optimized for speed or space. It is used here for having a long process for Fancy progressbar demo.

.

Creating Form programmatically:

Help information is displayed through a form created dynamically / programmatically on the fly. First Form is created second a control is added, RichTextBox in this case, third some properties of Form and RichTextBox are set according to needs (like Help info to Text property of RichTextBox) and fourth form with Help information is displayed.

.

Application's UI and Working:

Application's user interface and how to use it is explained row wise in the following.

This row displays title of application. This row displays minimum number for processing when "Start" button is clicked. This row displays maximum number for processing when "Start" button is clicked. This rows displays primes found count during processing. This rows displays primes found percent during processing. Thirs row is for telling long process to generate error or not. This row contains 2 buttons: Start: For starting lengthy process. Stop: For stoping/canceling lengthy process. This row contain 2 buttons: Show Help: This button displays help form for this application. Exit: This button is for exiting from this application. This row contains 3 controls: Lable for displaying application status. Progressbar_3.1: This is the progressbar for which thlis application is made. Label for displaying progress percentage.

Following are the screen shots of 'FG Progressbar - Ver 03.01' application with explanation.

.

.

[ Application is loaded ]

Application looks like in the following photo when loaded.

.

.

.

.

[ Application's Help form is displayed ]

Application's Help form looks like this and it is displayed when 'Show Help' button is clicked. It displays some basic information about application. Working of main Form is not blocked by display of Help form. Help window uses different color on each load which it randomly selects from "Black, Blue, Green, Purple, DarkOrange, Red and DarkCyan". I used creation date of the original project version 3 in Help info.

.

.

.

.

[ Start button clicked ]

[ Process started (Busy...) ]

Application looks like this when 'Start' button is clicked and application starts finding prime numbers between 2 randomly generated numbers. 'Start' button becomes disabled and 'Stop' button becomes enabled. In status line application shows that it is 'Busy...' and percentage of job done by progressbar and percentage number. It also shows number of Primes found and Primes found percentage in form.

.

.

.

.

[ Process Completed (Done) ]

Application looks like this when Job is completed. 'Start' button becomes enabled again and 'Stop' button becomes disabled. In status line it shows 'Done' and Progressbar and percentage label shows that 100% job is completed. Total Primes found and Primes found percentage are shown in different fields of form.

.

.

.

.

[ Process Completed (Ready) ]

Application looks like this when Job is completed. 'Start' button becomes enabled again and 'Stop' button becomes disabled. In status line it shows 'Ready' and Progressbar and percentage label shows that 100% job is completed. Total Primes found and Primes found percentage are shown in different fields of form.

.

.

.

.

[ Stop button clicked (Stoped) ]

Application looks like this when 'Stop' button is clicked. On doing so application stops doing it's job and shows 'Stoped' in status line. 'Start' button gets enabled and 'Stop' button gets disabled.

.

.

.

.

[ Stoped button clicked (Ready) ]

Application looks like this when 'Stop' button is clicked. On doing so application stops doing it's job and shows 'Ready' in status line. 'Start' button gets enabled and 'Stop' button gets disabled.

.

.

.

.

[ Generate Error Yes option checked ]

[ Application aborts on error (Error) ]

Application looks like this when 'Yes' opption is checked for Generate Error. On doing so application's long process generates devide by zero error and so stops doing it's job and shows 'Error' in status line. 'Start' and ' Stop' button gets disabled.

.

.

.

.

[ Application aborted on error (Ready) ]

Application looks like this when 'Yes' opption is checked for Generate Error. On doing so application's long process generates devide by zero error and so stops doing it's job and shows 'Ready' in status line. 'Start' button get enabled and 'Stop' button gets disabled.

.

.

.

.

[ Application's alert message on closing ]

On application closing application checks if background worker is working and if it finds background worker working then it displays message with options to close application anyway or leave background worker working.

.

.

.

.

Colors used for Border and Background of this post Color HSL RGB Hex 51, 51%, 40% 071, 050, 154 #47329a 51, 53%, 81% 185, 174, 229 #b9aee5

.

.

Enjoy  Complete Source code of application written and compiled in visual studio 2010 Ultimate by  me. Download it. Extract it. Read 'ReadMeFirst.txt' file and do as is explained in it.

.

.

If there are any mistakes in this post then I will remove them whenever I will know about them.

.

Fancy Progressbar - Ver 2 - C Sharp - 170411Tu

Fancy Progressbar - Ver 2

.

(Demo for Progressbar, Prime numbers, Dynamic Form.)

(Written by me in c#)

Version: 170411Tu

.

Other versions: Version Link 3.1 FG Progressbar 03.01 - 170410Mo

.

I found a Project in working folder of C# 2010 with name 'FancyProgressbar' which was written by me a few years ago. I opened it ran it and went through it's code. That project was collection of some fancy looking Progressbars. After running that project for some time I made another project for sharing here  and named it 'FancyProgressbar-02'.

.

This project is a demo project. First it demonstrates a fancy looking Progressbar. Second it demonstrates how to find prime numbers between 2 numbers with a gap of 100000000. Third it demonstrates how to create a form programmatically and use it to show Help information.

.

A simple fancy looking progressbar:

Fancy looking progressbar is actually made of one TableLayoutPanel and two Progressbars. First Progressbar with it's Style set to ProgressBarStyle.Continuous and second Progressbar with it's Style set to ProgressBarStyle.Marquee. Resultant Progressbar is made to look fancier by playing with some Properties of these 3 controls. It's use is demonstrated  during finding of prime numbers.

.

Finding Prime numbers:

Application runs a long process for finding prime numbers between 2 randomly generated numbers with a gap of 100000000 and updates fancy progressbar based on calculated percentage of work done by that process for each number it processes. Method for finding prime number is not optimized for speed or space. It is used here for having a long process for Fancy progressbar demo.

.

Creating Form programmatically:

Help information is displayed through a form created  dynamically / programmatically on the fly. First Form is created second a control is added, Label in this case, third some  properties of Form and Label are set according to needs (like Help info to Text property of Label) and fourth form with Help information is displayed.

.

Following are the screen shots of 'Fancy Progressbar - Ver 02'  application with explanation.

.

Application looks like this when it is loaded.

.

.

Application's Help form looks like this and it is displayed when 'Show Help' button is clicked. It displays some basic information about application. Working of main Form is not blocked by display of Help form. Help window uses different color on each load which it randomly selects from "Black, Blue, Green, Purple, DarkOrange, Red and DarkCyan". I used creation date of the original project in Help info.

.

.

Application looks like this when 'Start' button is clicked and application starts finding prime numbers between 2 randomly generated numbers. 'Start' button becomes disabled and 'Stop' button becomes enabled. In status line application shows that it is 'Busy...' and percentage of job done by progressbar and percentage number. It also shows number of Primes found and Primes found percentage in form.

.

.

Application looks like this when Job is completed. 'Start' button becomes enabled again and 'Stop' button becomes disabled. In status line it shows 'Done.' and Progressbar and percentage label shows that 100% job is completed. Total Primes found and Primes found percentage are shown in  different fields of form.

.

.

Application looks like this when 'Stop' button is clicked. On doing so application stops doing it's job and shows 'Stopped.' in status line. 'Start' button gets enabled and 'Stop' button gets disabled.

.

.

[Update-2017Apr12Wed]:

Today I removed some typing mistakes from this post and user-interface of application. I also made improvement to logic of application today.

.

.

Enjoy Complete Source code of application written and compiled in visual studio 2010 Ultimate by me. Download it. Extract it. Read 'ReadMeFirst.txt' file and do as is explained in it.