Jump to content

DragnDrop sample? (and bugs)


Recommended Posts

I have been trying to work out how to drag and drop an element. e.g., image or panel.

 

 

 

I can't see any obvious way to get it working. The mouse up and down events don't behave quite how I expected. I have tried looking through the example code but couldn't find anything. Can someone point me in the right direction, is there a drag and drop example available, and if so which one is it?

 

 

 

cheers

 

btw: BUGS

 

the touchbegin/end event doesn't appear to work, unknown name "TW3TouchData". (Beta 2.0.0.9).

 

Also double clicking an event (e.g., on click) creates the procedure which is nice, but the actual text is not placed in the events section, it remains blank.

Link to post
Share on other sites

Regarding the bugs: Please report these to support@smartmobilestudio.com so it can be moved easily into our bug tracker. If this is reproducible, please write a short list of steps, so that we can easily have a look at it.

 

Note: Sending a mail for each issue you found will increase the chance that it is not overlooked.

Link to post
Share on other sites
  • Administrators

Thanks for the bug report, I've just entered it in the system. (For the next time, please do what Christian suggested.)

 

What do you mean by drag&drop? Do you want to click on a (for example) panel and drag it inside the application (browser) window while the application is running?

Link to post
Share on other sites
  • Administrators

For dragging, try this approach. This will also be available as a demo (Draggable Panel) in the final release.

 

unit Form1; 

interface 

uses  
  W3System, W3Graphics, W3Components, W3Forms, W3Fonts, W3Borders, 
  W3Application, W3Panel, W3MouseTouch; 

type 
  TForm1 = class(TW3form) 
  private 
    {$I 'Form1:intf'} 
  protected 
    FDragging: boolean; 
    FStartPos: TPoint; 
    FClickPos: TPoint; 
    procedure InitializeForm; override; 
    procedure InitializeObject; override; 
    procedure Resize; override; 
    procedure HandleTouch(Sender: TObject; Button: TMouseButton; 
      Shift: TShiftState; X, Y: Integer); 
    procedure HandleMove(Sender: TObject; Shift: TShiftState; X, Y: Integer); 
    procedure HandleRelease(Sender: TObject; Button: TMouseButton; 
      Shift: TShiftState; X, Y: Integer); 
  end; 

implementation 

{ TForm1} 

procedure TForm1.HandleTouch(Sender: TObject; Button: TMouseButton;  
  Shift: TShiftState; X: Integer; Y: Integer); 
begin 
  FDragging := true; 
  FStartPos := TPoint.Create(W3Panel1.Left, W3Panel1.Top); 
  FClickPos := W3Panel1.ClientToScreen(TPoint.Create(X, Y)); 
end; 

procedure TForm1.HandleMove(Sender: TObject; Shift: TShiftState;  
  X: Integer; Y: Integer); 
begin 
  if FDragging then begin 
    var clickPos := W3Panel1.ClientToScreen(TPoint.Create(X,Y)); 
    W3Panel1.Left := clickPos.X - FClickPos.X + FStartPos.X; 
    W3Panel1.Top := clickPos.Y - FClickPos.Y + FStartPos.Y; 
  end; 
end; 

procedure TForm1.HandleRelease(Sender: TObject; Button: TMouseButton; Shift: TShiftState; X: Integer; Y: Integer); 
begin 
  FDragging := false; 
end; 

procedure TForm1.InitializeForm; 
begin 
  inherited; 
  W3Panel1.OnMouseTouchClick := HandleTouch; 
  W3Panel1.OnMouseTouchMove := HandleMove; 
  W3Panel1.OnMouseTouchRelease := HandleRelease; 
end; 

procedure TForm1.InitializeObject; 
begin 
  inherited; 
  {$I 'Form1:impl'} 
end; 

procedure TForm1.Resize; 
begin 
  inherited; 
end; 

end. 

Link to post
Share on other sites
  • Moderators

