html_widgets

a flutter widget approach for using html tags & css styles in your upcoming apps.

text widgets

*text property is required for all the text widgets.

h1

...
h1(
    text: "this is an h1 widget",
    ...
)
...

h2

...
h2(
    text: "this is an h1 widget",
    color:colors.red,
    ...
)
...

h3

...
h3(
    text: "this is an h3 widget",
    margin:20,
    ...
)
...

h4

...
h4(
    text: "this is an h4 widget",
    ...
)
...

h5

...
h5(
    text: "this is an h5 widget",
    ...
)
...

h6

...
h6(
    text: "this is an h6 widget",
    ...
)
...

p

...
p(
    text: "this is an h6 widget",
    ...
)
...

there are several properties you can pass to customize the heading widgets and paragraph widget

api reference

htmltable

if you want to use larger text with bold font weight, you can prefer to use htmltable()

...
htmltable(
    columns: [
            {'id': "name", 'label': 'name'},
            {'id': "pos", 'label': 'position'},
            {'id': "hours", 'label': 'hours'},
            {'id': "salary", 'label': 'salary'},
             ],

    rows: [
            {
                'name': "willamson",
                'pos': "manager",
                'hours': "10",
                'salary': "100k"
            },
            {
                'name': "willamson",
                'pos': "manager",
                'hours': "10",
                'salary': "100k"
            },
              
              ],
            ),
...

both the rows and columns property are required

api reference

htmlimage

if you want to use larger text with bold font weight, you can prefer to use htmlimage()

...
   htmlimage(
            src:"https://images.pexels.com/photos/3055008/pexels-photo-3055008.jpeg",
            onclick: () {
                print("image clicked !!");
            },
            size: "cover",
            margin: 10,
  ),
...

with htmlimage you can use both the network and assert images in the same widget.

*the src property is required

api reference