Flutter:文章详情页,渲染富文本

插件使用flutter_widget_from_html_core

haskell 复制代码
flutter_widget_from_html_core: ^0.15.2

view

js 复制代码
// 内容详情
Widget _buildContent() {
  return <Widget>[
    HtmlWidget(
      controller.content,
      // 设置渲染模式
      renderMode: RenderMode.column,
      // 设置文本样式
      textStyle: TextStyle(
        fontSize: 28.sp,
        color: Colors.white,
        height: 1.5,
      ),
    ),
  ]
  .toColumn(crossAxisAlignment: CrossAxisAlignment.center)
  .paddingAll(30.w)
  .card(color: AppTheme.blockBgColor);
}

controller

js 复制代码
import 'package:get/get.dart';
class AgreementController extends GetxController {
  AgreementController();
  String title = '';
  String content = '';  

  _initData() {
    title = Get.arguments['title'] ?? '详情';
    content = '''
      <div style="font-size: 16px;">
        <h1>示例标题22</h1>
        <p>这是一段<strong>富文本</strong>内容</p>
      </div>
    ''';
    update(["agreement"]);
  }

  @override
  void onInit() {
    super.onInit();
    _initData();
  }
}
相关推荐
mONESY1 小时前
JavaScript 栈、队列、数组与链表核心知识点总结
javascript·面试
ZengLiangYi1 小时前
TypeScript 项目配置:tsconfig、ESM、路径别名
javascript·typescript·aigc
晓13131 小时前
【Cocos Creator 3.x】篇——第二章 入门
前端·javascript·游戏引擎
想要成为糕糕手1 小时前
前端必修课:JavaScript 数组与数据结构底层逻辑全解析
javascript·数据结构·面试
xiaofeichaichai2 小时前
React Hooks
前端·javascript·react.js
数据知道2 小时前
C++ 层拦截:修改 Blink 引擎与 V8 绑定的底层逻辑
javascript·数据采集·指纹浏览器·风控
●VON2 小时前
AtomGit Flutter鸿蒙客户端:设置页面
flutter·华为·跨平台·harmonyos·鸿蒙
ha_lydms2 小时前
AnalyticDB分区、分布键性能优化
android·大数据·分布式·性能优化·分布式计算·分区·analyticdb
星辰3 小时前
Ijkplayer重新编译支持h264裸流
android
2301_773643623 小时前
ceph镜像
前端·javascript·ceph