Nice Sortables2 Utilites
I’ve added native EWB sortables to my Nice library.
This allows you to easily add entries to lists with drag and drop. Entries are html, so you can include images or other cool content.
Look at the sample project and try dragging three successive items to the panel in the lower right.''
Here’s the code:
unit dragsample;
interface
uses WebCore, WebUI, WebForms, WebCtrls, WebBrwsr, WebLabels, webdom, WebCtnrs,
WebBtns, WebEdits, nicesortables2;
type
TForm1 = class(TForm)
ScrollPanel1: TScrollPanel;
BasicPanel1: TBasicPanel;
Panel1: TPanel;
Label1: TLabel;
procedure Form1Show(Sender: TObject);
private
{ Private declarations }
draggables : TDraggable2;
drop1, drop2, drop3 : TDraggableContainer2;
function DropInto( dest , previous: TDraggableContainer2; src : TControl ):boolean;
function PostDropIntoOutof( dest , previous : TDraggableContainer2; src : TControl ):boolean;
public
{ Public declarations }
procedure SetupDrop;
end;
var
Form1: TForm1;
implementation
//-------------------------------------------------------------------------------------------------------------------
procedure TForm1.SetupDrop;
begin
// setup the system
draggables := TDraggable2.Create( self );
// define the containers to hold the elements
drop1 := draggables.AddContainer( basicpanel1 );
drop2 := draggables.Addcontainer( scrollpanel1 );
drop3 := draggables.AddContainer( panel1 );
drop1.addelement('Erick');
drop1.addelement('Rosie');
drop1.AddElement( 'Pankaj <img src="birthday.png" widht=20 height = 20><br>');
draggables.onDragInto := DropInto;
draggables.onPostDragIntoOutof := PostDropIntoOutof;
end;
// this is called to see if we ALLOW a drop from one container to another
function TForm1.DropInto( dest, previous : TDraggableContainer2; src : TControl ):boolean;
begin
//
result := True; // default to allow
// don't allow more than two, but allow if it is within the same container (just a reorg)
if (dest = drop3) and (previous <> dest) and (dest.Container.ControlCount > 1) then begin
panel1.Captionbar.caption := 'Sorry, only maximum of two allowed';
result := false;
end;
end;
// This gets called after a successful post from one container to another
function TForm1.PostDropIntoOutof( dest , previous : TDraggableContainer2; src : TControl ):boolean;
var
i : integer;
s : string;
begin
// always update the count number
panel1.Captionbar.caption := IntToStr( panel1.ControlCount ) + ' items of 2 max';
// the controls in this panel are THTMLLabels containing data, you can iterate through them if you wish
if dest = drop3 then begin
for i := 0 to panel1.ControlCount -1 do begin
s := THTMLLabel( panel1.Controls[i] ).Content;
if Pos( 'Rosie' , s ) > 0 then
panel1.CaptionBar.Caption := panel1.CaptionBar.Caption + ', including ' + s;
end;
end;
end;
//--------------------------------------------------------------------------------------------------
procedure TForm1.Form1Show(Sender: TObject);
begin
setupdrop;
end;
end.