Flutter 扩展函数项目实用之封装SizedBox

Flutter里扩展函数可以用简化代码写法,关键字为extension,伪代码写法如下:

extension 扩展类名 on 扩展类型 {
//扩展方法
}

在Flutter页面里实现控件间距会常用到SizedBox,可使用扩展函数封装来达到简化代码的目的,基本步骤如下:

1、创建num_extension.dart文件,扩展类名为SizedBox+类型Double+后缀Extension,代码如下:

Dart 复制代码
import 'package:flutter/material.dart';

extension SizedBoxDoubleExtension on double {
  SizedBox get width => SizedBox(width: this);
  SizedBox get height => SizedBox(height: this);
  SizedBox withHeight(double height) => SizedBox(width: this, height: height);
}

2、使用示例对照,节选代码如下:

Dart 复制代码
  ///此为不使用扩展函数的写法
  Widget _buildRow() {
    return Row(
      children: [
        _buildText("1"),
        const SizedBox(
          width: 10,
        ),
        _buildText("2"),
        const SizedBox(
          width: 10,
        ),
        _buildText("3"),
      ],
    );
  }

  ///此为使用扩展函数的写法,要简洁些
  Widget _buildRowExtension() {
    return Row(
      children: [
        _buildText("1"),
        10.0.width,
        _buildText("2"),
        10.0.width,
        _buildText("3"),
      ],
    );
  }

  Widget _buildText(String text) {
    return Text(
      text,
      style: const TextStyle(color: Colors.blue),
    );
  }
相关推荐
2501_9445264238 分钟前
Flutter for OpenHarmony 万能游戏库App实战 - 知识问答游戏实现
android·开发语言·javascript·python·flutter·游戏·harmonyos
2501_944424121 小时前
Flutter for OpenHarmony游戏集合App实战之数字拼图滑动交换
android·开发语言·flutter·游戏·harmonyos
不会写代码0002 小时前
Flutter 框架跨平台鸿蒙开发 - 手写笔记工具开发教程
笔记·flutter·华为·harmonyos
小风呼呼吹儿2 小时前
Flutter 框架跨平台鸿蒙开发 - 老年便捷助手:打造适合老年人的智能工具箱
flutter·华为·harmonyos
小雨下雨的雨2 小时前
禅息:在鸿蒙与 Flutter 之间寻找呼吸的艺术
算法·flutter·华为·重构·交互·harmonyos
2501_944526422 小时前
Flutter for OpenHarmony 万能游戏库App实战 - 关于页面实现
android·java·开发语言·javascript·python·flutter·游戏
鸣弦artha2 小时前
Card组件基础使用
flutter
IT陈图图2 小时前
基于 Flutter × OpenHarmony 音乐播放器应用——构建录音控制按钮与录音状态按钮
flutter·华为·鸿蒙·openharmony
[H*]2 小时前
Flutter框架跨平台鸿蒙开发——Image综合应用
flutter·华为·harmonyos
小风呼呼吹儿3 小时前
Flutter 框架跨平台鸿蒙开发 - 倒计时秒表:打造多功能计时工具
网络·flutter·华为·harmonyos