Making a GUI for chess game

[backprop]

I have made already basic long time ago, but since I have no much experience with BGRABitmap, I would ask few questions about making it much easier...

What I did is based on TBGRAGraphiscControl, board is drawn and become static depending on window size  and can be rotate for 180 degree,  pieces are in SVG and drawn on it regarding current FEN. When moving pieces, it is standard drag and drop method and in starting dragging, board is redrawn without that piece and during dragging is shown... There is a threshold area from where is possible to pick and drop piece...

Now, since this require quite a bit of code to control all, I would like to ask is it possible to do a bit simpler. I have noticed now that there is possible to have layers of bitmap, but I'm not certain what is actually possible, is it automatically drawn on desired component canvas and desired position, etc.

I have tried to look examples on wiki page, but that is forbidden for me as I have mention in my previous post.

[TBMan]

I do a lot of animation that involves dragging a sprite in my solitaire games. Although I don't use your graphic library, the logic is probably similar:

Code: Pascal  [Select][+][-]

1. Procedure paintscreen;
2. begin
3. cleardevice;
4. //....  paint the entire playing area
5. end;
6.  
7. // page flipping
8. procedure repaint;
9. begin
10.    if UpdateScreen then
11.   begin
12.      nextactivepage;
13.      paint;
14.      nextvisualpage;
15.      updatescreen := false;
16.   end;
17. end;
18.  

When dragging I will call movecard which does its own "Repaint."  The card that is being moved will have its indexing suspended so it is not drawn in its original location by "paintscreen." After the movecard call the card's indexing is restored. If the card was moved to a valid location, then it is indexing is removed and the card is added to its new position's indexing. Updatescreen is set to true after calling "movecard" so that when the current process is over the screen is redrawn with the card in its desired location.

Code: Pascal  [Select][+][-]

1.  procedure movecard(var mxx,myy:longint;Startcardx,Startcardy:integer;card:cardtype;paintscreen:PaintScreenType);
2.  var
3.  mbb:longword;
4.  dx,dy,
5.  ox,oy:longint;
6.  begin
7.  dx := Startcardx-mxx; dy := Startcardy-myy;
8.  ox := -1; oy := -1;
9.  while lpressed do
10.  begin
11.      getmousestate(mxx,myy,mbb);
12.      if (mxx+dx <> ox) or (myy+dy <> oy) then
13.         begin
14.             nextactivepage;
15.             paintscreen;
16.             paintcard(mxx+dx,myy+dy,card.suit,card.rank,false);
17.             nextvisualpage;
18.             ox := mxx+dx; oy := myy+dy;
19.         end;
20.  
21.  end;
22.       mxx := mxx+dx;myy := myy+dy;
23.  end;                                          
24.  

The movecard procedure receives the calling game's paintscreen as a procedural variable, which the movecard calls in its page flipping.

My sprites are drawn to a page buffer and in the page flipping, the nextvisualpage call, copies the page buffer to the active "canvas" which is then invalidated. My typical card game video size is 1500x by 1300y and my games run super smooth.

Hopefully this makes sense to you.

[circular]

Hi backprop,

Regarding layers, the idea is that you can have an image with multiple layers (including SVG), and when in the repaint event of the control, simply call its Draw method as you would do with a regular TBGRABitmap.

You can look at the sample there to see what can be done: https://github.com/bgrabitmap/bgrabitmap/tree/master/test/layeroriginal

If you add an SVG or a gradient, it will be an "original" that is rendered as a layer.

When using originals, you can specify the matrix transform to rotate or scale them. You need to call RenderOriginalsIfNecessary to have them drawn in high quality. Otherwise, they will be drawn more quickly by default for smooth animation.

Regards