Forum > LCL

[solved] Letting users rearrange buttons

(1/4) > >>

Hi everyone I just got an idea for a new custom componet.
I want to make a tflowpanel descendant control with some buttons in it.

The buttons will be created from either a constant string array or stringlist.
I want to let the users to change the order in which buttons appear by dragging them.  Is this possible do drag drop in the preferred spot?

I also will need to store the button order in an inifile for next time program is used. Most likely I will store them by name.

How difficult is this to do? I haven’t dragged things since Visual Basic a long time ago. I’m guessing that the end drag event can detect other button in same spot and maybe change the index in controls list or something like that?

It is not very difficult, but at first you need some understanding. See the following:

I do not have a direct example of moving buttons, but an example with TTreeView. First you have to define "dragover" event, where Accept must be set as true or false.

Then define DragDrop event handler.

My example is dragging and dropping a tree node over another node. Some nodes are possible to move while others are not, depending on the integer value stored in the "tag" property of each treenode.

When dragged and dropped over another tree node, the "dragged" node take the position and "dropped over" node goes down to next position.

--- Code: Pascal  [+][-]window.onload = function(){var x1 = document.getElementById("main_content_section"); if (x1) { var x = document.getElementsByClassName("geshi");for (var i = 0; i < x.length; i++) { x[i].style.maxHeight='none'; x[i].style.height = Math.min(x[i].clientHeight+15,306)+'px'; x[i].style.resize = "vertical";}};} ---procedure TfrQList.tvQListDragOver(Sender, Source: TObject; X, Y: Integer;  State: TDragState; var Accept: Boolean);  // DragOver - Sender: Treeview,  Source: dragged objectvar   TNode, SNode, PNode: TTreeNode;   SQT, TQT: integer;begin   // Find Qtype of Dragged over (source) question   if (Source is TToolButton)      then SQT:= (Source as TToolButton).Tag      else if (Source is TTreeView) then begin         SNode:= (Source as TTreeView).Selected;         if SNode <> nil then SQT:= TQuestion(SNode.Data).QType;      end;    if SQT = qtBlockEnd then begin      Accept:= False;      Exit;   end;    TNode:= TVQList.GetNodeAt(X, Y);    if TNode = nil then Accept:= True   else begin      PNode:= TNode.Parent;      if PNode = nil then Accept:= True      else begin         TQT:= TQuestion(PNode.Data).QType;         if TQT = qtPageStart         then             Accept:= not (SQT in [qtIfBlock, qtLoopStart, qtJump, qtQuotaCheck,                            qtRTime, qtAHP, qtTradeOff, qtBlockEnd])      end;   end;end;  procedure TfrQList.tvQListDragDrop(Sender, Source: TObject; X, Y: Integer);var   SNode, TNode: TTreeNode;   TQ: TQuestion;begin   TNode := TVQList.GetNodeAt(X,Y);    if (Source is TToolButton) then begin  // New create      TQ:= NewQuestion((Source as TControl).Tag);      tvQList.Selected:= InsertNewQNode(TNode, TQ);   end   else begin  // Move within Treeview      SNode := TVQList.Selected;      MoveCurrentNodeTo(SNode, TNode);   end;end; 

Maybe not needed but rvk's furious programming's moveable rectangle might be useful:,43376.msg303582.html#msg303582

Thanks for the links I looked at the code and it seems that I have to actually code the movement but I wonder if flowpanel will interfere because it does some sort of alignment. I’ll have to check. There is also an onstartdrag event,  I’ll try out the code

I don’t remember dragging being so complicated before..

Adding a little project which demonstrates drag and drop of buttons in a flowpanel.


[0] Message Index

[#] Next page

Go to full version