We start with this lines a new series of small articles to offer some simple but useful tips to help provide a better end user experience with Thinfinity® VirtualUI™ extended applications.
When the application was originally designed, the underlying assumption was that it would be used in desktop devices. As a result, we did not spend too much time thinking about the characteristics of the device from where our application would be run.
But when using VirtualUI, it is often necessary to be aware of some features and capabilities of the device from which end users are accessing our application.
The VirtualUI class has a property called BrowserInfo, which contains data about the used browser to assist us in delivering the best possible user experience.
In the list below we will find a detail of the information that BrowserInfo will deliver us:
General information related to the current connected browser:
Attribute | Description |
Username | Returns the logged-on username. |
IPAddress | Returns the client’s ip address. |
Location | Returns the URL of the current application. |
UniqueBrowserId | Identifies an instance of a browser. Each time an end-user opens the application from a different browser window, this identifier will be have a different value. |
UserAgent | Returns the browser’s User Agent string. This value is very important to identify which browser type is used, if the remote device is a mobile, etc. |
An important value to consider is the UserAgent property. When establishing a connection, the browser sends VirtualUI a string data indicating its brand and version, which OS it is running on, and the brand and model of the device that is being used. This value is known as the userAgent. Using this value we can infer, for example, if the user connects from a mobile device and then modify some specific feature, layout or functionality of our application to better suit that device.
Information related to the available screen space:
Attribute | Description |
BrowserWidth | Returns the width of the HTML element containing the VirtualUI viewer, in pixels. |
BrowserHeigth | Returns the height of the HTML element containing the VirtualUI viewer, in pixels. |
ScreenWidth | Returns the width of the end-user’s device screen, in pixels. |
ScreenHeight | Returns the height of the end-user’s device screen, in pixels. |
ScreenResolution | Returns the application screen resolution defined in the application profile. |
ViewWidth | Returns the width of the VirtualUI viewer, in pixels. |
ViewHeight | Returns the height of the VirtualUI viewer, in pixels. |
Orientation | Returns the browser’s orientation. |
It is also worth mentioning that when using VirtualUI, the desktop size is dynamic. This means that the available space to display the application is correlated to the available space in the browser screen and it is not limited to a fixed desktop size —as it would happen, for example, in an RDP connection, where the desktop size is defined when the connection is established.
The following example in C# shows how to center a window of our application on this virtual desktop as needed, previously controlling their size if it exceeds the available space:
using Cybele.Thinfinity;
...
...
...
private VirtualUI vui;
public Form1()
{
InitializeComponent();
vui = new VirtualUI();
}
private void CenterThisWindow(object sender, EventArgs e)
{
this.WindowState = FormWindowState.Normal;
if (vui.BrowserInfo.ViewHeight < (this.Height + 20))
{
this.Height = vui.BrowserInfo.ViewHeight - 20;
}
if (vui.BrowserInfo.ViewWidth < (this.Width + 20))
{
this.Width = vui.BrowserInfo.ViewWidth - 20;
}
this.Top = (vui.BrowserInfo.ViewHeight - this.Height) / 2;
this.Left = (vui.BrowserInfo.ViewWidth - this.Width) / 2;
}
As we mentioned above, this new series of small technical notes will be aimed at providing simple tips to help you take advantage of the features added to your applications through the adoption of Thinfinity VirtualUI.
We invite you to share with us your concerns and/or experiences.