
{"id":389,"date":"2017-07-06T11:57:09","date_gmt":"2017-07-06T01:57:09","guid":{"rendered":"http:\/\/bakke.online\/?p=389"},"modified":"2022-01-22T20:10:55","modified_gmt":"2022-01-22T09:10:55","slug":"adding-a-colour-picker-lookup-to-an-ax-form","status":"publish","type":"post","link":"https:\/\/www.bakke.online\/index.php\/2017\/07\/06\/adding-a-colour-picker-lookup-to-an-ax-form\/","title":{"rendered":"Adding a colour picker lookup to an AX form"},"content":{"rendered":"<p>Here&#8217;s a quick and easy way to add a colour picker lookup to an AX form.<\/p>\n<p><a href=\"https:\/\/www.bakke.online\/wp-content\/uploads\/2017\/07\/colourpicker.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-390\" src=\"https:\/\/www.bakke.online\/wp-content\/uploads\/2017\/07\/colourpicker.png\" alt=\"\" width=\"453\" height=\"327\" \/><\/a><\/p>\n<p>I&#8217;ve seen a number of different ways to add colour picker support to an AX form, but so far, this has been the easiest. \u00a0It is not ideal, because the colour picker opens up as a dialog window, something which can&#8217;t be easily worked around without resorting to using custom ActiveX or .NET controls.<\/p>\n<p><!--more--><\/p>\n<h3>Scenario<\/h3>\n<p>In one of my tables, I have a field containing a colour hex code. \u00a0It is used for choosing a background colour of certain elements in an SSRS report, and SSRS insisted on getting hex values. \u00a0To make it easy to edit, I chose to just do this as a string field containing the colour code as a hex value in the format #RRGGBB.<\/p>\n<p>To make it even easier, I decided to add a colour picker lookup so users more used to selecting colours in Microsoft Office or other applications will have a familiar way of entering colours.<\/p>\n<h3>Customising the form<\/h3>\n<p>On the form that needs the colour picker, go to the relevant data source and override the lookup() field method. \u00a0(It is possible to do it on the form control instead, but best practice is to do it on the data source field.)<\/p>\n<p>We declare a local string object to contain the current hex string, defaulted to #FFFFFF in case there is no value, yet. \u00a0We declare R, G, B values and an RGB container. \u00a0 The container is used only to keep the return value from WinAPI::chooseColor().<\/p>\n<pre><span style=\"color: #0000ff;\"><strong>public void<\/strong><\/span> lookup( FormControl _formControl, <span style=\"color: #0000ff;\"><strong>str<\/strong> <\/span>_filterStr )\n{\n  <span style=\"color: #0000ff;\"><strong>str<\/strong>       <\/span>hex = ( YourTableName.ColourFieldName != <span style=\"color: #993300;\">\"\"<\/span> ? YourTableName.ColourFieldName : <span style=\"color: #993300;\">\"#FFFFFF\"<\/span> );\n  <span style=\"color: #0000ff;\"><strong>int<\/strong><\/span>       r = hex<span style=\"color: #000000;\">2Int<\/span>( <span style=\"color: #0000ff;\"><strong>subStr<\/strong><\/span>( hex, <span style=\"color: #ff0000;\"><strong>2<\/strong><\/span>, <span style=\"color: #ff0000;\"><strong>2<\/strong><\/span> ) ); \/\/ Characters 2 and 3\n  <span style=\"color: #0000ff;\"><strong>int<\/strong>       <\/span>g = hex<span style=\"color: #000000;\">2Int<\/span>( <span style=\"color: #0000ff;\"><strong>subStr<\/strong><\/span>( hex, <span style=\"color: #ff0000;\"><strong>4<\/strong><\/span>, <span style=\"color: #ff0000;\"><strong>2<\/strong><\/span> ) ); \/\/ Characters 4 and 5\n  <span style=\"color: #0000ff;\"><strong>int<\/strong>       <\/span>b = hex<span style=\"color: #000000;\">2Int<\/span>( <span style=\"color: #0000ff;\"><strong>subStr<\/strong><\/span>( hex, <span style=\"color: #ff0000;\"><strong>6<\/strong><\/span>, <span style=\"color: #ff0000;\"><strong>2<\/strong><\/span> ) ); \/\/ Characters 6 and 7\n  <span style=\"color: #0000ff;\"><strong>container<\/strong> <\/span>rgb;\n\n  rgb = WinAPI::chooseColor( _formControl.hWnd(), r, g, b, <span style=\"color: #0000ff;\"><strong>null<\/strong><\/span>, <span style=\"color: #0000ff;\"><strong>true<\/strong> <\/span>);<\/pre>\n<p>WinAPI::chooseColor() pops up a colour picker dialog. \u00a0Unfortunately, this is a separate dialog window, and we have no control over its positioning on the screen. \u00a0Its arguments are:<\/p>\n<ul>\n<li>The window handle of the window owning the colour picker. \u00a0We give the hWnd of the calling form control.<\/li>\n<li>R, G and B values of the currently selected colour.<\/li>\n<li>A pointer to a set of custom colours. \u00a0This is used to provide custom colours to the picker, and as we&#8217;re not using it in this example, we pass a\u00a0<strong>null<\/strong>.<\/li>\n<li>A boolean flag to indicate whether the full version of the colour picker, or a trimmed down version with only colour selection boxes will be shown. \u00a0In this example, we want the full version, so we pass\u00a0<strong>true<\/strong>.<\/li>\n<\/ul>\n<pre><span style=\"color: #0000ff;\"><strong>  if<\/strong><\/span>( <span style=\"color: #0000ff;\"><strong>conLen<\/strong><\/span>( rgb ) == <span style=\"color: #ff0000;\"><strong>3<\/strong><\/span> )\n  {\n    [ r, g, b ] = rgb;\n\n    YourTableName.ColourFieldName= <span style=\"color: #0000ff;\"><strong>strFmt<\/strong><\/span>( <span style=\"color: #993300;\">\"#%1%2%3\"<\/span>, int2Hex( r, <span style=\"color: #ff0000;\"><strong>2<\/strong><\/span> ), int2Hex( g, <span style=\"color: #ff0000;\"><strong>2<\/strong><\/span> ), int2Hex( b, <span style=\"color: #ff0000;\"><strong>2<\/strong><\/span> ) );\n    _formControl.update();\n  }\n}<\/pre>\n<p>Next, we check the return value we got from WinAPI::chooseColor(). \u00a0If we have a valid colour, the container will have 3 elements. \u00a0Otherwise, the colour is not valid. \u00a0If the colour is valid, we split the container into the R, G and B values and use that to build the hex string, which then gets put back into the same record field we got it from. \u00a0Finally, we tell the calling control to update itself so the user can see the newly selected value.<\/p>\n<h3>Using other data types<\/h3>\n<p>If you are using other data types to contain the colour values, for example an int to contain a 24-bit value or a container field to just keep the RGB container, you can still use the same concept as described above. \u00a0However, the code to get the current colour value from the record and also to write it back would need to change.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Here&#8217;s a quick and easy way to add a colour picker lookup to an AX form. I&#8217;ve seen a number of different ways to add colour picker support to an AX form, but so far, this has been the easiest. \u00a0It is not ideal, because the colour picker opens up as a dialog window, something &hellip; <a href=\"https:\/\/www.bakke.online\/index.php\/2017\/07\/06\/adding-a-colour-picker-lookup-to-an-ax-form\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Adding a colour picker lookup to an AX form&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4,1],"tags":[2,3,5],"class_list":["post-389","post","type-post","status-publish","format-standard","hentry","category-dynamics-ax","category-uncategorized","tag-ax2012r3","tag-dynamics-ax","tag-user-interface"],"_links":{"self":[{"href":"https:\/\/www.bakke.online\/index.php\/wp-json\/wp\/v2\/posts\/389","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.bakke.online\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.bakke.online\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.bakke.online\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bakke.online\/index.php\/wp-json\/wp\/v2\/comments?post=389"}],"version-history":[{"count":1,"href":"https:\/\/www.bakke.online\/index.php\/wp-json\/wp\/v2\/posts\/389\/revisions"}],"predecessor-version":[{"id":1330,"href":"https:\/\/www.bakke.online\/index.php\/wp-json\/wp\/v2\/posts\/389\/revisions\/1330"}],"wp:attachment":[{"href":"https:\/\/www.bakke.online\/index.php\/wp-json\/wp\/v2\/media?parent=389"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bakke.online\/index.php\/wp-json\/wp\/v2\/categories?post=389"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.bakke.online\/index.php\/wp-json\/wp\/v2\/tags?post=389"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}