flutter组件封装技巧

这段代码是一个用于创建一个(GradeTag)组件的类。这个组件可以根据输入的年级和颜色创建一个具有不同颜色和百分比显示的标签。

实现原理:

  1. 使用GradeTag.origin构造函数来创建一个包含默认颜色和百分比的字符串。这个构造函数使用了assert来确保输入的年级在特定的集合中('SSR', 'SR', 'S', '普通')。
  2. 使用GradeTag工厂方法来创建不同级别的GradeTag。通过传入不同的颜色参数,可以实现不同级别的标签具有不同的颜色。
  3. build方法中,使用Row组件来创建标签的布局。通过设置Container的边框圆角半径为6.0,可以实现标签具有圆角边框。
  4. 使用Text组件来显示年级和百分比。通过设置字体样式和颜色,可以实现不同的字体样式和颜色显示。

用途:

这个组件可以用于展示不同级别的成绩标签,例如SSR(高级)、SR(中级)和S(初级)等。同时,可以通过传入不同的颜色参数来定制标签的颜色。

注意事项:

  1. 确保在调用GradeTag.origin构造函数时,传入的年级在特定的集合中。否则,将会抛出异常。
  2. 在使用GradeTag工厂方法时,可以传入KeyColor参数,但不是必需的。如果未传入,将使用默认值。
  3. build方法中,使用了const关键字来定义EdgeInsets和BorderRadius,这意味着这些值在组件加载时只计算一次,从而提高性能。
  4. 使用if条件语句来判断是否显示百分比。这样可以控制只有当百分比参数不为空时才显示百分比。
class GradeTag extends StatelessWidget {final String grade;final Color? color;final String? num;const GradeTag.origin(this.grade,{super.key, this.color, this.num = ''}): assert(grade == 'SSR' || grade == 'SR' || grade == 'S' || grade == '普通');factory GradeTag(String grade,{Key? key, Color color = Colors.grey, String number = ''}) {switch (grade) {case 'SSR':return GradeTag.origin(grade, color: Colors.red, num: number);case 'SR':return GradeTag.origin(grade, color: Colors.orange, num: number);case 'S':return GradeTag.origin(grade, color: Colors.orange, num: number);case '普通':return GradeTag.origin(grade, color: Colors.grey, num: number);default:return GradeTag.origin(grade, color: color, num: number);}}@overrideWidget build(BuildContext context) {return Row(children: [Container(padding: const EdgeInsets.symmetric(vertical: 0, horizontal: 6),decoration: BoxDecoration(color: color, borderRadius: BorderRadius.circular(6.0)),child: Text(grade,style: const TextStyle(fontWeight: FontWeight.bold,fontSize: 18.0,color: Colors.white),),),if (num != '')Padding(padding: const EdgeInsets.only(left: 8.0),child: Text('$num%'),)],);}
}

构造函数工厂方法是两种不同的对象创建模式,在面向对象编程中广泛使用,它们之间有以下异同:

相同之处:

  1. 目的:两者都用于创建对象实例。

不同之处:

构造函数(Constructor)
  • 定义:构造函数是一种特殊的方法,与类关联,当通过 new 关键字创建类的新实例时自动调用。
  • 特点
    • 名称与类名相同。
    • 构造函数可以有参数,用来初始化对象的状态。
    • JavaScript 中构造函数通常首字母大写,这是一种约定俗成的做法,便于区分普通函数。
    • 使用 new 关键字调用时,会创建一个新的对象,并将该对象的上下文(即 this)绑定到新创建的对象上。
工厂方法(Factory Method)
  • 定义:工厂方法是一种设计模式,它是一种用于创建对象的接口,让子类决定实例化哪一个类。这里的解释主要针对广义上的工厂模式,包括简单工厂、工厂方法模式、抽象工厂模式等。
  • 特点
    • 是一个独立的函数或类方法,不局限于类内部。
    • 根据传入的参数或其他逻辑,动态决定创建哪种类型的对象。
    • 工厂方法可以隐藏对象的具体创建过程,提供了更大的灵活性,可以返回父类引用指向子类对象,实现多态。
    • 在JavaScript中,工厂函数通常不会被new关键字调用,而是直接调用函数并返回新创建的对象。
    • 工厂函数不会自动调用,需要手动调用

