Dialog TemelleriDialog Basics

GirişIntroduction

Dialog'lar, kullanıcının belirli bir task gerçekleştirebileceği user interface form'larıdır. Bir dialog; temel dialog bilgisinden, event'lerden/method'lardan ve üzerindeki control'lerden oluşur. "Temel bilgi" sadece boyutu, background renk ismidir ve boş bir dialog tanımlamak için yeterlidir.Dialogs are user interface forms that user can perform a specific task on. A dialog is consisted of it’s basic dialog information, events/methods and the controls on it. “Basic information” is just its size, background color name and it is enough to define an empty dialog.

Bir dialog'un ana component'leri üzerindeki control'lerdir. Control'ler, button, textfield, combobox, graphic, tab pane, image gibi user interaction için kullanılan basit item'lardır.The main components of a dialog are controls on it. Controls are simple items that is used for user interaction, such as buttons, textfields, comboboxes, graphics,tab panes, images etc.

Ayrıca, dialog'lara davranış eklemek için dialog'larda method tanımlamak ve bu method'ları başkalarından çağırmak mümkündür. Bu method'lardan bazılarının özel isimleri vardır ve TROIA interpreter tarafından çağrılır. Bu tür method'lara "dialog event"leri denir. Dialog event'lerini, tüm control type'larını ve event'lerini ilerleyen bölümlerde ele alacağız.Also, It is possible to define methods on dialogs and call these methods from others to add behavior to dialogs. Some of this methods has special names and called by TROIA interpreter. These kind of methods are called “dialog events”. We will discuss dialog events, all types control and their events in next sections.

Dialog Oluşturma/DüzenlemeCreating/Editing Dialogs

TROIA dialog'larını oluşturmak/düzenlemek için TROIA IDE kullanılır. TROIA IDE'yi açmak için, java client'ın üst menüsündeki "TROIA IDE" öğesine tıklamalısınız. Menünüzde bir TROIA IDE öğesi yoksa, lütfen önceki bölümlerde ele aldığımız development haklarınızı kontrol edin.TROIA IDE is used to create/edit TROIA dialogs. To open TROIA IDE, you must click “TROIA IDE” item on top menu of java client. If there is not a TROIA IDE item on your menu please check your development rights which we discussed on previous sections.

Yeni bir dialog oluşturmak için, menüde TROIA IDE-> New -> New Dialog'a tıklamalı ve new dialog form'unu doldurmalısınız.To create a new dialog, you must click TROIA IDE-> New -> New Dialog on menu and fill the new dialog form.

New dialog form'unda bir hotline (change request) seçmeli ve geçerli bir dialog ismi girmelisiniz. Geçerli bir dialog ismi benzersiz ve en az dört karakter uzunluğunda olmalıdır, bu yüzden dört karakterden kısa veya mevcut bir dialog ile aynı isimde yeni bir dialog oluşturamazsınız.In new dialog form you, must select a hotline (change request) and enter a valid dialog name. A valid dialog name must be unique and at least four characters length, so you can not create a new dialog whose name is shorter than four characters or same with an existing dialog.

New dialog form'undaki son field "Base Dialog"dur. Dialog'ları inherit etmek mümkündür, bu yüzden dialog'unuzun bir base dialog'u varsa base dialog'un ismini girmeli/seçmelisiniz. Şimdilik, "Base Dialog" field'ını boş bırakabiliriz, inheritance'ı ilerleyen bölümlerde ele alacağız.The last field in new dialog form is “Base Dialog”. It is possible to inherit dialogs, so if your dialog has a base dialog you must enter/select the name of base dialog. For now, we can leave “Base Dialog” field empty, we will discuss inheritance in next sections.

New dialog form'unda "OK" butonuna tıkladıktan sonra, IDE yeni bir dialog oluşturur ve design window'unu açar.After you click “OK” button on new dialog form, IDE creates a new dialog and opens design window.

Dialog'lar Nasıl Saklanır?How Dialogs are Stored?

Dialog'lar hakkındaki tüm development bilgisi (kod, design vb.) database table'larında saklanır.All development information (codes, design etc) about dialogs are stored in database tables.

Dialog'ların Binary FormatıBinary Format of Dialogs

"Convert" operation'ıyla, binary/compilation data'sı oluşturulur. Bu data; isim, boyut, control'ler, control pozisyonları, function'lar ve event'ler gibi her türlü dialog bilgisini içerir.With “Convert” operation, binary/compilation data is built. This data contains all kinds of dialog information such as name, size, controls, control positions, functions and events etc.

"Save" operation'ı, binary data'yı ve verilen dildeki dialog text'lerini bir ".dlg" dosyasına yazar. Dialog dosyalarının bir dil için dialog ve control text'leri içerdiğinden language dependent olması açıktır.“Save” operation writes binary data and dialog texts on given language to a “.dlg”. It is obvious that dialog files are language dependent because they contains dialog and control texts for a languge.

Dialog dosyaları, user file path adlı bir folder'da saklanır. User file path, kullanıcının tüm binary bilgiyi (dialog, class, report) yüklediği folder'dır ve SYST03'te her kullanıcı için configure edilir. İşte dialog dosyasının formatı ve konumu.Dialog files are stored in a folder named user file path. User file path is the folder that user loads all binary information(dialog, class, report) and it is configured for each user on SYST03. Here is the format and location of dialog file.

format : {userfilepath}\jdlg\{module}\{languagecode}{dialog}.dlgformat : {userfilepath}\jdlg\{module}\{languagecode}{dialog}.dlg

Örnek:Example:

İngilizce'de SALT01D001 > {userfilepath}\jdlg\SAL\ET01D001.dlgSALT01D001 in English> {userfilepath}\jdlg\SAL\ET01D001.dlg

Almanca'da SALT01D002 > {userfilepath}\jdlg\SAL\DT01D002.dlgSALT01D002 in Deutsch> {userfilepath}\jdlg\SAL\DT01D002.dlg

Sistem, dialog açıldığında dialog dosyasını okur. Runtime'da sistem development table'larına erişmez.System reads dialog file when dialog is opened. On runtime system does not access development tables.

Basic Dialog Event'leriBasic Dialog Events

Event'ler, belirli bir action gerçekleştiğinde sistem tarafından otomatik olarak çağrılan önceden tanımlı method'lardır. Örneğin; "button clicked", kullanıcı bir button'a tıkladığında otomatik olarak çağrılan bir event'tir. Programcılar, ilgili action gerçekleştiğinde bir şeyler yapmak için event'i implement etmelidir.Events are predefined methods that called by system automatically when a specific action occurs. For example; “button clicked” is an event called automatically when user click a button. Programmers must implement the event to do something on related action occurs.

İşte dialog'ların en çok kullanılan event'leri:Here is the most used events of dialogs:

Bazı durumlarda, programcıların dialog event'lerini manuel olarak çağırması gerekebilir. Bir dialog method'unu çağırmak, bir dialog method'unu çağırmaktan farklı değildir.In some cases, programmers may need calling dialog events manually. Calling a dialog method is not different from calling a dialog method.

THIS.AFTER();THIS.AFTER();

THIS.ONSHOW();THIS.ONSHOW();

Ayrıca, dialog'ların bazı belirli action'lar için çağrılan ONTIMER, TRANSCALLED, BEFOREEXTENSION event'leri vardır. Bu event'ler ilgili bölümlerde ele alınacaktır.Additionally, dialogs have ONTIMER, TRANSCALLED, BEFOREEXTENSION events which are called for some specific actions. This events will be discussed on related sections.

Control'lerin TemelleriBasics of Controls

Control'ler, button, textfield, combobox gibi ui item'larıdır. Programcılar, kullanıcıyla etkileşim oluşturmak için dialog'larda uygun control'leri tanımlar. Tüm control'lerin, kullanıcı button'a tıklama veya bir textfield'ın değerini değiştirme gibi belirli bir action gerçekleştirdiğinde interpreter tarafından çağrılan önceden tanımlı event'leri vardır. Bir dialog control'ü iki ana feature ile tanımlanır: type ve subtype; hem type hem subtype bilgisi SYSCONTROLS table'ında saklanır. "Type", control'ün ana grubunu tanımlar (button veya textfield). "Subtype", control'ün sadece bir veya iki feature'ını değiştirir; örneğin event sayısı, görünüm, symbol type vb.Controls are the ui items such as buttons, textfields, comboboxes etc. Programmers define appropriate controls on dialogs to create interaction with user. All controls have predefined events which is called by interpreter when user performs a specific action like clicking button or changing value of a textfield. A dialog control is defined by two main features its type and subtype and both of type and subtype information is stored on SYSCONTROLS table. “Type” defines the main group of control (button or textfield). “Subtype” changes only one or two features control such as event count, appearance, symbol type etc.

