'How can i customise mapview's map marker popup like the image below in kivy?

MapMarker Popup

I am trying to customise a MapMarker Popup without using the regular 'source' property in kivy MapView class. I have tried creating the circle with the button effect and elevation effect, but I can't seem to remove the white box background behind the red circle, and adding text in the circle also eludes me. Any idea would really help. I have included my simple test code sample.

Here is my py code:

from kivymd.app import MDApp
from kivymd.uix.floatlayout import MDFloatLayout
from kivymd.uix.behaviors import (CircularRippleBehavior, FakeCircularElevationBehavior, BackgroundColorBehavior)
from kivy.garden.mapview import MapMarkerPopup, MapMarker
from kivy.lang import Builder
from kivy.uix.behaviors import ButtonBehavior


class RoundedMarker(MDFloatLayout,
                MapMarkerPopup,
                CircularRippleBehavior,
                FakeCircularElevationBehavior,
                BackgroundColorBehavior,
                ButtonBehavior):
    pass

class TestApp(MDApp):
    def build(self):
        self.theme_cls.theme_style = "Dark"
        self.theme_cls.primary_palette = "BlueGray"
        return Builder.load_file('test.kv')

TestApp().run()

And my kv code:

<RoundedMarker>:
size_hint: None,None
size: "20dp","20dp"
radius: self.size[0] / 2
md_bg_color: 1, 0, 0, 1

MapView:
    lat: 10
    lon: 10
    zoom: 5
    RoundedMarker:
        lat: 12
        lon: 12
        elevation: 5


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source