71 lines
5.3 KiB
Plaintext
71 lines
5.3 KiB
Plaintext
|
{\rtf1\ansi\ansicpg1252\deff0\deflang1033{\fonttbl{\f0\fswiss\fprq2\fcharset0 Trebuchet MS;}{\f1\fmodern\fprq1\fcharset0 Courier New;}}
|
|||
|
|
{\stylesheet{ Normal;}{\s1 heading 1;}}
|
|||
|
|
{\*\generator Msftedit 5.41.15.1515;}\viewkind4\uc1\pard\f0\fs32 Text based UI Elements for Propeller \par
|
|||
|
|
for use with the VGA_HiRes_Text Driver\par
|
|||
|
|
\fs24\par
|
|||
|
|
\par
|
|||
|
|
Demo / Text program\par
|
|||
|
|
\tab GUIDemo.spin\tab\tab\tab - the demo app\par
|
|||
|
|
\par
|
|||
|
|
\pard\nowidctlpar\lang2057 Files that comprise the UI Elements\par
|
|||
|
|
\tab FILE\tab\tab\tab LONGS USED\tab DESCRIPTION\par
|
|||
|
|
\tab\tab\tab\tab PROG\tab DATA\par
|
|||
|
|
\tab ----------------------\tab ------\tab -------\tab ----------------------------------------------------\par
|
|||
|
|
\tab GUIBase.spin\tab\tab 2,472\tab 1,643\tab - UI control and infrastructure\par
|
|||
|
|
\tab InputField.spin\tab \f1 168 \tab 6\tab \f0 - Input Field object\par
|
|||
|
|
\pard\keepn\nowidctlpar\s1\tab MenuItem.spin\tab\f1 62\tab 13\tab\f0 - Menu Item object\par
|
|||
|
|
\pard\nowidctlpar\tab PushButton.spin\tab \f1 124\tab 12\tab\f0 - Push Button object\par
|
|||
|
|
\tab RadioCheck.spin\tab\f1 78\tab 13\tab\f0 - Radio Button and Check Box object\par
|
|||
|
|
\pard\keepn\nowidctlpar\s1\tab SimpleBox.spin\tab\f1 62\tab 0\tab\f0 - Basic Box object\par
|
|||
|
|
\pard\nowidctlpar\tab SpinBox.spin\tab\tab \f1 191\tab 12\tab\f0 - Spin Button object\par
|
|||
|
|
\tab TextBox.spin\tab\tab \f1 206\tab 4\tab\f0 - Text Box object\par
|
|||
|
|
\tab StatusLamp.spin\tab \f1 52\tab 6\tab\f0 - Status Annunciator\par
|
|||
|
|
\pard\lang1033\par
|
|||
|
|
Required Drivers\par
|
|||
|
|
\tab Vga_HiRes_Text.spin\tab\tab - VGA High Resolution Text Driver\par
|
|||
|
|
\tab Mouse.spin\tab\tab\tab\tab - PS2 Mouse driver\par
|
|||
|
|
\tab Keyboard.spin\tab\tab\tab - PS2 Keyboard Driver\par
|
|||
|
|
\par
|
|||
|
|
This text based UI for the High Res VGA Driver will work in all resolutions that the driver supports, the demo itself is setup for 800x600 but will show OK at 1024x768 too. At 640x480 it will not look right (needs to be repositioned and re-sized), It is very much a fist principles implementation with no bells and whistles. It supports a static UI and only the basic functionality. To use the UI Elements the user must decide on a screen layout and then place the elements there. You only need to include the objects that you plan to use, you do not have to declare them all. This is done at the top of GUIBase.spin in the constatnts where you delcare how mane of each element type you will need.\par
|
|||
|
|
\par
|
|||
|
|
\par
|
|||
|
|
There are 6 simple steps to using these objects:\par
|
|||
|
|
\par
|
|||
|
|
\pard\fi-270\li270 1) Configure the numbers and types of \b GUI\b0 elements you need in the \b GUI Element Inventory\b0 section of the \b CON\b0 section of the \b GUIBase.spin\b0 file. See the top of that file for simple directions.\par
|
|||
|
|
\pard\par
|
|||
|
|
\pard\fi-270\li270 2) Declare the \b GUI\b0 object in your application's \b OBJ\b0 section.\par
|
|||
|
|
\par
|
|||
|
|
\tab\b OBJ\par
|
|||
|
|
\b0\tab\tab\b GUI\tab : "GUIBase"\par
|
|||
|
|
\tab\b0\par
|
|||
|
|
3) Initialize the GUI object in your application's startup. You will need to pass in the VGA, Mouse and Keyboard pin assignments you are using for each of thise devices. This will initialise the GUI data structures and start the VGA (High Res Text), Mouse, and Keyboard drivers.\par
|
|||
|
|
\par
|
|||
|
|
\tab\b GUI.Init( VGABase, MouseDat, MouseCLk, KeyboardDat, KeyboardClk )\par
|
|||
|
|
\b0\par
|
|||
|
|
4) Create the GUI Elements as required by your application by calling the specific "Init" fucntion in GUIBase.spin. Note that all GUI interation and control will be via the functions in GUIBase.spin, you will not need to access the individual GUI Element files directly. For each element you create you will need to have a variable in your VAR section to hold its identifier. For example\par
|
|||
|
|
\par
|
|||
|
|
\tab\b PUSH1 := GUI.PUSHInit( ... )\par
|
|||
|
|
\b0\par
|
|||
|
|
Creates a new pushbutton object identified by the variable \b PUSH1\b0 which was declared as a \b byte\b0 in the \b VAR\b0 section. This variable will be used to pass in to calls to handle the object and will be returned to you for action in the event that the mouse is clicked on it.\b\par
|
|||
|
|
\b0\par
|
|||
|
|
5) Create a main loop for your application that will service both your application and run the processing for the UI. The UI is processed via the \b ProcessUI\b0 function in \b GUIBase.spin\b0 .\par
|
|||
|
|
\par
|
|||
|
|
\b\tab repeat\par
|
|||
|
|
\tab ProcessApplication\par
|
|||
|
|
\tab elem := GUI.ProcessUI\par
|
|||
|
|
if elem <> -1\par
|
|||
|
|
case elem\par
|
|||
|
|
PUSH1: CallYourFunctionForPUSH1()\par
|
|||
|
|
PUSH2: CallYourFunctionForPUSH1()\par
|
|||
|
|
etc...\par
|
|||
|
|
\pard\li270\b0\par
|
|||
|
|
The \b ProcessUI\b0 function will handle the UI for you, highlighting elements as the mouse passes over them, processing mouse clicks and keyboard entry, etc. It will return -1 if no action is required (i.e. you did not click on anything). If the user clicked on something (i.e. Push Button\b PUSH1\b0 perhaps) it will return the guid of the element that requires action (i.e. \b PUSH1\b0 ). In this case you will need to perform an action associated with the Push Button. It is probably best to keep the main loop clean and call a function to perform tha action rather than do it right in the loop. That makes it easier to read and maintain.\par
|
|||
|
|
\pard\par
|
|||
|
|
\pard\fi-270\li270 6) Create your user action functions, one for each GUI Element that will do something.\par
|
|||
|
|
\par
|
|||
|
|
\pard\par
|
|||
|
|
\par
|
|||
|
|
\par
|
|||
|
|
\par
|
|||
|
|
}
|
|||
|
|
|