Question:
How can I add Back and Next buttons to the Elipse E3 project, so that they can operate similarly to the web browsers buttons of the same name?
Solution:
Starting with Elipse E3 version 5.5 (and higher), there are three new methods in the FrameSet to help develop Back and Next buttons: NavigateBack, NavigateForward, and NavigateHistReset. There are also three new properties in this object: NavigateHistCount, NavigateCanGoBack, and NavigateCanGoForward. Therefore, with these new methods and properties, users can now navigate/browse between screens via the history of screens open in a FrameSet.
Versions previous to 5.5
First of all, let’s understand how these buttons (Back and Next) work in a web browser and how they can apply to Elipse E3. Whenever you visit different websites, the browser stores the browsing history of these visits. If you click the Back button, it returns to the most recent record of the history; likewise, if you click Back again, it will return to the previous record.
Every time you click Back, it will automatically enable the Next button. When you change sites, either by typing the address at the top or by clicking a link, the Next button is disabled, allowing you to just go back to previous addresses.
How to implement these buttons at E3?
- You can do so with auxiliary tags, in Viewer object, which will take part in the logic.
- It’s also possible to do so via Open Screen buttons
- Or you can use Next and Back buttons
What you’re aiming at in this case is to store the screens history in a matrix, i.e., to have their indices correspond to the names of the open screens. The Next and Back buttons will access these indexes, therefore incrementing or decrementing them as needed, and open the screen corresponding to the chosen index.
The buttons that open a screen directly will update these auxiliary tags:
- Aux1 Tag: loads the number of screens in history
- Aux2 Tag: loads the index of the screen currently open
- Matrix Tag: loads the history of open screens
- BackEnable Tag: Boolean that enables/disables Back button
- NextEnable Tag: Boolean that enables/disables Next button
This navigation logic makes sense only in applications with a fixed navigation screen. In Viewer object, there is a script in OnStartRunning event that initializes the matrix, storing the first screen open at index 0, i.e., the main screen.
Array (0) = “ScreenName”
Item (“Matrix”).Value = Matrix
Starting the application
When you start the application, you’ll have no access to Next and Back buttons, since no screens have opened yet.
Next button’s logic
Next button follows this logic:
Matrix = Application.Item (“Matrix”).Value
n2 = cint (Application.Item (“Aux2).Value +1)
Application.Item (“Aux2).Value = n2
Application.GetFrame (Splitter_Name).OpenScreen (Matrix (n2)), 0
Application.Item (“BackEnable).Value = True
else
Enabled = False
end if
First, you must test to find out whether index Aux2 (the current one) equals Aux1 (number of screens in history). If it’s equal, Next button won’t work; if lower, it increments the index Aux2, and the screen of this incremented index opens; Back button will then work.
Back button’s logic
Back button follows this logic:
Enabled = False
elseif Application.Item (“Aux2).Value = 0 then
Enabled = False
else
Matrix = Application.Item (“Matrix”).Value
n2 = cint (Application.Item (“Aux2).Value-1)
Application.Item (“Aux2).Value = n2
Application.GetFrame (Splitter_Name).OpenScreen (Matrix (n2)), 0
Application.Item (“NextEnable).Value = True
end if
First, you must test to find out whether index Aux1 is 0 (i.e., if there are no records in history), and then test again to find out whether index Aux2 is 0 (i.e., it has already reached the oldest record in history). If either condition is met, Back button won’t work. Otherwise, you must decrement the current screen’s index (Aux2), and open the screen regarding this index; Next button will then work.
Screens history
In order to start the screens history, click the buttons that open the screen directly, and that present the following script:
n = Application.Item (“Aux2).Value
n2 = Cint (n +1)
Matrix = Application.Item (“Matrix”).Value
ReDim Preserve Array (n2)
Matrix (n2) = ScreenName
Application.Item (“Aux1).Value = Application.Item (“Aux2).Value +1
Application.Item (“Matrix”).Value = Matrix
Application.Item (“Aux2).Value = Application.Item (“Aux1).Value
Application.GetFrame (Splitter_Name).OpenScreen (ScreenName) 0
Application.Item (“BackEnable).Value = True
Application.Item (“NextEnable).Value = False
End Sub
This script increments the current index of the open screen and, to the added index, you must insert the name of the screen that will open at that moment. When adding a new screen to the history, the value of Aux1 is the index of the screen open at the moment, plus 1.
Then, create an OnValueChanged event in tags Aux1 and Aux2, and insert the following script into Aux1:
This script causes Next button to be disabled whenever the value of Aux1 changes.
Then, in Aux2 tag’s OnValueChanged event, add:
Parent.Item (“BackEnable).Value = False
elseif Value = Parent.Item (“Aux1).Value then
Parent.Item (“NextEnable).Value = False
end if
If the value of Aux2 is 0, i.e., if it reached the last index of the history, Back button is disabled. If Aux2‘s value is equal to Aux1‘s, Next button is disabled.
Soon after, link Enable property of both buttons (Next and Back) to tags BackEnable and NextEnable, respectively.
Example:
First of all, open four screens directly with Open Screen button. The history will display five screens (the four open ones, plus the initial screen). Remember, you won’t be able to access the Next button, because when you open a screen, Aux2 becomes equal to Aux1 after being incremented.
After that, press Back button twice. In this example, Aux2 index is 3, while Aux1 index remains 5. Then, Next button is disabled.
On the screen with index 3, open another screen directly via button. Aux1 index will be 4 (not 5 anymore), as well as Aux2 index’s. To this index (4), add the name of the screen that will open; Next button is disabled.
This means that when you open a screen directly, after using the Back button, the screens history (of screens whose indexes are higher than the current one) is removed. For example, in this application the screens with indexes 4 and 5 were removed, and a new screen was inserted in this index, which made the Next button unreachable; this will make it work similarly to Internet browsers.
Note: Attached to this file is a demo application.
Attachments:
