B4A Library SD: DragBoard

Star-Dust

Expert
Licensed User
(No WRAP, No Java Only B4A)

I had to change my color, updating and changing different parts.
I also called it differently. So if you have previous projects you will need to update the declaration of the variables.

To get the full version contact me privately, I'll give you directions to make a donation.
You can download a demo version for free


This library contains three classes.

The first "DragBoard" allows you to move single-label (containing only one string) from one column to another, to activate the shift by clicking a longer touch. Delete or edit each item by clicking a shortcut (if enabled by customView). It supports the addition of a single item for each column (CustomView enabled) and the alphabetical sorting of entries within a column (enabled by CustoView). It also lets you move whole columns of labels

The second "DragPanel" allows you to move Panels from one column to another (each panel can hold any view object you want, the panel should not be changed in dimension, and the background in Color should not be changed). To activate the move, click on a longer touch. To erase or edit each item by clicking a shortcut (if enabled by customView). And will raise an event that invokes a sub in your app you manage to edit. It supports the event by adding a single item for each column (CustomView enabled) and the event sorting by alphabetic (CustoView enabled). These events are handled by you in the sub which is raised. It also lets you move whole columns of panel

The third "DragListView" is a listview that allows you to move individual entries from one line to another by dragging, it can contain one or two lines of text and a Swicht button (You can also access the panel to add more objects but the Events will not be managed by the library). To activate the move, click on a longer touch. Capture or edit every single element by clicking a short touch (if activated by customView). And will raise an event that invokes a sub in your app you manage to edit. It supports the event by adding a single item for each column (CustomView enabled) and the event sorting by alphabetic (CustoView enabled). These events are handled by you in the sub which is raised.

the fourth "DragDrop" class is a class (not a CustomView type) that is used to handle dragging the view. The moving views will be passed as a parameter to the class and so will the objects that will serve as a place or the coordinates that will serve as a place of arrival. The rest will do the class, every time you drag and drop an event.

The first three also have a title bar. The bar can contain the Confirm button (if enabled) and delete (if enabled).m On the left also contains the menu button, which raises an event. If enabled by customView, the Menu button in addition to lifting an event opens a panel to the left. The panel can hold what you want. A listView, a menu etc ...

ezgif.com-optimize.gif
 

Attachments

Last edited:

Star-Dust

Expert
Licensed User
(No WRAP, No Java Only B4A)

SD_DragBoardPro

