当前位置: 首页 > article >正文

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

在这里插入图片描述

插件使用flutter_widget_from_html_core

flutter_widget_from_html_core: ^0.15.2

view

// 内容详情
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

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();
  }
}


http://www.kler.cn/a/501600.html

相关文章:

  • 深度学习中的常见初始化方法:原理、应用与比较
  • occ的开发框架
  • ansible 检查目录大小
  • Java QueryWrapper groupBy自定义字段,以及List<Map>转List<Entity>
  • 30_Redis哨兵模式
  • Redis的各种操作
  • 邮箱发送验证码(nodemailer)
  • Babylon第二阶段测试网发布
  • Linux第一课:c语言 学习记录day10
  • AWS简介
  • 每年一问:Java日期格式化中周所在年引发的bug
  • 香港云服务器的ip可以更换的吗?
  • PMP–一、二、三模、冲刺–分类–7.成本管理
  • Vue 开发者的 React 实战指南:快速入门与思维转换
  • 从项目代码看 React:State 和 Props 的区别及应用场景实例讲解
  • iOS - Objective-C语言的动态性
  • MacOS15 bash 终端怎么使用网络代理
  • 《拉依达的嵌入式\驱动面试宝典》—操作系统篇(五)
  • Kotlin 极简小抄 P5(异常、异常处理、自定义异常)
  • 三天学完微服务其二
  • 【江协STM32】10-4/5 I2C通信外设、硬件I2C读写MPU6050
  • Web3 重塑隐私保护:构建数字安全新防线
  • Flutter:吸顶效果
  • git打补丁
  • 010:传统计算机视觉之大津算法初探
  • centos7.6 安装nacos 2.0.4与恢复nacos的mysql