Bir dialog'da bir control tanımlamak için, programcı gerekli control'ü "Toolbox Explorer"dan dialog'a sürükler ve implement edilen process'e göre control feature'larını değiştirir. Konum, boyut, görünürlük, disable/enable, background rengi, foreground rengi, tüm control type'larının ana ve ortak feature'larıdır. Ayrıca, her control type'ının kendi feature'ları vardır. Control feature'larını "Property Explorer" ve workflow'a göre TROIA code ile değiştirmek mümkündür. İşte yeni bir button control'ü ve event'leri ile feature'ları:To define a control on a dialog, programmer drags required control from “Toolbox Explorer” to dialog and modifies control features due to process that is imlemented. Location, size, visibility, disable/enable, background color, foreground color are the main and common features of all type of controls. Additionally, each control type has its own features. It is possible to modify control features using “Property Explorer” and TROIA code due to workflow. Here is a new button control and its events and features:

Tanımlanan control'e davranış eklemek için, programcı control'ün bir veya daha fazla event'ini implement etmelidir. Her control type'ının kendi event'leri de vardır. Dialog design ekranında sağ tık menüsünde ve "Property Explorer"ın altında (control seçildiğinde) listelenirler.To add behaviour to defined control, programmer must implement one or more events of control. Each control type has also its own events. They are listed in right click menu on dialog design screen and at the bottom of “Property Explorer” (when control selected).

Örnek Control: TextFieldSample Control: TextField

TextField, tüm text input control'lerinin ana type'ıdır; her subtype önceden tanımlı bir data type'ında kendi control symbol'ünü tanımlar. Ayrıca her subtype'ın built-in key listener, data/input validator, zooming gibi kendi data input davranışı vardır.TextField is the main type of all text input controls, each subtype defines its own control symbol in a predefined data type. Also each subtype has its own data input behaviour such as built-in key listener, data/input validator, zooming.

İşte TextField'ın en çok kullanılan subtype'ları ve control symbol type'ları.Here is the most used subtypes of TextField and control symbol types.

Color, Money, Quantity, Percent, Factor, Custom Editor, Icon Chooser, Duration, HTML, HTML Viewer, Link, Phone, Rich Editor, Time, Times, TextField Control'ünün diğer subtype'larıdır. Lütfen bu subtype'ları dialog'da test edin ve feature'larını ve control tarafından tanımlanan variable'larını görün.Color, Money, Quantity, Percent, Factor, Custom Editor, Icon Chooser, Duration, HTML, HTML Viewer, Link, Phone, Rich Editor, Time,Times are the other subtypes of TextField Control. Please test these subtypes on dialog and see their features and variables that is defined by control.

İşte bir textfield'ın temel event'leri.Here is the basic events of a textfield.

Textfield'ların ayrıca ZoomBefore/ZoomAfter, Drag/Drop ve RightClickMenu event'leri adlı ek event'leri de vardır. Bu tür event'leri ilerleyen bölümlerde ele alacağız.Textfields also have additional events named ZoomBefore/ZoomAfter, Drag/Drop and RightClickMenu events. We will discuss this kind of event in next sections.

Dialog'lar Arasında GeçişSwitching Between Dialogs

Dialog açmanın iki ana yöntemi vardır. İlki, bir dialog'u bir transaction'ın (application) start dialog'u olarak tanımlamaktır. Bu yöntemde sistem, transaction açıldığında start dialog'u otomatik olarak çağırır. Bir transaction ve start dialog'u nasıl tanımlanacağını ilerleyen bölümde ele alacağız.There are two main methods of opening dialogs. First one is defining a dialog as start dialog of a transaction (application). In this method system automatically calls start dialog when transaction opened. We will discuss how to define a transaction and a start dialog in next section.

İkinci yöntem, TROIA code'ları aracılığıyla bir dialog çağırmaktır. TROIA kullanarak bir dialog çağırmak için, "CALL DIALOG" komutu kullanılır. Örneğin, kullanıcı ilk dialog'umuzdaki bir button'a tıkladığında bir dialog çağırmak istiyorsak, "click" event'ini implement etmeli ve bir CALL DIALOG komutu yazmalıyız. CALL DIALOG çalıştırıldıktan sonra sistem yeni dialog'u açar, event'lerini tetikler ve ikinci dialog'a geçer.Second method is calling a dialog via TROIA codes. To call a dialog using TROIA, “CALL DIALOG” command is used. For example, if we want to call a dialog when user clicks a button on our first dialog we must implement “click” event and write a CALL DIALOG command. After CALL DIALOG is executed system opens new dialog fires its events and switches to second dialog.

