Wiley.Developing.Software.for.Symbian.OS.2nd.Edition.Dec.2007 (779887), страница 74
Текст из файла (страница 74)
I will not cover all details of theresource, but will discuss the main points. To simplify the example, I stilldefine the strings directly in the resource file. However, as discussed inthe last section, the correct way is to define them in an RLS file using therls string keyword.DIALOGS389Figure 12.9 SimpleEx Dialog in UIQBelow is the QIK DIALOG resource:RESOURCE QIK_DIALOG r_Simpleex_dialog{title="SimpleEx Settings";configurations ={QIK_DIALOG_CONFIGURATION{ui_config_mode = KQikPenStyleTouchPortrait;container = r_simpleex_dialog_container;command_list = r_simpleex_dialog_commands;}};controls = r_simpleex_dialog_controls;}Like UIQ views, dialogs can specify one or more display configurationsthat the dialog will support, along with a container specifying what is onthe dialog and the commands associated with the dialog for each mode.In the example, we support only the KQikPenStyleTouchPortraitmode.
The controls attribute points to a QIK CONTROL COLLECTIONresource, which defines a group of controls. The controls in this collectionwill not necessarily all be displayed on the dialog (although they are forthis example), but are meant to be a raw group of controls that can390GUI APPLICATION PROGRAMMINGbe referenced by numerous dialogs if desired. As we’ll see shortly, thecontainer (r simplex dialog container for our example) definesexactly how the dialog is displayed and what controls are used. Below isour r simpleex dialog controls QIK CONTROL COLLECTIONresource, along with the control resources referenced:RESOURCE QIK_CONTROL_COLLECTION r_simpleex_dialog_controls{items ={QIK_CONTROL{unique_handle =ESimpleExText;type=EEikCtEdwin;control = r_dialog_edit;},QIK_CONTROL{type=EEikCtChoiceList;unique_handle=ESimpleExColor;control=r_dialog_choice;}};}RESOURCE CHOICELIST r_dialog_choice{array_id=r_color_list;}RESOURCE EDWIN r_dialog_edit{flags = EEikEdwinResizable;maxlength = 256;}RESOURCE ARRAY r_color_list{items={{LBUF { txt="Black"; },LBUF { txt="Red"; },LBUF { txt="Green"; },LBUF { txt="Blue"; }};}The items attribute of QIK CONTROL COLLECTION is an array ofQIK CONTROL structures.
Each QIK CONTROL item indicates a control. Here we have our text box and choice list. The unique handleattribute specifies an ID for the control that your dialog class can reference to access the control. All control handles are stored in theapplication HRH file as an enum. Pointers to the control object areobtained by calling the LocateControlByUniqueHandle<controlclass>(controlId) method in the UIQ dialog class, as we will seeshortly. The type attribute specifies the type of control. For example, theDIALOGS391first control is EEikCtEdwin, which is a text editor for our text field. Atype of EEikCtEdwin means that the control resource is of type EDWIN.EDWIN is defined as:STRUCT{LONGWORDWORDWORD}EDWINflags=0;width=0;lines=1;maxlength=0;In the example, I define the flags so that the field is resizable and themaximum length of the entered string (maxlength) is 255.See the SDK documentation for lists of all the predefined controlresource structures, and descriptions of their attributes.As second control of the dialog, I have the choice list where the usercan select the color of the screen text.
The control type for a choice listis EEikCtChoiceList and the corresponding control resource type isCHOICELIST.CHOICELIST is defined as:STRUCT CHOICELIST{WORD flags=0;WORD maxdisplaychar=0;LLINK array_id=0;}The important attribute here is array id, which points to an arrayresource that contains the text for each choice in the choice list.In the example, I assign array id to r color list, and definer color list in the resource file as follows:RESOURCE ARRAY r_color_list{items={LBUF { txt="Black"; },LBUF { txt="Red"; },LBUF { txt="Green"; },LBUF { txt="Blue"; }};}ARRAY is defined in badef.rh as:STRUCT ARRAY{392GUI APPLICATION PROGRAMMINGSTRUCT items[];}Finally, LBUF is defined as:STRUCT LBUF{LTEXT txt; // leading-byte counted text string}Here is the command resource for our dialog:RESOURCE QIK_COMMAND_LIST r_simpleex_dialog_commands{items={QIK_COMMAND{id = EDialogDoneCmd;type = EQikCommandTypeDone;text = "Done";},QIK_COMMAND{id = EDialogCancelCmd;type = EQikCommandTypeCancel;cpfFlags = EQikCpfFlagHardwarekeyOnly;}};}These commands will be handled via the HandleCommandL()method of our UIQ dialog class.
The type attribute defines what kind ofcommand it is, and this information is used to help determine how thecommand will be presented to the user (menu, softkey, button, etc.). Theline:cpfFlags = EQikCpfFlagHardwarekeyOnly;in the last QIK COMMAND indicates that the cancel button will not beon the dialog itself, but instead associated with a hardware key (i.e.,a softkey).Below is our container resource, with two building blocks that definewhat will be on our dialog:RESOURCE QIK_CONTAINER_SETTINGS r_simpleex_dialog_container{controls ={DIALOGS393QIK_CONTAINER_ITEM_CI_LI{type = EQikCtCaptionedOnelineBuildingBlock;control = r_dialogs_text_dialog_simpleex_building_block_text;},QIK_CONTAINER_ITEM_CI_LI{type = EQikCtCaptionedOnelineBuildingBlock;control = r_dialogs_text_dialog_simpleex_building_block_choice;}};}RESOURCE QIK_SYSTEM_BUILDING_BLOCKr_dialogs_text_dialog_simpleex_building_block_text{content ={QIK_SLOT_CONTENT{slot_id = EQikItemSlot1;caption = "Text";},QIK_SLOT_CONTENT{slot_id = EQikItemSlot2;unique_handle=ESimpleExText;}};}RESOURCE QIK_SYSTEM_BUILDING_BLOCKr_dialogs_text_dialog_simpleex_building_block_choice{content ={QIK_SLOT_CONTENT{slot_id = EQikItemSlot1;caption = "Color";},QIK_SLOT_CONTENT{slot_id = EQikItemSlot2;unique_handle=ESimpleExColor;}};}The QIK CONTAINER SETTINGS resource defines a container thatis basically a list of controls to be displayed on our dialog.
The controls attribute of QIK CONTAINER SETTINGS defines an array ofQIK CONTAINER ITEM CI LI structures, which specifies each control in the container. We would like two items on our dialog, one for thetext edit box along with a caption, and one for the color choice list alsowith a caption. UIQ defines a special mechanism for creating compoundcontrols via what are known as building block resources. We definetwo of these building blocks: r dialogs text dialog simpleex394GUI APPLICATION PROGRAMMINGbuilding block text to define a compound control consisting of theedit box with its caption, and r dialogs text dialog simpleexbuilding block choice for the choice list with its caption. Bothare of type EQikCtCaptionedOnelineBuildingBlock, which indicates that the item consists of both a caption and a control.
The controlattribute of the QIK CONTAINER ITEM CI LI structure points to theseQIK SYSTEM BUILDING BLOCK resources, which defines one or more‘slots’ that make up the dialog item. For a captioned control, the resourceshould consist of two slots, one for the caption and one for the control itself. The control is referenced in slot 2 via the unique handleattribute.
This matches up to the control with that handle in our controlcollection resource (r simpleex dialog controls).Note that although we use containers and building blocks to create adialog, you can also use them to create views, which display the controlsdirectly on your application screen without using a dialog.
The containeris referenced in the page content attribute of the QIK VIEW PAGEstructure of the QIK VIEW PAGES resource associated with your view.Reference the UIQ SDK documentation and examples for more detailson this.Now let’s look at the dialog class declaration:class CSimpleExDialog : public CQikSimpleDialog{public:static TInt RunDlgLD(TDes& aText, TRgb& aColor);~CSimpleExDialog();void HandleCommandL(CQikCommand& aCommand);void PreLayoutDynInitL();private:CSimpleExDialog(TDes& aText, TRgb& aColor);void ConstructL();CQikCommandManager& iCmdManager;TDes& iText;TRgb& iColor;};And here is the dialog class implementation:TInt CSimpleExDialog::RunDlgLD(TDes& aText, TRgb& aColor){CSimpleExDialog* self = new (ELeave) CSimpleExDialog(aText, aColor);CleanupStack::PushL(self);self->ConstructL();CleanupStack::Pop();return self->ExecuteLD(R_SIMPLEEX_DIALOG);}CSimpleExDialog::CSimpleExDialog(TDes& aText, TRgb& aColor): iCmdManager(CQikCommandManager::Static(*iCoeEnv)), iText(aText),iColor(aColor){}DIALOGS395CSimpleExDialog::~CSimpleExDialog(){}void CSimpleExDialog::ConstructL(){}const TInt KNumColors=4;const TRgb colorList[KNumColors]={KRgbBlack,KRgbRed,KRgbGreen,KRgbBlue};void CSimpleExDialog::PreLayoutDynInitL(){CEikEdwin* edwin =LocateControlByUniqueHandle<CEikEdwin> (ESimpleExText);edwin->SetTextL(&iText);TInt currColorIndex=0;for (TInt i=0;i< KNumColors;i++){if (iColor==colorList[i]){currColorIndex=i;break;}}CEikChoiceList* chlist =LocateControlByUniqueHandle<CEikChoiceList>(ESimpleExColor);chlist->SetCurrentItem(currColorIndex);}void CSimpleExDialog::HandleCommandL(CQikCommand& aCommand){switch(aCommand.Id()){case EDialogDoneCmd:{const CEikEdwin* edwin = LocateControlByUniqueHandle<const CEikEdwin> (ESimpleExText);edwin->GetText(iText);const CEikChoiceList* chlist =LocateControlByUniqueHandle<const CEikChoiceList>(ESimpleExColor);TIt cIndex = chlist->CurrentItem();iColor = colorList[cIndex];CloseDialog(aCommand.Id());break;}default:{CQikSimpleDialog::HandleCommandL(aCommand);break;}}}The CSimpleExDialog::RunDlgLD() method will create the dialog, run it, and destroy it.
When the dialog is launched, PreLayoutDynInitL() is called – you override this method in your dialog classto set the initial values of the dialog controls like we do here. HandleCommandL() is called when the user invokes one of the commandswe defined in the dialog. Here, we have a Done button: when depressed,396GUI APPLICATION PROGRAMMINGwe read the data in the controls and return them in the variables referenced by iText and iColor (passed to RunDlgLD()) and the dialogis dismissed.Launching the dialogTo launch the dialog, I added a menu item called Settings to thecommand resource in the resource file:RESOURCE QIK_COMMAND_LIST r_simpleex_commands{items ={QIK_COMMAND{id = ESimpleExCommand;type = EQikCommandTypeScreen;text = "Start";},QIK_COMMAND{id = ESimpleExDialog;type = EQikCommandTypeScreen;text = "Settings";}};}I added the following case to the command handler switch statementin the SimpleEx view class:case ESimpleExDialog:CSimpleExDialog::RunDlgLD(iDisplayText,iTextColor);DrawNow();break;I also updated the SimpleEx Draw() function to use iDisplayTextand iTextColor to display the window text:void CSimpleExAppView::Draw(const TRect&) const{CWindowGc& gc = SystemGc();gc.Clear();const CFont*font;font = iEikonEnv->TitleFont();gc.UseFont(font);TRect drawRect = Rect();TIntbaselineOffset=(drawRect.Height() - font->HeightInPixels())/2;gc.SetPenColor(iTextColor);gc.DrawText(iDisplayText,drawRect,baselineOffset,CGraphicsContext::ECenter, 0);gc.DiscardFont();}DIALOGS39712.5.2 Creating a Basic S60 DialogNow let’s create a dialog for S60 that’s equivalent to the UIQ onejust presented.
There are various ways to create a dialog for S60. Forthis example, I use an S60 dialog type known as a form. A form isa good general-purpose type of dialog to use as it guarantees that thedialog conforms to the S60 UI guidelines. Forms derive from CAknForm, which itself extends CAknDialog. CAknDialog is the dialogclass that all S60 dialogs inherit from. Note that using CAknDialog directly in S60, however, can cause problems and should beavoided.A form displays a set of data fields in the form of a list, with eachdata field in the list consisting of a label and a control.
The labelcan be on the same line as the control, or it can be on a separateline, with the control below it. In addition, a form dialog is automatically associated with a standard menu that supplies the options:Add field, Edit label, Delete field, Save and, optionally,Edit. Selecting one of the first four of these options results in a callto the appropriate one of the CAknForm functions: AddItemL(),EditCurrentLabel(), DeleteCurrentItem(), and SaveFormDataL().An S60 form has two modes: in ‘view’ mode it acts as an application view that displays a list of data items, and in ‘edit’ mode itcan be used to modify the data items displayed. By default, it startsup in ‘view’ mode and you can switch to ‘edit’ mode by selectingthe Edit menu option. When you have finished editing the data,you press the right softkey (temporarily labeled Done) to return to the‘view’ mode.A form is actually more powerful than a dialog.