Click or drag to resize

Graphical user interface

This topic is designed for traders who develop graphical trading programs via S#, but not enough familiar with the basics of GUI programming in .NET.

There is a special technology WPF for the GUI building in .NET (before there was the WinForms technology that significantly was inferior by the graphics capabilities). To create graphical elements a special declarative language XAML is used in this technology.

The main limitation of the Windows visual API is that it is impossible to access to the window elements from another thread. This is due to the Windows architectural limitations (described in more detail here https://msdn.microsoft.com/en-US/library/ms741870.aspx). The IConnector interface implementations work in multithreaded mode to improve productivity. Therefore, by subscribing to an event, for example, IConnectorNewSecurity, it is impossible to directly display the data in a user window. To do this, in is necessary to perform the synchronizing operation via the special Dispatcher object, which controls the queue of the thread working elements.

Here is a simple example of how this is done:

C#
// the BeginInvoke method must be invoked for access to any UI compenents in market-data handles
_trader.NewSecurity += security => this.Dispatcher.BeginInvoke((Action)(() => this.Security.ItemsSource = _trader.Securities));

S# already has special methods that hide the Dispatcher use and simplify coding:

C#
// the same as a prev example but uses short notation
_trader.NewSecurity += security => this.GuiSync(() => this.Security.ItemsSource = _trader.Securities);

Graphical components of S#

S# includes a large number of its own graphical components, as well as a free library for Wpf Xceed.Wpf.Toolkit. Its own graphical components are placed in the StockSharp.Xaml, StockSharp.Xaml.Charting and StockSharp.Xaml.Diagram namespaces. Some specific components are in the connectors namespaces, for example the combined list OpenECryAddressComboBox for the OpenECry server address selecting.

S# has a variety of controls for:

  • search and select data (instruments, portfolios, addresses);

  • the orders creation;

  • display exchange and other information (trades, orders, transactions, order books, logs, etc.);

  • charts plotting.

To access the S# graphical controls in the XAML code it is necessary to define the aliases for the corresponding namespace and to use these aliases in the XAML code. How to do this is shown in the following example:

XAML
<Window x:Class="SampleSmartSMA.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:loc="clr-namespace:StockSharp.Localization;assembly=StockSharp.Localization"
        xmlns:sx="clr-namespace:StockSharp.Xaml;assembly=StockSharp.Xaml"
        xmlns:ss="clr-namespace:StockSharp.SmartCom.Xaml;assembly=StockSharp.SmartCom"
        xmlns:charting="http://schemas.stocksharp.com/xaml"
        Title="{x:Static loc:LocalizedStrings.XamlStr570}" Height="700" Width="900">

    <Grid>
   </Grid>
</Window>