具体到JavaScript中:

  • 构造函数举例

    function Animal(type) {this.type = type;
    }
    var cat = new Animal('cat');
  • 工厂函数举例

    function createAnimal(type) {let animal;switch (type) {case 'cat':animal = Object.create(Cat.prototype);animal.initialize(); // 初始化Cat对象break;case 'dog':animal = new Dog(); // 或者直接创建Dog对象break;default:animal = null;}return animal;
    }
    var myCat = createAnimal('cat');

总结来说,构造函数是类的一部分,负责初始化类的实例,而工厂方法是一种更灵活的设计模式,但与构造函数不同,它不返回一个新对象,而是返回一个已经存在的对象。工厂函数不会自动调用,需要手动调用。允许你根据输入数据或环境条件创建不同类型的对象,它并不强制与类结构直接绑定。在JavaScript中,有时工厂函数也被用来模拟类似构造函数的行为,特别是当需要控制是否总是返回新对象,或者避免不小心忘记使用new关键字时。在构造函数中,this关键字引用当前创建的对象;在工厂函数中,this关键字引用的是函数的调用者。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/12822.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

如何使用AspectJ做切面,打印jar包中方法的执行日记

最近在工作中遇到一个redis缓存中的hash key莫名其妙被删除的问题,我们用了J2Cache,二级缓存用的是redis。hash key莫名其妙被删除又没有日志,就想到做一个切面在调用redis删除hash key的方法的时候,打印日志,并且把调…

高德、百度开车导航APP是怎么知道红绿灯倒计时的?

高德、百度开车导航APP之所以能够知道红绿灯的倒计时,这背后是一系列复杂的科技手段和数据分析的综合运用。从交管部门提供的数据,到导航软件自身通过大数据和算法进行的计算,每一个环节都为红绿灯倒计时的准确呈现提供了支撑。 首先&#xf…

白酒:低酒精度白酒的消费特点与市场前景

低酒精度白酒的消费特点与市场前景是酒类市场的一个重要话题。随着品质意识的提高和消费者口味的多样化,低酒精度白酒逐渐受到越来越多的关注。云仓酒庄豪迈白酒作为白酒的品牌之一,其消费特点和市场前景值得深入探讨。 首先,从消费特点来看…

基于YOLOv5的道路裂缝检测,加入一种基于内容引导注意力(CGA)的混合融合提升2个多点

💡💡💡本文主要内容:详细介绍道路裂缝检测整个过程,从数据集到训练模型到结果可视化分析。 💡💡💡通过加入一种基于内容引导注意力(CGA)的混合融合提升检测性能, 特征融合创新 | 一…

WS2812C是一款将控制电路和RGB芯片集成在一个5050元器件封装中的智能控制LED光源

一般说明 WS2812C是一款将控制电路和RGB芯片集成在一个5050元器件封装中的智能控制LED光源。内部包括智能数字端口数据锁存器和信号整形放大驱动电路。还包括一个精密的内部振荡器和一个 12V电压可编程恒流控制部分,有效保证像素点光源颜色高度一致。 …

决策规划仿真平台的搭建

以下内容笔记据来自于b站up主忠厚老实的老王,视频;链接如下: 自动驾驶决策规划算法第二章第一节 决策规划仿真平台搭建_哔哩哔哩_bilibili 使用到的软件有matlab、prescan、carsim以及visual stadio。 我电脑上软件的版本是matlab2022a&am…

2024.1IDEA 到2026年

链接:https://pan.baidu.com/s/1hjJEV5A5k1Z9JbPyBXywSw?pwd9g4i 提取码:9g4i解压之后,按照 操作说明.txt 操作; IntelliJ IDEA 2024.1 (Ultimate Edition) Build #IU-241.14494.240, built on March 28, 2024 Licensed to gurgles tumbles You have…

Python代码:二、多行输出

1、题目 将字符串 Hello World! 存储到变量str1中,再将字符串 Hello Nowcoder! 存储到变量str2中,再使用print语句将其打印出来(一行一个变量)。 2、代码 import sys str1 Hello World! str2 Hello Nowcoder! print (str1,st…

详细分清Session,Cookie和Token之间的区别,以及JWT是什么东西

Cookie Cookie是一种小型的文本文件,由网站在用户访问时存储在其计算机或移动设备上,Cookie主要用于跟踪、识别和存储有关用户的信息。 简单来说Cookie就是用来存储某些后端发送给前端的数据,例如我们登陆后,后端会返回一个登录…

Vue3 + Avue中 Header slot写法

avue示例 <template><avue-crud ref"crud":option"option":data"data"><template #name-header"{column}"><el-tag>{{(column || {}).label}}-{{(column || {}).prop}}</el-tag></template><…

02、网络协议、IP地址、网络状况、网络异质性问题的解决

声明&#xff1a;本教程不收取任何费用&#xff0c;欢迎转载&#xff0c;尊重作者劳动成果&#xff0c;不得用于商业用途&#xff0c;侵权必究&#xff01;&#xff01;&#xff01; 目录 前言 一、IP地址 二、网络协议 三、网络状况【了解】 四、网络异质性问题的解决 前…

C++ requires关键字简介

requires 是 C20 中引入的一个新关键字&#xff0c;用于在函数模板或类模板中声明所需的一组语义要求&#xff0c;它可以用来限制模板参数&#xff0c;类似于 typename 和 class 关键字。 requires关键字常与type_traits头文件下类型检查函数匹配使用&#xff0c;当requires后…

激光雷达技术:科技之眼,照亮前行

在科技与人文关怀的交响乐章中&#xff0c;一项名为“蝙蝠避障”使用了激光雷达技术原理及应用的创新成果&#xff0c;正悄然改变着视障朋友们的生活方式&#xff0c;为他们的日常出行铺设了一条充满希望的光明之路。今天&#xff0c;让我们一起深入探讨这项技术如何成为盲人出…

深化市场布局与产业链整合,三清互联以创新为公司发展赋能

近年来&#xff0c;我国大力发展现代化电力体系&#xff0c;并不断推进智能电网的发展&#xff0c;电力物联网作为支撑电力行业数字化发展的关键基础设施&#xff0c;迎来了快速发展黄金时期。作为电力物联网领域领先企业之一&#xff0c;三清互联凭借敏锐的市场洞察力和技术创…

探索软件测试中的创新测试方法:测试左移

软件测试中的测试左移方法 在当今竞争激烈的市场中&#xff0c;满足客户的期望和需求是所有公司在竞争中成为市场领导者的关键。这就是为什么越来越多的公司现在转向测试左移&#xff0c;并将其应用于产品开发过程。 在本文中&#xff0c;我们将从初学者的角度来介绍测试左移…

cmd如何以管理员身份运行

打开开始菜单。 在搜索框中输入cmd。 在搜索结果中&#xff0c;找到cmd&#xff0c;右键单击&#xff0c;选择“以管理员身份运行”。 参考&#xff1a; cmd如何以管理员身份运行

2024最新大厂C++面试真题合集,大厂面试百日冲刺 bay10

字节后端 什么叫进程&#xff1f;什么叫线程&#xff1f;他俩有什么区别和联系&#xff1f; 进程是操作系统进行资源分配和调度的基本单位&#xff0c;是一个程序关于某数据集合上的一次运行活动&#xff0c;是系统进行资源分配和调度的独立单位。 线程是进程的一个执行流&am…

刷题之字母异位词(leetcode 哈希表)

https://leetcode.cn/problems/group-anagrams/ class Solution { public:vector<vector<string>> groupAnagrams(vector<string>& strs) {unordered_map<string,vector<string>>map;//哈希表键为排序后或者处理后的字符串&#xff0c;值为某…

(1)医疗图像处理:MRI磁共振成像-基本原理--(杨正汉

一、基本原理 1.组成 对应了解 1&#xff09;主磁体&#xff1a; 基本构建&#xff0c;用于产生磁场&#xff0c;主要有两种方式产生磁场永磁&#xff08;磁铁&#xff09;、电磁&#xff08;给线圈通电&#xff09;。MR按主磁场的场强分类主要有四类&#xff0c;分类的原因…

5.14学习总结

java聊天室项目 分片上传 将大文件切分为多个小的数据块&#xff08;通常大小为1MB~10MB&#xff09;&#xff0c;然后将这些小数据块分别上传至服务器&#xff0c;最后由服务器将这些小块组合成完整的文件。这种方式可以避免由于网络中断或超时而导致上传失败&#xff0c;并…