Markdown

Introduction

The Markdown widget allows you to easily add and style your text using Markdown syntax. By using Markdown, you can add headings, lists, links, images, and more to enhance the presentation of your text content.

Function signature

Markdown(
    content="",
    height=300,
    widget_id=None,
)

Parameters

content

Determine input Markdown content.

type: str

default value: ""

markdown = Markdown(content="Some content")

height

Determine Widget height.

type: int

default value: 300

markdown = Markdown(content="Some content", height=30)

show_border

Determine Widget height.

type: bool

default value: True

markdown = Markdown(content="Lorem ipsum ...", show_border=False)

widget_id

ID of the widget.

type: str

default value: None

Methods and attributes

Mini App Example

You can find this example in our Github repository:

supervisely-ecosystem/ui-widgets-demos/text-elements/005_markdown/src/main.py

Import libraries

import os

import supervisely as sly
from dotenv import load_dotenv
from supervisely.app.widgets import Card, Container, Flexbox, Markdown, Button

Init API client

First, we load environment variables with credentials and init API for communicating with Supervisely Instance:

load_dotenv("local.env")
load_dotenv(os.path.expanduser("~/supervisely.env"))

api = sly.Api()

Initialize Button widgets, we will use

button_text = Button(text="Set md text")
button_clean = Button(text="Clean md")
button_readme = Button(text="Set md readme")
buttons_container = Flexbox(widgets=[button_text, button_clean, button_readme])

Initialize Markdown widget

md_path = "path/to/README.md"
md = ""
with open(md_path, "r") as f:
    md = f.read()

markdown = Markdown(height=400)

Create app layout

Prepare a layout for the app using Card widget with the content parameter and place widget that we've just created in the Container widget.

card = Card(title="Markdown", content=Container([markdown, buttons_container]))
layout = Container(widgets=[card], direction="vertical")

Create app using layout

Create an app object with the layout parameter.

app = sly.Application(layout=layout)

Handle button clicks

@button_text.click
def simple_content():
    markdown.set_content("### Title \n *some markdown text*")


@button_clean.click
def clear_content():
    markdown.set_content("")


@button_readme.click
def readme_content():
    markdown.set_content(md)

Last updated