Dialog'ları popup olarak çağırmak mümkündür. İşte CALL DIALOG komutu için syntax alternatifleri:Its possible to call dialogs as popups. Here is the syntax alternatives for CALL DIALOG command:

CALL DIALOG {dialog};CALL DIALOG {dialog};

CALL DIALOG WITH LOCATION {x}, {y} SIZE {width}, {height};CALL DIALOG WITH LOCATION {x}, {y} SIZE {width}, {height};

CALL DIALOG komutu, çalışan method'da code execution'ı durdurur ve client'ta yeni dialog'u açar; caller method'un kalan kısmı, dialog kapandıktan sonra çalıştırılır (bir user interface'i olan bir function çağırmak gibi).CALL DIALOG command stops code execution on running method and opens new dialog on client, remaining part of caller method executed after dialog close (like calling a function that has a user interface).

Bir dialog'u kapatmak için, SHUTDOWN komutunu kullanmalısınız. SHUTDOWN komutu son açılan dialog'u kapatır ve önceki dialog'a geçer. Kapatılan dialog transaction'ın son dialog'uysa sistem transaction'ı otomatik olarak kapatır.To close a dialog, you must use SHUTDOWN command. SHUTDOWN command closes the last opened dialog and switches to previous dialog. If the closed dialog is the last dialog of transaction system closes transaction automatically.

SHUTDOWN;SHUTDOWN;

TROIA'da, dialog'lara bir değer veya variable aktarmak ekstra bir çaba gerektirmez, başka bir deyişle önceki dialog tarafından tanımlanan control symbol'lerinin değerlerine erişebilirsiniz. Bu tamamen "scope" ile ilgilidir. Scope'un ne olduğunu veya sistemin nasıl çalıştığını anlamıyorsanız lütfen ilgili bölümleri inceleyin.In TROIA, transferring a value or variable to dialogs does not require an extra effort, in other words you can access the values of control symbols which are defined by previous dialog. This is totally about “scope”. If you don’t understand what the scope is or how system works please review related sections.

Bir dialog kapandıktan sonra, kapatılan dialog tarafından tanımlanan global variable'lar memory'den kaldırılmaz, bu yüzden hâlâ erişilebilirdirler. Bu yüzden programcılar, yeni variable ve control tanımlarken kapatılan dialog'lardaki symbol isimlerini ve type'larını dikkate almalıdır.After a dialog is closes, global variables that are defined by closed dialog are not removed from the memory so they are still accessible. So programmers must consider symbol names and types on closed dialogs when defining new variables and controls.

Function'lar & Sağ Tık MenüsüFunctions & Right Click Menu

Dialog'larda method tanımlamak ve bu method'ları control event'lerinden çağırmak mümkündür. Bir dialog method'u tanımlamak için, "Object Explorer"da dialog'a sağ tıklamalı ve menüden "Add Method"u seçmelisiniz.It is possible to define methods on dialogs and call this methods from control events. To define a dialog method, you must right click the dialog on “Object Explorer” and select “Add Method” on menu.

Yeni bir method tanımlamak için gerekli parametreleri girdikten sonra, sistem yeni eklenen method'u otomatik olarak açar. Bir method'u dialog sağ tık menü öğesi olarak göstermek için, "Show on Menu" checkbox'ını seçmeli ve "Property Explorer"da bir caption (sağ tık menüsündeki text) ayarlamalısınız. Sağ tık menü öğeleri, "Bounded With" seçeneğiyle dialog'daki control'lere bağlanabilir. Bir sağ tık menü öğesini bir control'e bağlarsanız, control disabled olduğunda menü öğesi de disabled, control invisible olduğunda menü öğesi de invisible olur.After insert required parameters for defining a new method, system automatically opens newly added method. To show a method as dialog right click menu item, you must select “Show on Menu” checkbox and set a caption (text on right click menu) on “Property Explorer”. Right click menu items can be bounded to controls on dialog with “Bounded With” option. If you bind a right click menu item to a control, menu item is disable when control is disabled and invisible when control is invisible.

Dialog'da Timer'larTimers on Dialog

