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();
  }
}
相关推荐
名字还没想好☜2 小时前
React 实现暗黑模式切换:localStorage 持久化、SSR 首屏闪烁与跟随系统主题
前端·javascript·react.js·ecmascript·react·next.js
自动化监测Learner3 小时前
主流 Web 端地图引擎对比:选型指南与优劣分析
javascript
宿6747 小时前
vue3-config
前端·javascript·vue.js
文人sec7 小时前
MySQL主库出问题了,从库怎么办?备库为什么会延迟好几个小时?
android·数据库·mysql
淡写成灰7 小时前
「Flutter 文件保存太难了?」一个插件打通 7 大平台,我把方案开源了 🎉
flutter·harmonyos
hai_android7 小时前
不用 AIDL,手把手教你手写 Binder 代理类
android·kotlin
mmsx8 小时前
osmdroid 地图实战 03|地图的"分层世界":离线方案、图层模型与 Overlay 体系
android·前端
ShineWinsu9 小时前
对于 Vue 3:从为什么学 Vue,到声明式渲染与数据响应式的解析
前端·javascript·vue.js
张文是假的啊9 小时前
IOC依赖注入问题:@Primary 和 @Qualifier的使用
android
换元不配限10 小时前
ConstraintLayout核心用法详解(三):引导线、屏障、组和占位
android·placeholder·barrier·约束布局·guideline