Similar approach is used in www.lynkit.com.au/expert. This is a work in progress (a port of a generic AI/expert system). Anyway, the drag and drop bits work.

On the menu press 'Design' and then 'Example2' and you'll see a couple of buttons and bezier-lines. The buttons can be moved by mouse or finger (and the bezier lines follow).

  W3Panel1:=TW3Panel.create(Self); 
  W3PaintBox1:=TW3PaintBox.create(W3Panel1); 
  w3_setStyle(W3Panel1.Handle,'border','0px'); 

  UnifiedClick(W3Panel1, ReportClick); 
  UnifiedMove(W3Panel1, ReportMove); 
  UnifiedRelease(W3Panel1, ReportRelease); 

  W3Panel1.OnMouseTouchClick := ReportClick; 
  W3Panel1.OnMouseTouchMove := ReportMove; 
  W3Panel1.OnMouseTouchRelease := ReportRelease; 

  W3PaintBox1.OnPaint := 
    procedure(Sender: TObject; Canvas: TW3Canvas) 
    begin 
      BezierDraw; 
    end; 

end; 

procedure TForm1.ReportClick(Sender: TObject; Button: TMouseButton; Shift: TShiftState; X, Y: Integer); 
begin 
  FClicked := true; 
  FMoved := False; 
  For var i := 0 to NodeArray.NodeArray.Count -1 do begin 
    NodeArray.NodeArray[i].NodeSelected := False; 
    if (X > NodeArray.NodeArray[i].NodeButton.Left) and 
       (X < (NodeArray.NodeArray[i].NodeButton.Left + NodeArray.NodeArray[i].NodeButton.Width)) and 
       (Y > NodeArray.NodeArray[i].NodeButton.Top) and 
       (Y < (NodeArray.NodeArray[i].NodeButton.Top + NodeArray.NodeArray[i].NodeButton.Height)) then 
    begin 
       SelectedNode := i; 
       NodeArray.NodeArray[i].NodeSelected := True; 
    end; 
  end; 
end; 

procedure TForm1.ReportMove(Sender: TObject; Shift: TShiftState; X, Y: Integer); 
begin 
  if FClicked then begin 
    FMoved := true; 
    if (X > NodeArray.NodeArray[selectedNode].NodeButton.Left) and 
       (X < (NodeArray.NodeArray[selectedNode].NodeButton.Left + NodeArray.NodeArray[selectedNode].NodeButton.Width)) and 
       (Y > NodeArray.NodeArray[selectedNode].NodeButton.Top) and 
       (Y < (NodeArray.NodeArray[selectedNode].NodeButton.Top + NodeArray.NodeArray[selectedNode].NodeButton.Height)) then 
    begin 
        NodeArray.NodeArray[selectedNode].NodeButton.MoveTo(X-Trunc((NodeArray.NodeArray[selectedNode].NodeButton.Width / 2)), Y-Trunc((NodeArray.NodeArray[selectedNode].NodeButton.Height / 2))); 
        W3PaintBox1.LayoutChildren; 
    end; 
  end; 
end; 

procedure TForm1.ReportRelease(Sender: TObject; Button: TMouseButton; Shift: TShiftState; X, Y: Integer); 
begin 
  If FMoved = false then 
  begin 
    if (X > NodeArray.NodeArray[selectedNode].NodeButton.Left) and 
       (X < (NodeArray.NodeArray[selectedNode].NodeButton.Left + NodeArray.NodeArray[selectedNode].NodeButton.Width)) and 
       (Y > NodeArray.NodeArray[selectedNode].NodeButton.Top) and 
       (Y < (NodeArray.NodeArray[selectedNode].NodeButton.Top + NodeArray.NodeArray[selectedNode].NodeButton.Height)) then 
    begin 
       Application.GotoForm('Form4', TFormEntryEffect.feNone); 
    end; 
  end; 
  FClicked := false; 
  FMoved := true; 
end;

Link to post
Share on other sites
  • 2 weeks later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...