Bazı durumlarda, programcıların bir information board'u yenilemek veya her iki dakikada bir bir şeyler yapmak gibi önceden tanımlı bir periyotta tekrar tekrar bir TROIA code parçası çalıştırması gerekir. Bu durumları ele almak için dialog'un, verilen periyotta otomatik olarak tetiklenen önceden tanımlı bir event'i, ONTIMER, vardır. Varsayılan olarak timer periyodu sıfırdır (0) ve bu timer'ın disabled olduğu anlamına gelir. Timer'ları etkinleştirmek için periyot bilgisi, dialog'un BEFORE veya AFTER event'inde çalıştırılan TROIA code ile ayarlanmalıdır. Timer periyodunu ayarlamak için SETTIMER komutu kullanılır.In some cases programmers need to run a piece of TROIA code repeatedly in predefined period such as refreshing a information board or do something in every two minutes. To handle this cases dilaog has a predefined event, ONTIMER which is fired automatically fired in given period. As default timer period is zero (0) and this means timer is disabled. To enable timers period informations must be set by TROIA code which is executed on BEFORE or AFTER event of dialog. To set timer period SETTIMER command is used.

Üzerinde bir integer textfield'ı olan ve her 2 saniyede bir değerini artırmamız ve değer 10 olduğunda durdurmamız gereken bir dialog düşünün. Önce ONTIMER method'unu şu şekilde implement etmeliyiz:Consider a dialog that has an integer textfield on it and in every 2 seconds we must increase its value and stops when value is 10. Firstly must implement ONTIMER method as:

INTEGERVAR1 = INTEGERVAR1 + 1;INTEGERVAR1 = INTEGERVAR1 + 1;

STRINGVAR3 = STRINGVAR3 + TOCHAR(10) + 'OnTimer değeri artırdı';STRINGVAR3 = STRINGVAR3 + TOCHAR(10) + 'OnTimer increased the value';

IF INTEGERVAR1 == 10 THENIF INTEGERVAR1 == 10 THEN

SETTIMER 0; SETTIMER 0;

ENDIF;ENDIF;

Ve periyodu ayarlamak için, dialog'un AFTER event'ine aşağıdaki kodu eklemeliyiz:And to set the period, we must add the code below to AFTER event of dialog:

SETTIMER 2000;SETTIMER 2000;

/* 2000 : periyot milisaniye olarak tanımlanır. *//* 2000 : period is defined as milliseconds. */

ONTIMER event'ini çalıştırmak zaman periyodundan daha uzun sürerse, sistem event queue'sunda birden fazla ONTIMER event'i oluşturmaz. Yeni ONTIMER event'i, önceki event bittikten sonra oluşturulur. Örneğin, timer 5 saniyeye ayarlanmışsa ve ONTIMER event'i 10 saniye sürüyorsa. Client, ilk event'in response'u döndükten 5 saniye sonra ikinci ONTIMER event'ini gönderir.If running ONTIMER event takes longer time than time period, system does not create multiple ONTIMER events on event queue. New ONTIMER event is created after previous event finished. For example, if timer is set to 5 seconds and ONTIMER event takes 10 seconds. Client sends second ONTIMER event, 5 seconds after first event’s response returned.

Alıştırma 1: Kelime SaymaExercise 1: Counting Words

Lütfen şu şekilde bir dialog tanımlayınPlease define a dialog that

• üzerinde iki button ve bir textfield olsunhas two buttons and one textfield on it
• önceki dialog'da tanımlanan bir string symbol'ünün kelime sayısını üzerindeki textfield'a yazdıran bir sağ tık menü öğesi olsunhas a right click menu item that prints the word count of a string symbol which is defined on previous dialog, to textfield on it.
• button'larından biri dialog'u kapatsınone of its buttons closes the dialog
• ikinci button sağ tık menüsüyle aynı davranışa sahip olsun.second button has same behavior with its right click menu.

ve dialog'unuzu DEVT11-Runcode Test Transaction'ının ilk dialog'undan çağırınand call your dialog from first dialog of DEVT11-Runcode Test Transaction

Alıştırma 2: Timer ile Saat TanımlamaExercise 2: Defining a Clock with Timer

Lütfen şu şekilde bir dialog tanımlayınPlease define a dialog that

• güncel date'i gösteren bir datetime field'ı olsunhas a datetime field which shows current date
• her saniyede date değerini güncellesinuptates the date value on each second

ve dialog'unuzu DEVT11-Runcode Test Transaction'ının ilk dialog'undan çağırın. Üzerindeki time değerini kontrol edin ve bazı durumlarda neden iki saniye atladığını/tıkladığını bulmaya çalışın.and call your dialog from first dialog of DEVT11-Runctode Test Transaction. Check the time value on it and try to find why it jumps/ticks for two seconds in some cases.