How to create multiple images in a single window using win32api and c++

[gopikanna]

I have splitted my Application window into two using createWindowEx().Now i have two windows...In my First window I need to display images as list of thumbnails,In another window i need to view the image as user selects the particular thumbnail from the first window.
My Question is How to display multiple images in a single window as thumbnails.
How to do this using only Win32API and c++.

It would be a great Help
Thanks

[modoran]

Use a STATIC control for each image you want to display. You have some example here:
http://www.cplusplus.com/forum/windows/62110/

[knn9]

I like to use the list view control for thumbnails.

http://msdn.microsoft.com/en-us/library/windows/desktop/bb774735%28v=vs.85%29.aspx

You have to resize each image and add them to the list view's image list.

[gopikanna]

You Have both given me Good idea about how to do this..

Can You also Explain me about the Following Questions:
Things I want to get clear:These Question may be silly but i need to get clear to proceed in my work since i am newbie in Win32api.

For Win32API I usually refer through the book "Programming Windows" by Charles Petzold.
But i couldnot find any information regarding about ListView control and Static Control so i have doubt whether it is Contained in win32api,because i should not use MFC concepts.


Q) Whether ListView Control and Static Control is contained in Win32API(i.e Whether it is Pure Win32api) because i am working in my project using win32api and c++.

Q)What is Resource Script Files(i.e resource.h and .rc files) whether we need to create and make use of resource files in order to use ListView Control and Static Control to create images and Displaying it in thumbnail window.this question i asked because this thumbnail window is like one of the user interface controls.

Q) What is ComCtl32.dll and what is its use.

Answers to these questions could Help me to Proceed.
Thanks

[knn9]

1) Yes there are good many controls in windows. Here is a list:

http://msdn.microsoft.com/en-us/library/windows/desktop/bb773169%28v=vs.85%29.aspx

I guess Mr. Petzold didn't feel the need to cover them all in his book.

2) The rc file basically describe the resources you want embedded in your EXE or DLL. Resources are things like bitmaps, icons, cursors, strings, and menus. You would use bitmap or icon resources for toolbar buttons and menu item images, for example.

You probably don't want to use resources in your case since I assume you want to display any images on disk and not just a specific set of images.

Resources are essential in large applications so you probably want to learn more about them at some point. This might be a good starting place:

http://msdn.microsoft.com/en-us/library/windows/desktop/ms632583%28v=vs.85%29.aspx

3) That is the common control library which implements the various controls and related functions. It's pretty much required for all GUI apps.

[gopikanna]

Thanks knn9.You have given me clear explanation.
can you also explain me the following Questions

Q)
Is it possible to create ListView control and Static control for displaying List of Images in Thumbnail Window and Viewing it in Viewer Window without using Resource Script Files.
I have this doubt because Both ListView control and Static control uses WM_COMMAND message.
I ask this Question because Images are going to be selected by user(as this can be one of the UserInterface)

Thanks

[knn9]

Yes you don't need resources for this. I'm not sure what about WM_COMMAND gives you doubt. This message tells you which control sent it.

[gopikanna]

Is it Possible to get mouse events and scroll events in Static control.Because Static Control does not Process WM_MOUSEMOVE and WM_MOUSEWHEEL.
I need to use mouse events in the Viewer Window.

Thanks

[modoran]

You can make the static control process mouse messages, but you need to subclass it:
http://stackoverflow.com/questions/5883414/why-is-my-child-window-unresponsive-to-mouse-events

By default the events are sent to the parent window, not the static control itself.

[gopikanna]

I have followed the Steps that you have suggested here:

one more doubt I have is:
do we need to have Listview control window for creating a ImageList control in it or can I use a normal window using CreateWindowEx without specifying WC_LISTVIEW?

1)I created ListView Window using CreateWindowEx(specifying WC_LISTVIEW)
2)For creating ImageList i Used ImageList_Create()
3)For Adding Images i used ImageList_Add()
4)For Drawing Images in it i used ImageList_Draw()

so everything works fine i could draw images one by one..
i have posted sample Image(Window that i have created)in the below link for your reference
http://s27.postimg.org/o08rlhg1v/Thumbnail.jpg

Now i need to apply some styles that will make ImageList looks like Adobe Reader Thumbnails,I should also highlight the selected image from the list.(i.e Like Adobe Reader Thumbnails exactly).
Please Suggest me how to achieve this.

Thanks

