Friday, April 20th 2018, 12:23pm UTC+2

You are not logged in.

  • Login
  • Register

Dear visitor, welcome to SEGGER Forum. If this is your first visit here, please read the Help. It explains how this page works. You must be registered before you can use all the page's features. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

Dismuntel

Beginner

Date of registration: Nov 3rd 2017

Posts: 5

1

Tuesday, February 20th 2018, 10:06am

LISTVIEW_Transparent background

Good Morning:

I'm using the listview widget and I can not get the background to look transparent


I activate the transparent flag in the creation of the object.




static const GUI_WIDGET_CREATE_INFO _aDialogCreate[] = {
{ WINDOW_CreateIndirect, "Window", ID_WINDOW_LISTA, 0, 0, 480, 272, WM_CF_MEMDEV | WM_CF_MEMDEV_ON_REDRAW, 0x0, 0 },
{ IMAGE_CreateIndirect, "Image", ID_LISTA_IMAGE_0, 0, 0, 480, 272, 0, 0, 0 },
{ LISTVIEW_CreateIndirect, "Listview", ID_LISTVIEW_0, 0, 40, 480, 232, WM_CF_HASTRANS, 0x0, 0 },
{ IMAGE_CreateIndirect, "Image", ID_LISTA_IMAGE_BARRA, 0, 0, 480, 40, 0, 0, 0 },
{ TEXT_CreateIndirect, "Text", ID_LISTA_TEXT_REFRIGERANTE, 20, 0, 460, 40, 0, 0x0, 0 },
{ TEXT_CreateIndirect, "Text", ID_LISTA_TEXT_MENU, 0, 0, 460, 40, 0, 0x0, 0 },
// USER START (Optionally insert additional widgets)
// USER END
};

When I define the color of the background, I indicate that it is transparent and the screen paints the background of black color



LISTVIEW_SetBkColor(hItem, LISTVIEW_CI_UNSEL, GUI_TRANSPARENT);
LISTVIEW_SetBkColor(hItem, LISTVIEW_CI_SEL, GUI_TRANSPARENT);
LISTVIEW_SetBkColor(hItem, LISTVIEW_CI_SELFOCUS, GUI_ORANGE);

But, if I define that the background is "invalid color", the screen paints the background of white color.


LISTVIEW_SetBkColor(hItem, LISTVIEW_CI_UNSEL, GUI_INVALID_COLOR);
LISTVIEW_SetBkColor(hItem, LISTVIEW_CI_SEL, GUI_INVALID_COLOR);
LISTVIEW_SetBkColor(hItem, LISTVIEW_CI_SELFOCUS, GUI_ORANGE);

What should I do to see the transparent background?

SEGGER - Schoenen

Super Moderator

Date of registration: Aug 13th 2015

Posts: 561

2

Tuesday, February 20th 2018, 11:19am

Hi,

I agree with you that the widget should become transparent if the transparency flag is set and GUI_TRANSPARENT is its bk color.
We will change the drawing behavior of the LISTVIEW in a future release.

For now you can set a custom owner draw function for the widget and react on WIDGET_ITEM_DRAW_BACKGROUND. Simply do nothing if the item to be drawn is not the selected one. IF the item is the selected call the default owner draw function to clear the area with orange.

Here is an example on how to achieve a transparent LISTVIEW:

C/C++ Source code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
#include "DIALOG.h"

/*********************************************************************
*
*   	Externals
*
**********************************************************************
*/

/*********************************************************************
*
*   	Defines
*
**********************************************************************
*/
#define ID_WINDOW_0     	(GUI_ID_USER + 0x00)
#define ID_LISTVIEW_0     	(GUI_ID_USER + 0x01)

/*********************************************************************
*
*   	Static data
*
**********************************************************************
*/
/*********************************************************************
*
*   	_aDialogCreate
*/
static const GUI_WIDGET_CREATE_INFO _aDialogCreate[] = {
  { WINDOW_CreateIndirect, "Window", 	ID_WINDOW_0,	0,  0, 480, 272, 0, 0x0, 0 },
  { LISTVIEW_CreateIndirect, "Listview", ID_LISTVIEW_0, 40, 40, 240, 150, 0, 0x0, 0 },
};

/*********************************************************************
*
*   	Static code
*
**********************************************************************
*/
/*********************************************************************
*
*   	_cbDialog
*/
static int _OwnerDraw(const WIDGET_ITEM_DRAW_INFO * pDrawItemInfo) {
  int Sel;

  switch (pDrawItemInfo->Cmd) {
  case WIDGET_ITEM_DRAW_BACKGROUND:
	//
	// Check if the current item is the selected.
	//
	Sel = LISTVIEW_GetSel(pDrawItemInfo->hWin);
	if ((Sel == pDrawItemInfo->ItemIndex) && (Sel != -1)) {
  	//
  	// If it is, use the default owner draw to fill the area with orange
  	//
  	LISTVIEW_OwnerDraw(pDrawItemInfo);
	} else {
  	//
  	// Else, do nothing, the background gets cleared by the window behind the LISTVIEW
  	//
  	return 0;
	}
  default:
	return LISTVIEW_OwnerDraw(pDrawItemInfo);
  }
}

