Create and implement a Retail POS skin
Important
This content is archived and is not being updated. For the latest documentation, see Microsoft Dynamics 365 product documentation. For the latest release plans, see Dynamics 365 and Microsoft Power Platform release plans.
Applies To: Microsoft Dynamics AX 2012 R3, Microsoft Dynamics AX 2012 R2, Microsoft Dynamics AX 2012 Feature Pack
You can change the look and feel of Microsoft Dynamics AX for Retail POS registers by creating new Retail POS skins. To create or modify existing Retail POS skins, you must obtain a license from DevExpress. Retail POS uses DXExperience Winforms created by DevExpress. You can develop your own forms without using DevExpress, but it is recommended you use these to maintain a consistent look and feel.
Creating a new skin
Go to the SkinEditor tool, which is typically found at <root>\Program Files (x86)\DevExpress 2011.2\Components\Tools\Windows Forms (where 2011.2 is the version number of the product). Double-click the SkinEditor icon to launch the tool.
-
Click File->New to open the New Project window.
Set the Project Name: field to MyFirstCustomSkin.
Change the Template Skin: field from DevExpressStyle to Office 2010 Blue using the dropdown arrow.
Set the Skin Name: to MyFirstCustomSkin and click the OK button. Your new skin project is now loaded within the SkinEditor tool, which contains a list of UI elements called Products. For the remainder of this topic, Products will be referred to as controls.
Setting color properties on your new skin
The UI elements that ship with Retail POS use only a subset of the controls and properties available in DevExpress SkinEditor. They are listed in the following table:
UI element
Navigation path
Property
TabPane background
Tab > TabPane
SolidImageCenterColor
TabPane font
Tab > TabPane
ForeColor
Form background
Common > Group Panel
SolidImageCenterColor
Label font
Common > label
ForeColor
Group panel font
Common > GroupPanel > NoBorder
ForeColor
Status bar center
Bars > LinkBorderPainter
SolidImageCenterColor
Status bar inner
Bars > StatusBar
SolidImageCenterColor
Status bar border
Bars > StatusBar
BackColor
Link border
Bars > LinkBorderPainter
<imagefile>
Form background
Common > GroupPanel
BackColor
Form header
Common > GroupPanel
ForeColor
Grid ColumnHeader
Grid > Header
SolidImageCenterColor
Grid ColumnHeader Left
Grid > Header > Left
SolidImageCenterColor
Grid ColumnHeader Right
Grid > Header > Right
SolidImageCenterColor
Grid ColumnHeader font
Grid > Header
ForeColor
Grid Grid Line
Grid > GridLine
BackColor
Grid Row Font
Grid > GridRow
ForeColor
Grid Row Background
Grid > GridRow
BackColor
Grid EmptyAreaBackground
Grid > GridEmptyArea
BackColor
Button font
Common > Button
ForeColor
Button DisabledFont
Common > Button
DisabledText
Button Background
Common > Button
SolidImageCenterColor
Grid Row Comment
Grid > GridPreview
ForeColor
Set the Common > Control color property to Blue.
Set the Common > ControlText color property to White.
Click File->Save .
You must now convert your project into an assembly that will be used by Retail POS. Click File->Create Assembly. You should see a confirmation dialog similar to the following:
Typically, newly generated skin assemblies are placed in the <root>:\Users\<username>\Documents\My DXSkins\ directory. There will be a folder beneath that directory with the same name as your skin, in this case MyFirstCustomSkin. Inside that folder, you will find a MyFirstCustomSkin.dll.
Launching Retail POS with your new skin
In order for Retail POS to load your new skin, you must place the skin assembly in the Retail POS runtime folder. Copy the MyFirstCustomSkin.dll to the Skins folder underneath the Retail POS runtime directory.
You also need to make Retail POS aware of your new skin.
Using Commerce Data Exchange: Synch Service
Open Microsoft Dynamics AX for Retail Headquarters and go to Retail->Setup->POS->Profiles->Visual Profiles.
Right-click the Theme dropdown and click View Details.
Click the New button and set the POS skin name field to MyFirstCustomSkin.
Close the POS skins form and with the POS visual profiles form still open, set the Theme dropdown to MyFirstCustomSkin. Close the form.
Go to Retail->Periodic->Data Distribution->Distribution Schedule. Select the N-1090 job and then click the Run directly button. This will synch the new skin to Retail POS. You can run the following query against the AXRetailPOS database to make sure this procedure worked:
SELECT POSSKINNAME, * from RetailVisualProfile
Launch Retail POS and your new skin’s visualization effects should display similar to the following image.