[gopikanna]

please can some one help me to proceed the task in above question

[knn9]

do we need to have Listview control window for creating a ImageList control in it or can I use a normal window using CreateWindowEx without specifying WC_LISTVIEW?

I don't really understand this question :/

I think you're asking whether you need the listview control at all. If so, then no. Of course you can tile images with static controls or directly on the window with a backbuffer or whatever.

Now i need to apply some styles that will make ImageList looks like Adobe Reader Thumbnails,I should also highlight the selected image from the list.(i.e Like Adobe Reader Thumbnails exactly).

Not sure what adobe looks like but the list-view control already shows a selection box around the selected item. Is there something wrong with that?

[gopikanna]

I have created Listview control window and successfully created Thumbnail Images using Imagelists control.

Now I need to get the Index of the selected image from the Imagelist control so that we can draw the selected image in Bigger size static window control.

Note:I could get WM_NOTIFY and NM_CLICK message from this control, but after this step I dont have any idea on how to get the index of the selected image from the Imagelist control.

Please suggest how to proceed from this step

[knn9]

When you add listview items set the param member of the item struct to the index of the image. That's one way to associate data with an item.

[gopikanna]

My Question is


How to get the Index of the current selected image from the Listview control.

From the Listview control we can only get the index of the Item in the Listview control not the index of the image.

because Imagelist control is contained in Listview control.
is there any way of getting selected image index from ListView control.

Please suggest me to proceed.

[knn9]

It looks like you can get the image with LVM_GETITEM.

http://msdn.microsoft.com/en-us/library/windows/desktop/bb774953%28v=vs.85%29.aspx

[gopikanna]

Scenario:
Listview control is the window it contains listview item and iimages are created using Imagelist that have been placed Listview control(i.e subitems contain images)

But LVM_GETITEM gets the item index but the Imagelists are placed inside Listview item this means i need to get the subitem index of the item(i.e the image placed in listview item)
my code is :
case WM_NOTIFY :
{
switch(LOWORD(wParam))
{
case IDC_LIST:

nItems = ListView_GetItemCount(m_tempWnd);
if(((LPNMHDR)lParam)->code == NM_CLICK)
{

LVITEM lvitem;
memset(&lvitem,0,sizeof(lvitem));
lvitem.mask = LVIF_IMAGE;
lvitem.iItem = nItems;

lvitem.iImage = I_IMAGECALLBACK;
lvitem.stateMask = LVIS_SELECTED;
int iSelect = ListView_GetItem(m_tempWnd,&lvitem);
lvitem.iSubItem = iSelect;
ListView_SetItem(m_tempWnd,&lvitem);

}
return 0;
default:
return 0;
}
}

I dont know where my code is wrong.please correct me

Please help me to get the index of the subitem(i.e image contained in item)
i.e to get the Index of the current selected image from the Listview control

for the reference i posted the link how my window will look like in below link
http://s27.postimg.org/o08rlhg1v/Thumbnail.jpg

On selecting the thumbnails i need to display the corresponding image in viewer window you can refer the above link how will my window look like this my requirement

Please help me how to proceed
Thanks

[knn9]

According to the documentation for the LVITEM structure:

iImage

Type: int

Index of the item's icon in the control's image list. This applies to both the large and small image list. If this member is the I_IMAGECALLBACK value, the parent window is responsible for storing the index. In this case, the list-view control sends the parent an LVN_GETDISPINFO notification code to retrieve the index when it needs to display the image.

So, you have to store the image index yourself and provide it when requested via LVN_GETDISPINFO.

[gopikanna]

Thanks knn9.

how to get the image index for the current selected image created using Imagelist which is placed in ListView control the using LVITEM structure member iImage

[gopikanna]

1. I have a function called "populate_thumb_nails" which will create thumbnail images using ListView and ImageList control using below code.
2. There is no issues if I call this function from WM_Create in Windows 8 but in XP machine it's not creating thumbnails (Blank white background appearing).
3. To solve this I tried to call "populate_thumb_nails" function from WM_Paint in XP... its seems like working but thumbnails redrawing recursively.
4. Pls clarify my below doubts and suggest
1. Whether shoud I call this "populate_thumb_nails" function only once in WM_Create or should I call also in WM_Paint?
2. I have added two images in ImageList using "ImageList_Add() function but only one image has drawn instead of two.

if I did any mistake in code pls point it out.

