transparent bitmap controls
in [Win32 API]
|
Prev: Programmatically enumerate volumes on a server
Next: Need help to develop application in C++ to convert DICOM to JPEG
From: archimonde on 30 Jun 2008 19:26 Hi everybody, I am trying to develop a chessboard (user interface) for a game engine. I managed to create the chessboard (64 squares - static controls). Now, :) I have to build the pieces. I thought on this approach: a static control with a transparent gif on top. I can't figure out how to make the control transparent, but still showing the piece image, with transparent background. I appreciate any help, Thank you, Dan
From: Kellie Fitton on 30 Jun 2008 22:29 On Jun 30, 4:26 pm, archimonde <dansta...(a)gmail.com> wrote: > Hi everybody, > > I am trying to develop a chessboard (user interface) for a game > engine. > > I managed to create the chessboard (64 squares - static controls). > > Now, :) I have to build the pieces. I thought on this approach: a > static control with a transparent gif on top. > > I can't figure out how to make the control transparent, but still > showing the piece image, with transparent background. > > I appreciate any help, > > Thank you, > > Dan Hi, You can create the static control with the extended window style WS_EX_TRANSPARENT: http://msdn.microsoft.com/en-us/library/ms632680(VS.85).aspx Kellie.
From: Jerry Coffin on 30 Jun 2008 23:47 In article <1e28e923-7809-402f-9754-cfee381c95d6 @z72g2000hsb.googlegroups.com>, danstancu(a)gmail.com says... [ ... ] > I managed to create the chessboard (64 squares - static controls). Why in the world would you use static controls for this job? If you want a chessboard, just draw one: HBRUSH colors[2]; colors[0] = CreateSolidBrush(RGB(0,0,0)); colors[1] = CreateSolidBrush(RGB(255,255,255)); int square = 0; for (int x=0; x<8; x++) { for (int y=0; y<8;y++) { RECT rect = {x, y, x+1, y+1}; FillRect(pDC->GetSafeHdc(), &rect, colors[++square & 1]); } square++; } You use this after setting up the mapping mode something like: RECT rect; GetClientRect(wnd, &rect); SetMapMode(dc, MM_ISOTROPIC); SIZE size; SetViewportExtEx(dc, rect.right, rect.bottom, &size); SetWindowExtEx(dc, 8, 8, &size); If you do this mapping mode calculation in response to WM_SIZE, your board will automatically resize as needed to fill the window (as much as it can and remain square). > Now, :) I have to build the pieces. I thought on this approach: a > static control with a transparent gif on top. I'm not sure you gain anything by using a GIF here. The pieces are small enough that the savings from compression will be minimal. Getting transparency is pretty easy too: TransparentBlt allows you to specify a color in the source bitmap to treat as transparent. You could also set up a single bitmap to hold all your source pieces. You draw each piece in a square as large as necessary for the detail you want, then select that bitmap into a DC with the mapping set up about like above, but with a logical size 2 wide and 6 high, so the side (white vs. black) becomes the X coordinate and the type of piece (pawn, knight, bishop, rook, etc.) becomes the Y coordinate to blit from. The height and width of the source are both 1. Other than the transparency, TransparentBlt is like StretchBlt, so it will stretch/shrink the source bitmaps as needed to make them fit the destination size you've picked. CBitmap bmp; bmp.LoadBitmap(IDB_BITMAP1); CDC dc; dc.CreateCompatibleDC(pDC); dc.SelectObject(bmp); BITMAP info; bmp.GetBitmap(&info); dc.SetMapMode(MM_ISOTROPIC); dc.SetViewportExt(info.bmWidth, info.bmHeight); dc.SetWindowExt(2, 7); Then drawing a piece in a square would look something like this (for the moment, I've chosen pure red as the transparent background color for the piece): DWORD red=RGB(255, 0,0); TransparentBlt(pDC->GetSafeHdc(), x, y, 1, 1, dc, s, p, 1, 1, red); where 's' signifies the side (white or black) and 'p' the 'piece' (pawn, knight, bishop, rook, etc.) and x and y denote the file and rank on the board. You can assign these in any order you like -- you just have to ensure the positions in the bitmap match up with the numbers you assign. There's probably already have an encoding for this to be used in the chess engine, so you just draw up your bitmaps to match that code. I've written a small demo of this way of doing things that I could zip up and email if you want. It just draws pawns in four squares (I've picked black and white for the squares, blue and yellow for the pieces, and this shows all four combos). For now, it only does pawns (and they're _really_ crudely drawn at that...), but the code would work for a real chess game with VERY little modification -- most of what's needed is drawing the bitmaps for the pieces you want. Fair warning: the code currently uses MFC, though it should be pretty reasy to convert to straight Win32 code or most other frameworks. -- Later, Jerry. The universe is a figment of its own imagination.
From: archimonde on 1 Jul 2008 02:56 On Jul 1, 6:47 am, Jerry Coffin <jcof...(a)taeus.com> wrote: > In article <1e28e923-7809-402f-9754-cfee381c95d6 > @z72g2000hsb.googlegroups.com>, dansta...(a)gmail.com says... > > [ ... ] > > > I managed to create the chessboard (64 squares - static controls). > > Why in the world would you use static controls for this job? If you want > a chessboard, just draw one: > > HBRUSH colors[2]; > colors[0] = CreateSolidBrush(RGB(0,0,0)); > colors[1] = CreateSolidBrush(RGB(255,255,255)); > > int square = 0; > > for (int x=0; x<8; x++) { > for (int y=0; y<8;y++) { > RECT rect = {x, y, x+1, y+1}; > FillRect(pDC->GetSafeHdc(), &rect, colors[++square & 1]); > } > square++; > } > > You use this after setting up the mapping mode something like: > > RECT rect; > GetClientRect(wnd, &rect); > SetMapMode(dc, MM_ISOTROPIC); > SIZE size; > SetViewportExtEx(dc, rect.right, rect.bottom, &size); > SetWindowExtEx(dc, 8, 8, &size); > > If you do this mapping mode calculation in response to WM_SIZE, your > board will automatically resize as needed to fill the window (as much as > it can and remain square). > > > Now, :) I have to build the pieces. I thought on this approach: a > > static control with a transparent gif on top. > > I'm not sure you gain anything by using a GIF here. The pieces are small > enough that the savings from compression will be minimal. Getting > transparency is pretty easy too: TransparentBlt allows you to specify a > color in the source bitmap to treat as transparent. > > You could also set up a single bitmap to hold all your source pieces. > You draw each piece in a square as large as necessary for the detail you > want, then select that bitmap into a DC with the mapping set up about > like above, but with a logical size 2 wide and 6 high, so the side > (white vs. black) becomes the X coordinate and the type of piece (pawn, > knight, bishop, rook, etc.) becomes the Y coordinate to blit from. The > height and width of the source are both 1. Other than the transparency, > TransparentBlt is like StretchBlt, so it will stretch/shrink the source > bitmaps as needed to make them fit the destination size you've picked. > > CBitmap bmp; > bmp.LoadBitmap(IDB_BITMAP1); > CDC dc; > dc.CreateCompatibleDC(pDC); > dc.SelectObject(bmp); > BITMAP info; > bmp.GetBitmap(&info); > > dc.SetMapMode(MM_ISOTROPIC); > dc.SetViewportExt(info.bmWidth, info.bmHeight); > dc.SetWindowExt(2, 7); > > Then drawing a piece in a square would look something like this (for the > moment, I've chosen pure red as the transparent background color for > the piece): > > DWORD red=RGB(255, 0,0); > > TransparentBlt(pDC->GetSafeHdc(), x, y, 1, 1, dc, s, p, 1, 1, red); > > where 's' signifies the side (white or black) and 'p' the 'piece' (pawn, > knight, bishop, rook, etc.) and x and y denote the file and rank on the > board. You can assign these in any order you like -- you just have to > ensure the positions in the bitmap match up with the numbers you assign. > There's probably already have an encoding for this to be used in the > chess engine, so you just draw up your bitmaps to match that code. > > I've written a small demo of this way of doing things that I could zip > up and email if you want. It just draws pawns in four squares (I've > picked black and white for the squares, blue and yellow for the pieces, > and this shows all four combos). For now, it only does pawns (and > they're _really_ crudely drawn at that...), but the code would work for > a real chess game with VERY little modification -- most of what's needed > is drawing the bitmaps for the pieces you want. Fair warning: the code > currently uses MFC, though it should be pretty reasy to convert to > straight Win32 code or most other frameworks. > > -- > Later, > Jerry. > > The universe is a figment of its own imagination. Thank you for the code and all the guiding Jerry, I would appreciate if you could email me the demo. Thanks a lot, in advance, Dan
From: cl2606 on 6 Jul 2008 17:34
On Jul 1, 2:56 am, archimonde <dansta...(a)gmail.com> wrote: > On Jul 1, 6:47 am, Jerry Coffin <jcof...(a)taeus.com> wrote: > > > > > > > In article <1e28e923-7809-402f-9754-cfee381c95d6 > > @z72g2000hsb.googlegroups.com>, dansta...(a)gmail.com says... > > > [ ... ] > > > > I managed to create the chessboard (64 squares - static controls). > > > Why in the world would you use static controls for this job? If you want > > a chessboard, just draw one: > > > HBRUSH colors[2]; > > colors[0] = CreateSolidBrush(RGB(0,0,0)); > > colors[1] = CreateSolidBrush(RGB(255,255,255)); > > > int square = 0; > > > for (int x=0; x<8; x++) { > > for (int y=0; y<8;y++) { > > RECT rect = {x, y, x+1, y+1}; > > FillRect(pDC->GetSafeHdc(), &rect, colors[++square & 1]); > > } > > square++; > > } > > > You use this after setting up the mapping mode something like: > > > RECT rect; > > GetClientRect(wnd, &rect); > > SetMapMode(dc, MM_ISOTROPIC); > > SIZE size; > > SetViewportExtEx(dc, rect.right, rect.bottom, &size); > > SetWindowExtEx(dc, 8, 8, &size); > > > If you do this mapping mode calculation in response to WM_SIZE, your > > board will automatically resize as needed to fill the window (as much as > > it can and remain square). > > > > Now, :) I have to build the pieces. I thought on this approach: a > > > static control with a transparent gif on top. > > > I'm not sure you gain anything by using a GIF here. The pieces are small > > enough that the savings from compression will be minimal. Getting > > transparency is pretty easy too: TransparentBlt allows you to specify a > > color in the source bitmap to treat as transparent. > > > You could also set up a single bitmap to hold all your source pieces. > > You draw each piece in a square as large as necessary for the detail you > > want, then select that bitmap into a DC with the mapping set up about > > like above, but with a logical size 2 wide and 6 high, so the side > > (white vs. black) becomes the X coordinate and the type of piece (pawn, > > knight, bishop, rook, etc.) becomes the Y coordinate to blit from. The > > height and width of the source are both 1. Other than the transparency, > > TransparentBlt is like StretchBlt, so it will stretch/shrink the source > > bitmaps as needed to make them fit the destination size you've picked. > > > CBitmap bmp; > > bmp.LoadBitmap(IDB_BITMAP1); > > CDC dc; > > dc.CreateCompatibleDC(pDC); > > dc.SelectObject(bmp); > > BITMAP info; > > bmp.GetBitmap(&info); > > > dc.SetMapMode(MM_ISOTROPIC); > > dc.SetViewportExt(info.bmWidth, info.bmHeight); > > dc.SetWindowExt(2, 7); > > > Then drawing a piece in a square would look something like this (for the > > moment, I've chosen pure red as the transparent background color for > > the piece): > > > DWORD red=RGB(255, 0,0); > > > TransparentBlt(pDC->GetSafeHdc(), x, y, 1, 1, dc, s, p, 1, 1, red); > > > where 's' signifies the side (white or black) and 'p' the 'piece' (pawn, > > knight, bishop, rook, etc.) and x and y denote the file and rank on the > > board. You can assign these in any order you like -- you just have to > > ensure the positions in the bitmap match up with the numbers you assign.. > > There's probably already have an encoding for this to be used in the > > chess engine, so you just draw up your bitmaps to match that code. > > > I've written a small demo of this way of doing things that I could zip > > up and email if you want. It just draws pawns in four squares (I've > > picked black and white for the squares, blue and yellow for the pieces, > > and this shows all four combos). For now, it only does pawns (and > > they're _really_ crudely drawn at that...), but the code would work for > > a real chess game with VERY little modification -- most of what's needed > > is drawing the bitmaps for the pieces you want. Fair warning: the code > > currently uses MFC, though it should be pretty reasy to convert to > > straight Win32 code or most other frameworks. > > > -- > > Later, > > Jerry. > > > The universe is a figment of its own imagination. > > Thank you for the code and all the guiding Jerry, I would appreciate > if you could email me the demo. > > Thanks a lot, in advance, > > Dan- Hide quoted text - > > - Show quoted text - Dan theForger's website has a good tutorial on this very topic and it includes source files. Here is the link: http://www.winprog.org/tutorial/transparency.html Curt |