Author:
Star-Dust
Version: 0.07
  • DragBoardView
    • Events:
      • BoardMoved
      • ClickAddElement (ColumnName As String)
      • ClickModifyColumn (ColumnPosition As Int)
      • ClickModifyElement (ColumnPosition As Int, ItemPosition As Int)
      • ItemClickRightMenu (Position As Int, Value As Object)
    • Fields:
      • BoardBackGroundColor As Int
      • LabelSingleLine As Boolean
      • MovibleGround As String
      • NoMovibleGround As String
      • SpaceBetweenBoard As Int
      • SpaceBetweenColumn As Int
      • SpaceBetweenTitleColumn As Int
    • Functions:
      • AddColumnEmpty (ColumnName As String, Movible As Boolean) As Boolean
        Add a column empy
      • AddColumnList (ColumnName As String, ColumnList As List, TextColor As Int, Movible As Boolean) As Boolean
        Add a entire list - don't isert a duplicate Name
        ColumnName= Colum Title
        ColumnList = List of String
      • AddElement (ColumnName As String, Item As String, ID As String, TextColor As Int, RefreshView As Boolean) As String
        Add a sigle element on column, if column don't exist create it
      • AddElementTo (ColumnPos As Int, Item As String, ID As String, TextColor As Int, RefreshView As Boolean) As String
        Add a sigle element on column, Column select with position
      • AddItemRightMenu (Text1 As String, Text2 As String, Bitmap As Bitmap, ReturnValue As Object) As String
      • Class_Globals As String
      • Clear As String
      • ClearRightMenu As String
      • DesignerCreateView (Base As Panel, Lbl As Label, Props As Map) As String
      • GetBase As Panel
      • getColumElementList (ColumnName As String) As List
        Retun Item List from Column
      • getColumIDList (ColumnName As String) As List
        Retun ID List from Column
      • getColumNameList As List
        Retun List of Column Title
      • getID (ColumnPos As Int, ItemPos As Int) As String
        Retun ID List from Column position and Row (Item) position
      • getItem (ColumnPos As Int, ItemPos As Int) As String
        Retun Item List from Column position and Row (Item) position
      • getTitle (TitleBoard As String) As String
        Get Title BoardView
      • Height As Int
      • Initialize (vCallback As Object, vEventName As String) As String
      • Invalidate As String
      • IsInitialized As Boolean
        Verifica se l'oggetto sia stato inizializzato.
      • LeftPanelAddElement (ColumnName As String, Item As String) As String
      • LeftPanelClear As String
      • LeftPanelGetColumn As List
      • LeftPanelGetListElement (ColumnName As String) As List
      • LeftPanelRemoveColumn (ColumnName As String) As String
      • LeftPanelRemoveElement (ColumnName As String, Item As String) As String
      • RemoveColumn (ColumnName As String) As Boolean
        Remove entire column
      • RemoveColumnFromPosition (ColumnPosition As Int) As String
        ColumnNumber = 0... n
      • RemoveElementFromPosition (ColumnPosition As Int, ItemPosition As Int) As Boolean
        Delete a sigle item on coumn from position
      • RemoveElement (ColumnName As String, Item As String) As Boolean
        Delete a sigle item on coumn
      • SetBoardToHome As String
      • SetDimension (WidthItem As Int, HeightItem As Int) As String
        Width >=50dip
        Height >=20dip
      • setItem (ColumnPos As Int, ItemPos As Int,NewValue As String)
      • SetMovibleColumn (ColumnName As String, Movible As Boolean) As String
      • setTitle (TitleBoard As String) As String
        Set Title BoardView
      • setTitleBackgroundColor (Color As Int) As String
        Set Title BackGround Color
      • setTitleTextColor (Color As Int) As String
        Set Title Text Color
      • SortColumn (ColumnName As String, Ascending As Boolean) As String
      • SortColumnFromPosition (ColumnPosition As String, Ascending As Boolean) As String
        ColumnPositione = 0 .. n
      • Width As Int
    • Properties:
      • ColumNameList As List [read only]
        Retun List of Column Title
      • TitleBackgroundColor
        Set Title BackGround Color
      • TitleTextColor
        Set Title Text Color
  • DragDrop
    • Events:
      • PlacedCoordinate (DragView As View)
      • PlacedView (DragView As View, PlaceView As View)
    • Fields:
      • OverPlaceMoreView As Boolean
    • Functions:
      • AddDragView (View As View, AddAlsoPlaceCoordinate As Boolean) As DragDrop
        View is mobible View (Label,Panel ecc..)
        AddAlsoPlaceCoordinate (boolean) Add Initial View Coordinate to AddPlaceCoordinate
      • AddPlaceCoordinate (Left As Int, Top As Int, Width As Int, Height As Int) As DragDrop
      • AddPlaceView (View As View) As DragDrop
      • Class_Globals As String
      • ClearDrag As String
      • ClearPlaceCoordinate As String
      • ClearPlaceView As String
      • Initialize (mCallBack As Object, mEventName As String) As String
        Initializes the object. You can add parameters to this method if needed.
      • IsInitialized As Boolean
        Verifica se l'oggetto sia stato inizializzato.
  • DragGridView
    • Events:
      • CellClick (Column As Int, Row As Int)
      • ItemClickRightMenu (Position As Int, Value As Object)
    • Fields:
      • BoardHeight As Int
      • BoardWidth As Int
    • Functions:
      • AddElement (Column As Int, Row As Int, Text As String, ID As String, RefreshView As Boolean) As Boolean
      • AddItemRightMenu (Text1 As String, Text2 As String, Bitmap As Bitmap, ReturnValue As Object) As String
        Add Item to Menu
      • ChangeTextFromID (ID As String, Value As String) As String
      • ChangeTextFromPos (Column As Int, Row As Int, Value As String) As String
      • Class_Globals As String
      • Clear As String
      • ClearRightMenu As String
        Clear Menu
      • DesignerCreateView (Base As Panel, Lbl As Label, Props As Map) As String
      • Gesture_onTouch (Action As Int, X As Float, Y As Float, MotionEvent As Object) As Boolean
      • GetBase As Panel
      • GetCellEmpy (Column As Int, Row As Int) As Boolean
      • GetElement (ID As String) As String
      • GetElementPos (Column As Int, Row As Int) As String
      • GetLeftCell (Column As Int) As Int
      • GetTopCell (Row As Int) As Int
      • Grid (view As View, Col As Int, row As Int) As String
      • Initialize (vCallback As Object, vEventName As String) As String
      • Invalidate As String
      • IsInitialized As Boolean
        Verifica se l'oggetto sia stato inizializzato.
      • NumCol As Int
      • NumRow As Int
      • SetColName (ColumnName As String, Col As Int) As String
        Col 1..ColMax
      • SetRowName (RowName As String, Row As Int) As String
        Col 1..RowMax
  • DragListView
    • Events:
      • ClickAddItem
      • ClickMenuResponse (Response As Int)
      • ClickModify (ID As String)
      • ItemClick (Check As Boolean, ID As String)
      • ItemClickLateralMenu (Position As Int, Value As Object)
      • RequireSortColumn
    • Fields:
      • AddAble As Boolean
      • ListMenu As ListView
      • Modifable As Boolean
      • MultiSelect As Boolean
      • OpenMenu As Boolean
      • SortAble As Boolean
    • Functions:
      • AddItemLateralMenu (Text1 As String, Text2 As String, Bitmap As Bitmap, ReturnValue As Object) As String
      • AddLine (Text1 As String, Text2 As String, ID As String, RefreshView As Boolean) As String
      • Class_Globals As String
      • Clear As String
      • ClearLateralMenu As String
      • CloseLeftPanel As String
      • DesignerCreateView (Base As Panel, Lbl As Label, Props As Map) As String
      • GetBase As Panel
      • GetID (Position As Int) As String
      • GetisChecked (ID As String) As Boolean
        Retun List of Column Title
      • GetItemPanel (ID As String) As Panel
      • GetText1 (ID As String) As String
      • GetText2 (ID As String) As String
      • Height As Int
      • Initialize (vCallback As Object, vEventName As String) As String
      • Invalidate As String
      • IsInitialized As Boolean
        Verifica se l'oggetto sia stato inizializzato.
      • OpenLeftPanel As String
      • RemoveItemFromID (ID As String) As Boolean
        Delete a sigle item on coumn
      • RemoveItemFromPosition (ItemPosition As Int) As Boolean
        Delete a single item on coumn from position
      • SetBoardToHome As String
      • SetColorPanel (Color As Int) As String
      • SetDimension (HeightItem As Int) As String
        Height >=25dip
      • Size As Int
      • Width As Int
  • DragPanelView
    • Events:
      • ClickAddElement (ColumnName As String)
      • ClickModifyColumn (ColumnPosition As Int)
      • ClickModifyElement (ColumnPosition As Int, ItemPosition As Int)
      • ItemClickRightMenu (Position As Int, Value As Object)
      • RequireSortColumn (ColumnPosition As Int)
      • SwapLeftPanelToBoard (ID As String)
    • Fields:
      • PanelCorner As Int
      • SpaceBetweenBoard As Int
      • SpaceBetweenColumn As Int
      • SpaceBetweenTitleColumn As Int
    • Functions:
      • AddColumnEmpty (ColumnName As String, Movible As Boolean) As Boolean
        Add a column empy
      • AddElement (ColumnName As String, ID As String, RefreshView As Boolean) As Panel
        Add a sigle element on column, if column don't exist create it
      • AddItemRightMenu (Text1 As String, Text2 As String, Bitmap As Bitmap, ReturnValue As Object) As String
      • Class_Globals As String
      • Clear As String
      • ClearRightMenu As String
      • CloseLeftMenu As String
      • DesignerCreateView (Base As Panel, Lbl As Label, Props As Map) As String
      • GetBase As Panel
      • GetColumName As List
        Retun List of Column Title
      • GetIDPanelList (ColumnName As String) As List
      • GetPanel (ColumnName As String, ID As String) As Panel
        Retun List of Column Title
      • Height As Int
      • Initialize (vCallback As Object, vEventName As String) As String
      • Invalidate As String
      • IsInitialized As Boolean
        Verifica se l'oggetto sia stato inizializzato.
      • LeftPanelAddElement (ColumnName As String, ID As String) As Panel
      • LeftPanelClear As String
      • LeftPanelGetColumnList As List
      • LeftPanelGetElement (ID As String) As Panel
      • LeftPanelGetListElement (ColumnName As String) As List
      • LeftPanelRemoveColumn (ColumnName As String) As String
      • LeftPanelRemoveElement (ColumnName As String, ID As String) As String
      • OpenLeftMenu As String
      • RemoveColumn (ColumnName As String) As Boolean
        Remove entire column
      • RemoveColumnFromPosition (ColumnPosition As Int) As String
        ColumnNumber = 0... n
      • RemoveElementFromID (ColumnName As String, ID As String) As Boolean
        Delete a sigle item on coumn
      • RemoveElementFromPosition (ColumnPosition As Int, ItemPosition As Int) As Boolean
        Delete a sigle item on coumn from position
      • SetBoardToHome As String
      • SetColorPanel (Color As Int) As String
      • SetDimension (WidthItem As Int, HeightItem As Int) As String
        Width >=25dip
        Height >=25dip
      • SetMovibleColumn (ColumnName As String, Movible As Boolean) As String
      • Width As Int