//This will create thumb window and register the win proc for that window.
CreateWindowEx(WS_EX_WINDOWEDGE, className.c_str(), winName.c_str(),
WS_CHILDWINDOW | WS_VISIBLE | WS_BORDER | WS_VSCROLL | WS_HSCROLL,
0, 0, (int)thumbnailWndSize.iWidth,
(int)thumbnailWndSize.iHeight, hParentWnd, NULL, hInstance, NULL ); //successfully created

//this is the corresponding window proc
LRESULT CALLBACK wnd_proc_thumbnail(HWND hWnd, UINT uMsg, WPARAM wParam, LPARAM lParam)
{
switch(uMsg)
{
case WM_CREATE :
{
return populate_thumb_nails(hWnd); //this function will create thumbnails using ListView and ImageList controls
}
case WM_PAINT:
{
return populate_thumb_nails(hWnd); //to solve xp issue denoted in point 2. is this preferred solution?
}
case WM_NOTIFY :
{
return 0;
}
default:
{
return DefWindowProc(hWnd, uMsg, wParam, lParam);
}
}

BOOL populate_thumb_nails(HWND hWndThumbNail)
{
if(hWndThumbNail == NULL) return FALSE;

HWND hWndListView = NULL;
HIMAGELIST hImgList = NULL;

hWndListView = create_list_view_control(hWndThumbNail);
if(hWndListView == NULL) return FALSE;

create_image_list_control(hWndListView, hImgList);
if(hImgList == NULL) return FALSE;

int itemCount = ListView_GetItemCount(hWndListView);
LV_ITEM lvItem;
lvItem.mask = LVIF_TEXT | LVIF_IMAGE | LVIF_STATE;
lvItem.state = 0; //
lvItem.stateMask = 0; //
lvItem.iItem = itemCount;
lvItem.iSubItem = 0;
lvItem.iImage = itemCount;
ListView_InsertItem(hWndListView, &lvItem);
}

BOOL create_list_view_control(handle)
{
HWND hWndListView = NULL;
HINSTANCE hInstance;
RECT rect;
int wndWidth = 0, wndHeight = 0;

INITCOMMONCONTROLSEX icex;
icex.dwICC = ICC_LISTVIEW_CLASSES;
InitCommonControlsEx(&icex);

//1. Get instance of parent window.
hInstance = (HINSTANCE)GetWindowLong(hWndParent, GWL_HINSTANCE);

GetWindowRect(hWndParent, &rect);

wndWidth = rect.right - rect.left;
wndHeight = rect.bottom - rect.top;

hWndListView = CreateWindowEx(0L, WC_LISTVIEW, L"",
WS_VISIBLE | WS_CHILD | WS_BORDER | LVS_LIST |
LVS_ALIGNTOP | LVS_SHOWSELALWAYS | LVS_TYPEMASK | LVS_EDITLABELS,
0, 0, wndWidth, wndHeight, hWndParent, (HMENU)IDC_LIST, hInstance, NULL);
}

BOOL create_image_list_control(handle)
{
RECT rect;
int imgCount = 0, thumbNailWidth = 0, thumbNailHeight = 0, cx=0, cy=0;

::GetWindowRect(hWndListView, &rect);

thumbNailWidth = rect.right - rect.left;
thumbNailHeight = rect.bottom - rect.top;

imgCount = get_total_image_count();

hImgList = ImageList_Create(thumbNailWidth, thumbNailHeight, ILC_COLORDDB, imgCount, 1);

ListView_SetImageList(hWndListView, hImgList, LVSIL_SMALL);

CBmpAPI BmpApi;
HBITMAP hBitmap = get_hbmp();

//rescaling the bitmap
HBITMAP hBmpResized = BmpApi.rescale_bitmap(hBitmap, 100, 100);

ImageList_Add(hImgList, hBmpResized, NULL);
ImageList_Add(hImgList, hBmpResized, NULL);
DeleteObject(hBmpResized);

HDC hdcDest;
PAINTSTRUCT ps;

hdcDest = ::BeginPaint(hWndListView, &ps);

for(int i = 0; i < 1; i++)
{
ImageList_Draw(hImgList, i, hdcDest, cx, cy, ILD_NORMAL); //ILD_TRANSPARENT, ILD_NORMAL
cy = (cy == 0) ? 150 + 10 : cy + 10;
}

EndPaint(hWndListView, &ps);
DeleteDC(hdcDest);
}