/*********************************************************************
*
*   	_cbDialog
*/
static void _cbDialog(WM_MESSAGE * pMsg) {
  WM_HWIN  hItem;
  int  	NCode;
  int  	Id;
  GUI_RECT Rect;

  switch (pMsg->MsgId) {
  case WM_INIT_DIALOG:
	//
	// Initialization of 'Listview'
	//
	hItem = WM_GetDialogItem(pMsg->hWin, ID_LISTVIEW_0);
	WM_SetHasTrans(hItem);

	LISTVIEW_SetOwnerDraw(hItem, _OwnerDraw);

	LISTVIEW_AddColumn(hItem, 80, "Col 0", GUI_TA_HCENTER | GUI_TA_VCENTER);
	LISTVIEW_AddColumn(hItem, 80, "Col 1", GUI_TA_HCENTER | GUI_TA_VCENTER);
	LISTVIEW_AddColumn(hItem, 80, "Col 2", GUI_TA_HCENTER | GUI_TA_VCENTER);
	LISTVIEW_AddRow(hItem, NULL);
	LISTVIEW_AddRow(hItem, NULL);
	LISTVIEW_AddRow(hItem, NULL);
	LISTVIEW_SetItemText(hItem, 0, 0, "Item");
	LISTVIEW_SetItemText(hItem, 0, 1, "Item");
	LISTVIEW_SetItemText(hItem, 0, 2, "Item");

	LISTVIEW_SetItemText(hItem, 1, 0, "Item");
	LISTVIEW_SetItemText(hItem, 1, 1, "Item");
	LISTVIEW_SetItemText(hItem, 1, 2, "Item");

	LISTVIEW_SetItemText(hItem, 2, 0, "Item");
	LISTVIEW_SetItemText(hItem, 2, 1, "Item");
	LISTVIEW_SetItemText(hItem, 2, 2, "Item");

	LISTVIEW_SetGridVis(hItem, 1);

	LISTVIEW_SetBkColor(hItem, LISTVIEW_CI_UNSEL, GUI_TRANSPARENT);
	LISTVIEW_SetBkColor(hItem, LISTVIEW_CI_SEL, GUI_TRANSPARENT);
	LISTVIEW_SetBkColor(hItem, LISTVIEW_CI_SELFOCUS, GUI_ORANGE);

	break;
  case WM_NOTIFY_PARENT:
	Id	= WM_GetId(pMsg->hWinSrc);
	NCode = pMsg->Data.v;
	switch(Id) {
	case ID_LISTVIEW_0: // Notifications sent by 'Listview'
  	switch(NCode) {
  	case WM_NOTIFICATION_CLICKED:
    	break;
  	case WM_NOTIFICATION_RELEASED:
    	break;
  	case WM_NOTIFICATION_SEL_CHANGED:
    	break;
  	}
  	break;
	}
	break;
  case WM_PAINT:
	WM_GetClientRect(&Rect);
	GUI_DrawGradientH(Rect.x0, Rect.y0, Rect.x1, Rect.y1, GUI_RED, GUI_GREEN);
	break;
  default:
	WM_DefaultProc(pMsg);
	break;
  }
}

/*********************************************************************
*
*   	Public code
*
**********************************************************************
*/
/*********************************************************************
*
*   	MainTask
*/
void MainTask(void) {
  GUI_Init();
  GUI_CreateDialogBox(_aDialogCreate, GUI_COUNTOF(_aDialogCreate), _cbDialog, WM_HBKWIN, 0, 0);
  while (1) {
	GUI_Delay(100);
  }
}

/*************************** End of file ****************************/


Regards
Sven

Dismuntel

Beginner

Date of registration: Nov 3rd 2017

Posts: 5

3

Wednesday, February 21st 2018, 9:36am

Thank you very much

Dismuntel

Beginner

Date of registration: Nov 3rd 2017

Posts: 5

4

Wednesday, February 21st 2018, 10:29am

What should I do so that the orange selection is drawn by the semi-transparent line?

I write:

GUI_EnableAlpha (1);
GUI_SetAlpha (0x80);
LISTVIEW_SetBkColor (hItem, LISTVIEW_CI_SELFOCUS, GUI_ORANGE);
GUI_EnableAlpha (0);

And nothing happens.

Thanks