1.png 2a.png 2b.png 3a.png 3b.png 3c.png 4a.png 4b.png 4c.png 4d.png 4e.png video1.gif video4.gif video3.gif
 
Last edited:

Star-Dust

Expert
Licensed User
Note. The examples are not updated with the new version. They will have to be adapted
 

Attachments

Last edited:

Star-Dust

Expert
Licensed User
Use DragBoard:

Inserts the data and displays it at the end with Invalidate (refresh after is more fast)
B4X:
    Dim DB As SQL

    Dim Cur As Cursor
  
    DragBoardView1.Clear
    DB.Initialize(File.DirInternal,"user.s3db",False)
    Cur=DB.ExecQuery("Select * FROM user")
  
    DragBoardView1.SetDimension(200dip,50dip)
  
    For i=0 To Cur.RowCount-1
        Cur.Position=i
        DragBoardView1.AddItem(Cur.GetString("City"),Cur.GetString("Name"),False) ' Refresh View = False
    Next
  
    DragBoardView1.Invalidate  ' Refresh all view
    DragBoardView1.SetBoardToHome
Inserts an entire data column and displays it
B4X:
    Dim DB As SQL
    Dim Cur,Cur2 As Cursor
  
    DragBoardView1.Clear
    DB.Initialize(File.DirInternal,"user.s3db",False)
    Cur=DB.ExecQuery("Select * FROM user GROUP By City")
  
    For i=0 To Cur.RowCount-1
        Cur.Position=i
        Cur2=DB.ExecQuery("Select * FROM user WHERE City='" & Cur.GetString("City") & "'")
      
        Dim L As List
        L.Initialize
        For N=0 To Cur2.RowCount-1
            Cur2.Position=N
            L.Add(Cur2.GetString("Name"))
        Next
        DragBoardView1.AddColumnList(Cur.GetString("City"),L)
    Next
  
    DragBoardView1.SetBoardToHome
 

