Misar IO Docs

Flutter SDK

Embed MisarBlog articles natively in Flutter using a WebView widget

Installation

Add to pubspec.yaml:

dependencies:
  misarblog_flutter: ^0.1.0

Then run flutter pub get.

Android: ensure minSdkVersion 20 or higher in android/app/build.gradle.

Embed a MisarBlog article

import 'package:misarblog_flutter/misarblog_flutter.dart';

// In any widget tree:
MisarBlogEmbed(
  username: 'gulshan',
  slug: 'my-article',  // omit for profile embed
  theme: 'dark',       // "auto" | "light" | "dark"
  height: 600.0,
)

Full page embed example

import 'package:flutter/material.dart';
import 'package:misarblog_flutter/misarblog_flutter.dart';

class ArticlePage extends StatelessWidget {
  const ArticlePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Article')),
      body: const SingleChildScrollView(
        child: MisarBlogEmbed(
          username: 'gulshan',
          slug: 'my-article',
          height: 800.0,
        ),
      ),
    );
  }
}

Using embed URL directly

The Flutter SDK re-exports embedUrl from misarblog_sdk:

import 'package:misarblog_flutter/misarblog_flutter.dart';

final url = embedUrl('gulshan', slug: 'my-article', theme: 'light');

API reference

MisarBlogEmbed widget

| Property | Type | Default | Description | |----------|------|---------|-------------| | username | String | — | MisarBlog username (required) | | slug | String? | null | Article slug — null for profile embed | | theme | String | "auto" | "auto" | "light" | "dark" | | height | double | 600.0 | Fixed height of the WebView |

The widget is a StatelessWidget wrapping webview_flutter's WebViewWidget inside a SizedBox.