LISTWHEEL background loses transparency

    This site uses cookies. By continuing to browse this site, you are agreeing to our Cookie Policy.

    • LISTWHEEL background loses transparency

      Hello to everyone,

      I have a question implementing a listwheel with semitransparent rounded rect as a background.

      Here is the code for 320 * 240 desktop:

      C Source Code

      1. #include "DIALOG.h"
      3. // Listwheel and its items
      4. LISTWHEEL_Handle hLstw;
      5. const GUI_ConstString pItems[] = { "10", "20", "30", "40", "50" };
      7. // Draw some data on the desktop
      8. void _cbBk(WM_MESSAGE * pMsg) {
      9. switch (pMsg->MsgId) {
      10. case WM_PAINT:
      11. GUI_SetBkColor(GUI_DARKBLUE);
      12. GUI_Clear();
      13. GUI_SetFont(GUI_FONT_8X16X3X3);
      14. GUI_DispStringHCenterAt("Background", 160, 100);
      15. break;
      16. default:
      17. WM_DefaultProc(pMsg);
      18. break;
      19. }
      20. }
      22. // Draw green semitransparent rounded rect as a background of the listwheel
      23. int _LISTWHEEL_Draw(const WIDGET_ITEM_DRAW_INFO * pDrawItemInfo) {
      24. switch (pDrawItemInfo->Cmd) {
      25. case WIDGET_ITEM_DRAW_BACKGROUND:
      26. GUI_EnableAlpha(1);
      27. GUI_SetColor((0x80uL << 24) | GUI_GREEN);
      28. GUI_AA_FillRoundedRect(pDrawItemInfo->x0, pDrawItemInfo->y0, pDrawItemInfo->x1, pDrawItemInfo->y1, 5);
      29. GUI_EnableAlpha(0);
      30. break;
      31. default:
      32. return LISTWHEEL_OwnerDraw(pDrawItemInfo);
      33. break;
      34. }
      36. return 0;
      37. }
      39. void MainTask(void) {
      41. GUI_Init();
      43. WM_MULTIBUF_Enable(1);
      45. WM_SetSize(WM_HBKWIN, 320, 240);
      47. // Set desktop callback
      48. WM_SetCallback(WM_HBKWIN, _cbBk);
      50. // Create a listwheel, set some parameters and owner draw function
      51. hLstw = LISTWHEEL_CreateEx(110, 40, 100, 160, WM_HBKWIN, WM_CF_SHOW, 0, GUI_ID_LISTWHEEL0, pItems);
      52. LISTWHEEL_SetFont(hLstw, GUI_FONT_32_ASCII);
      53. LISTWHEEL_SetTextAlign(hLstw, GUI_TA_HCENTER | GUI_TA_VCENTER);
      54. LISTWHEEL_SetTextColor(hLstw, LISTWHEEL_CI_UNSEL, GUI_LIGHTGRAY);
      55. LISTWHEEL_SetTextColor(hLstw, LISTWHEEL_CI_SEL, GUI_DARKBLUE);
      56. LISTWHEEL_SetOwnerDraw(hLstw, _LISTWHEEL_Draw);
      57. WM_SetHasTrans(hLstw);
      59. while (1) {
      60. GUI_Delay(50);
      61. }
      62. }
      Display All
      All is ok until listwheel reacts on moving. Then it loses transparency.

      It is solved with using a memory device:

      C Source Code

      1. #include "DIALOG.h"
      3. // Listwheel and its items
      4. LISTWHEEL_Handle hLstw;
      5. const GUI_ConstString pItems[] = { "10", "20", "30", "40", "50" };
      7. // Memory device for the background
      8. GUI_MEMDEV_Handle hMem;
      10. // Draw some data on the desktop
      11. void _cbBk(WM_MESSAGE * pMsg) {
      12. switch (pMsg->MsgId) {
      13. case WM_PAINT:
      14. GUI_SetBkColor(GUI_DARKBLUE);
      15. GUI_Clear();
      16. GUI_SetFont(GUI_FONT_8X16X3X3);
      17. GUI_DispStringHCenterAt("Background", 160, 100);
      18. break;
      19. default:
      20. WM_DefaultProc(pMsg);
      21. break;
      22. }
      23. }
      25. // Draw green semitransparent rounded rect as a background of the listwheel from the memory device
      26. int _LISTWHEEL_Draw(const WIDGET_ITEM_DRAW_INFO * pDrawItemInfo) {
      27. switch (pDrawItemInfo->Cmd) {
      28. case WIDGET_ITEM_DRAW_BACKGROUND:
      29. GUI_MEMDEV_WriteAt(hMem, 110, 40);
      30. break;
      31. default:
      32. return LISTWHEEL_OwnerDraw(pDrawItemInfo);
      33. break;
      34. }
      36. return 0;
      37. }
      39. void MainTask(void) {
      41. GUI_Init();
      43. WM_MULTIBUF_Enable(1);
      45. WM_SetSize(WM_HBKWIN, 320, 240);
      47. // Set desktop callback
      48. WM_SetCallback(WM_HBKWIN, _cbBk);
      50. // Create a memory device and draw green semitransparent rounded rect in there
      51. hMem = GUI_MEMDEV_CreateFixed32(0, 0, 100, 160);
      52. GUI_MEMDEV_Select(hMem);
      53. GUI_SetBkColor(GUI_TRANSPARENT);
      54. GUI_Clear();
      55. GUI_PreserveTrans(1);
      56. GUI_SetColor((0x80uL << 24) | GUI_GREEN);
      57. GUI_AA_FillRoundedRect(0, 0, 99, 159, 5);
      58. GUI_PreserveTrans(0);
      59. GUI_MEMDEV_Select(0);
      61. // Create a listwheel, set some parameters and owner draw function
      62. hLstw = LISTWHEEL_CreateEx(110, 40, 100, 160, WM_HBKWIN, WM_CF_SHOW, 0, GUI_ID_LISTWHEEL0, pItems);
      63. LISTWHEEL_SetFont(hLstw, GUI_FONT_32_ASCII);
      64. LISTWHEEL_SetTextAlign(hLstw, GUI_TA_HCENTER | GUI_TA_VCENTER);
      65. LISTWHEEL_SetTextColor(hLstw, LISTWHEEL_CI_UNSEL, GUI_LIGHTGRAY);
      66. LISTWHEEL_SetTextColor(hLstw, LISTWHEEL_CI_SEL, GUI_DARKBLUE);
      67. LISTWHEEL_SetOwnerDraw(hLstw, _LISTWHEEL_Draw);
      68. WM_SetHasTrans(hLstw);
      70. while (1) {
      71. GUI_Delay(50);
      72. }
      73. }
      Display All
      Now all is ok. But why it is not working when drawing "on the run"?

      Thanks,
      Alex.

      The post was edited 2 times, last by LexaGB ().

    • Hi,

      I changed the line for setting the color in _LISTWHEEL_Draw() into

      C Source Code

      1. GUI_SetColor((0x80uL << 24) | (GUI_GREEN & ~0xFF000000));
      and it is working.

      Depending on the color format emWin uses internally, the alpha bits can be 0x00 or 0xFF for opaque.

      If the library is compiled with GUI_USE_ARGB 1 an alpha channel with 0xFF means opaque. If it is compiled with GUI_USE_ARGB 0 the bits are inverted (0x00 is opaque).

      When GUI_USE_ARGB is set to 1 GUI_GREEN is defined as 0xFF00FF00. 0xFF00FF00 ORed with 0x80000000 is still 0xFF00FF00 resulting in an opaque green rectangle.

      But, while writing these lines I'm wondering why it works in first time and stops working when moving the LISTWHEEL.

      Which emWin version are you using?
      Which driver?
      Is GUI_USE_ARGB defined in your GUIConf.h?

      Regards,
      Sven
      Please read the forum rules before posting.

      Keep in mind, this is *not* a support forum.
      Our engineers will try to answer your questions between their projects if possible but this can be delayed by longer periods of time.
      Should you be entitled to support you can contact us via our support system: segger.com/ticket/
      Or you can contact us via e-mail.

    • Hello, Sven,

      This appears in simulation v5.44 (GUISim.lib from SEGGER package) and on real hardware using STemWin v5.44 (STemWin_CM7_wc32_ot.a from ST package).

      I'm using ABGR mode (GUI_USE_ARGB is set to 0) so we don't need to clear "alpha byte" of the color value. "...GUI_GREEN & ~0xFF000000..." didn't change anything on my side.

      If I comment GUI_EnableAlpha(0) transparency is not lost (understandably) and of course it would slow down the system.

      upd: on the hardware driver is GUIDRV_LIN_16, color conversion is GUICC_M565.

      Alex.

    • Hi,

      I think this is related to GUI_EnableAlpha(). Between V5.44 and V5.50 where some changes regarding the alpha module and this behavior should be fixed.

      Unfortunately, there is not much you can do about it, except of using a memory device or a bitmap for the background.

      Regarding GUI_USE_ARGB, I highly recommend to use a library compiled with GUI_USE_ARGB 1. This has the best performance on STM32 devices.

      Regards,
      Sven
      Please read the forum rules before posting.

      Keep in mind, this is *not* a support forum.
      Our engineers will try to answer your questions between their projects if possible but this can be delayed by longer periods of time.
      Should you be entitled to support you can contact us via our support system: segger.com/ticket/
      Or you can contact us via e-mail.

    • Ok, Sven, thanks for clarifying,

      but one thing stops me from using ARGB. It is GUIBuilder that works in ABGR mode :) .

      So the colors look incorrectly. I got used to it for creating dialogs.

      Alex.

      The post was edited 3 times, last by LexaGB ().

    • Hi,

      the GUIBuilder should wrap color values with a macro like:

      GUI_MAKE_COLOR(0x000000FF) // Red

      This macor converts the given ABGR value into the proper byte order.

      Regards,
      Sven
      Please read the forum rules before posting.

      Keep in mind, this is *not* a support forum.
      Our engineers will try to answer your questions between their projects if possible but this can be delayed by longer periods of time.
      Should you be entitled to support you can contact us via our support system: segger.com/ticket/
      Or you can contact us via e-mail.

    • Yes,

      GUI_MAKE_COLOR is doing its job,

      but if I assign the ARGB-image to the IMAGE widget then the image in GUIBuilder looks like red and blue are swapped :) .

      Alex.