B4J Question [ABMaterial] ABMGooglemap and ModalSheet Problem

magi6162

Well-Known Member
Licensed User
in a ModalSheet I put an ABMGooglemap,
but I get what in the attached figure.
I have the API_Key (which with an ABMGoolemap component in an ABMPage works fine).
help me, please:(
I use this code:
B4X:
Sub ViewMappa(ActiveRowID As String)
    Dim mappaProcModal As ABMModalSheet = page.ModalSheet("mappaProcModal")

    Dim SQLDB As SQL = ABMShared.SQLGet
    Dim lstCoordProc As List = DBM.SQLSelect(SQLDB,"SELECT IDP,IDC,IDG,Lat,Lon,CONCAT(Cognome,' ',Nome) AS Proc FROM proc WHERE IDP = ?",Array As Object(ActiveRowID))
    DBM.CloseSQL(SQLDB)
  
    Dim m As Map = lstCoordProc.Get(0)
  
    Dim lmp As ABMLabel = mappaProcModal.Header.Component("lmp")
    lmp.Text = m.Get("proc")
  
    Dim mp As ABMGoogleMap = mappaProcModal.Content.Component("mp")
    mp.SetLocation(m.Get("lat"),m.Get("lon"))
    mp.AddMarker("markerProc",m.Get("lat"),m.Get("lon"),ABM.COLOR_BLUE,"","")
  
    mp.Refresh
    page.ShowModalSheet("mappaProcModal")
End Sub

Sub BuildMappaProcModalSheet() As ABMModalSheet
    Dim mappaProcModal As ABMModalSheet
    mappaProcModal.Initialize(page, "mappaProcModal", True, ABM.MODALSHEET_TYPE_NORMAL, "modalb")
    mappaProcModal.Content.UseTheme("modalcontent")
    mappaProcModal.Footer.UseTheme("modalfooter_jw")
    mappaProcModal.Size = ABM.MODALSHEET_SIZE_LARGE
    mappaProcModal.IsDismissible = True

    ' header
    mappaProcModal.Header.AddRowsM(1,True,0,0,"").AddCells12(1,"")
    mappaProcModal.Header.BuildGrid ' IMPORTANT!

    Dim lmp As ABMLabel
    lmp.Initialize(page,"lmp","Nome",ABM.SIZE_H6,False,"testadlg")
    mappaProcModal.Header.Cell(1,1).AddComponent(lmp)

    ' content
    mappaProcModal.Content.AddRowsM(1,True,0,0,"").AddCells12(1,"")
    mappaProcModal.Content.BuildGrid ' IMPORTANT!

    Dim mp As ABMGoogleMap

    mp.Initialize(page, "mp", ABMShared.SALA_Lat,ABMShared.SALA_Lon, 12, 300, ABM.GOOGLEMAPTYPE_HYBRID,0)
    mp.Draggable = True
    mp.HasMapTypeControl = True
    mp.HasStreetViewControl = False
    mp.HasZoomControl = True
    mp.AddMapType(ABM.GOOGLEMAPTYPE_ROADMAP)
    mp.AddMapType(ABM.GOOGLEMAPTYPE_TERRAIN)
    mp.AddMapType(ABM.GOOGLEMAPTYPE_HYBRID)
    mp.AddMapType(ABM.GOOGLEMAPTYPE_SATELLITE)
 
    mappaProcModal.Content.Cell(1,1).AddComponent(mp)
 
    ' footer
    mappaProcModal.Footer.AddRowsM(1,True,0,0,"").AddCellsOS(3,0,0,0,4,4,4,"")
    mappaProcModal.Footer.BuildGrid ' IMPORTANT!
 
    mappaProcModal.Footer.PaddingTop = ("10px")
 
    Dim btnMapModifica As ABMButton
    btnMapModifica.InitializeFloating(page,"btnMapModifica", "mdi-image-edit", "bigambra")
    btnMapModifica.Size = ABM.BUTTONSIZE_SMALL
    mappaProcModal.Footer.Cell(1,1).AddComponent(btnMapModifica)
    Dim lbl1 As ABMLabel
    lbl1.Initialize(page, "lbl1", "{B}" & "Modifica" & "{/B}", ABM.SIZE_SPAN,  False, "whitefc")
    mappaProcModal.Footer.Cell(1,1).AddComponent(lbl1)

    Dim btnMapSalva As ABMButton
    btnMapSalva.InitializeFloating(page,"btnMapSalva", "mdi-action-done", "bigambra")
    btnMapSalva.Size = ABM.BUTTONSIZE_SMALL
    mappaProcModal.Footer.Cell(1,2).AddComponent(btnMapSalva)
    Dim lbl2 As ABMLabel
    lbl2.Initialize(page, "lbl2", "{B}" & "Salva" & "{/B}", ABM.SIZE_SPAN,  False, "whitefc")
    mappaProcModal.Footer.Cell(1,2).AddComponent(lbl2)
 
    Dim btnMapAnnulla As ABMButton
    btnMapAnnulla.InitializeFloating(page, "btnMapAnnulla", "mdi-action-highlight-remove", "bigambra")
    btnMapAnnulla.Size = ABM.BUTTONSIZE_SMALL
    btnMapAnnulla.Enabled = False
    mappaProcModal.Footer.Cell(1,3).AddComponent(btnMapAnnulla)
    Dim lbl3 As ABMLabel
    lbl3.Initialize(page, "lbl3","{B}" & "Annulla" & "{/B}", ABM.SIZE_SPAN,  False, "whitefc")
    mappaProcModal.Footer.Cell(1,3).AddComponent(lbl3)

    Return mappaProcModal
End Sub
 

Attachments

Last edited:

magi6162

Well-Known Member
Licensed User
If possible I wanted to know how to adapt the map to the modal sheet.
I would like the map to use the full height of the modal sheet. thank you
 

alwaysbusy

Expert
Licensed User
It is because a modal sheet is shown animated and at the point where a render of the map is asked at Google, the width is still 0.

So you will have to trick it:

In globals
B4X:
Dim GoogleTimer As Timer
B4X:
' where you show your modal
page.ShowModalSheet("myModal")  
' start the timer
GoogleTimer.Initialize("GoogleTimer", 500)
GoogleTimer.Enabled = True
B4X:
Sub GoogleTimer_Tick
   GoogleTimer.Enabled = False
   Dim myModal As ABMModalSheet = page.ModalSheet("myModal")
   Dim gm1 As ABMGoogleMap = myModal.Content.Component("gm1")
   gm1.Refresh
End Sub
I would like the map to use the full height of the modal sheet.
Don't think this is possible as you MUST set the height in the Initialize of the Google Map (the google api needs a fixed height to render the map).
 

magi6162

Well-Known Member
Licensed User
Perfect!!! thank you very much:):)

Don't think this is possible as you MUST set the height in the Initialize of the Google Map (the google api needs a fixed height to render the map).
Can I calculate the height of the modal sheet?
Or adapt the google map to the modal sheet, depending on whether it is a desktop or smartphone?
Also how can I delete the side scrollbar? (see picture)
 

Attachments

Last edited:
Top