Star-Dust

Expert
Licensed User
Use DragPanel:

B4X:
Dim DB As SQL
    Dim Cur As Cursor

    PanelMenu.RemoveView
    PanelMenu.Color=Colors.Transparent

    DragPanelView1.PanelMenu.RemoveAllViews
    ' Insert left menu

    DragPanelView1.PanelMenu.AddView(PanelMenu,0dip,0dip,DragPanelView1.PanelMenu.Width,DragPanelView1.PanelMenu.Height)

    DragPanelView1.Clear
    DragPanelView1.SetDimension(240dip,90dip)
    DragPanelView1.SetColorPanel(Colors.RGB(255,216,0))

    DB.Initialize(File.DirInternal,"note.s3db",False)
    Cur=DB.ExecQuery("SELECT * FROM nota")
    For i=0 To Cur.RowCount-1
        Cur.Position=i
        'ic_contact_picture
        Dim P As Panel = DragPanelView1.AddItem("Today",Cur.GetString("ID"),True)

        Dim LabelName As Label
        LabelName.Initialize("")
        LabelName.Text=Cur.GetString("Title")
        LabelName.Gravity=Gravity.CENTER
        LabelName.Typeface=Typeface.DEFAULT_BOLD
        LabelName.TextColor=Colors.Black
        LabelName.TextSize=20
        P.AddView(LabelName,10dip,0dip,180dip,30dip)

        Dim EditNote As EditText
        EditNote.Initialize("")
        EditNote.Text=Cur.GetString("Note")
        EditNote.Typeface=Typeface.SANS_SERIF
        EditNote.TextSize=12
        EditNote.TextColor=Colors.Black
        EditNote.SingleLine=False
        EditNote.Color=Colors.Transparent
        P.AddView(EditNote,10dip,30dip,180dip,50dip)
    Next

    'DragPanelView1.Invalidate
    DragPanelView1.SetBoardToHome
Get a Panel
B4X:
Dim LiStColumName As List = DragPanelView1.GetColumName
Dim ListPanelColumn= DragPanelView1.GetIDPanelList(ColumnName)
Dim MyPanel as panel = DragPanelView1.GetPanel(ColumnName,"ID")
 
Last edited:

Star-Dust

Expert
Licensed User
Use DragListView

B4X:
'Set Checkable from CustomView
'addline (Text1 AsString, Text2 AsString, ID AsString, RefreshView AsBoolean) As String
DragListView1.SetDimension(50dip)
    For i=1 To List.Length
        DragListView1.AddLine(List(i-1),"info :" & i,i,True)
    Next

' EVENT CLICK
Sub DragListView1_ItemClick (Check As Boolean, ID As String)
    ToastMessageShow(DragListView1.GetText1(ID) & " - Check: " & Check,False)
End Sub
 

johndb

Active Member
Licensed User
@Star-Dust - Thank you for the library.
There appears to be a library missing, "sd_viewextra" in your examples. I searched the forum but couldn't find the referenced library so I'm assuming it is called by your sd_dragboardview library and you hadn't included it in the main library?
 

johndb

Active Member
Licensed User
Yes, Miss. But I use only one object, the Swicth button. You can find the code for this single object on "Code snippets".
https://www.b4x.com/android/forum/threads/sd-switch-ios-materialdesig-style-with-customview.78871/
The point that I was trying to make is that your examples cannot be run as you had published them. Only one of your examples uses the switch button and the others rely on a "sd_viewextra.jar" library. I would suggest that you include this library and any other external component required to run your examples as a download in your first post. If you would like others to sample your work then you should post all of the necessary components. Additionally, don't use DoEvents as this is not longer supported (depreciated) in the newest B4A version.
Thank you for your contributions to the forum. They are very much appreciated.
 

Star-Dust

Expert
Licensed User
Sorry I did not know I had to include the libraries I used to create my library. Modify the library immediately by tapping ViewExtra ;)
 

Star-Dust

Expert
Licensed User
NEW
DragGridView
2.png


DragListView
3.png
 
Last edited:

Star-Dust

Expert
Licensed User
Update relase 0.05

DragDrop
  • Events:
    • PlacedCoordinate (DragView As View)
    • PlacedView (DragView As View, PlaceView As View)
  • Fields:
    • OverPlaceMoreView As Boolean
  • Functions:
    • AddDragView (View As View, AddAlsoPlaceCoordinate As Boolean) As DragDrop
      View is mobible View (Label,Panel ecc..)
      AddAlsoPlaceCoordinate (boolean) Add Initial View Coordinate to AddPlaceCoordinate
    • AddPlaceCoordinate (Left As Int, Top As Int, Width As Int, Height As Int) As DragDrop
    • AddPlaceView (View As View) As DragDrop
    • Class_Globals As String
    • ClearDrag As String
    • ClearPlaceCoordinate As String
    • ClearPlaceView As String
    • Initialize (mCallBack As Object, mEventName As String) As String
      Initializes the object. You can add parameters to this method if needed.
    • IsInitialized As Boolean
      Verifica se l'oggetto sia stato inizializzato.
video1.gif
video3.gif

video4.gif
 

Attachments

Star-Dust

Expert
Licensed User
I have updated the examples of the library with the latest version
 

Herbert32

Member
Licensed User
Hi,

the possibilities of this Library are looking great - starting to test it right now - maybe you can suggest a donation-amount :)
 

G-ShadoW

Active Member
Licensed User
Hello,

Is it possible to remove flickering effect?
Drag and drop item between more then 3 columns are hard to position.
Excellent library btw but it needs improvement.

Regards,
Tom
 
Top