Flutter color颜色的用法

简介: Flutter color颜色的用法

系统自带color的使用和自定义color


系统的color

查看Color的源码

  static const Color black = Color(0xFF000000);

可以看到,这里的black也是赋值封装好的,我们可以直接调用(Colors.black 即可)。

当然系统也封装了很多的color使用(查看源码轻松找到),

image.png

import 'package:flutter/material.dart';
class YColors {
  static const Color colorPrimary = Color(0xff4caf50);
  static const Color colorPrimaryDark = Color(0xff388E3C);
  static const Color colorAccent = Color(0xff8BC34A);
  static const Color colorPrimaryLight = Color(0xffC8E6C9);
  static const Color primaryText = Color(0xff212121);
  static const Color secondaryText = Color(0xff757575);
  static const Color dividerColor = Color(0xffBDBDBD);
}

调用:


theme: ThemeData(
  ...
        primaryColor: YColors.colorPrimary,
        primaryColorDark: YColors.colorPrimaryDark,
        accentColor: YColors.colorAccent,
        dividerColor: YColors.dividerColor,
      ),


不过这里注意color的值,不是#ff0000格式的了,是ARGB格式的



什么是ARGB

在flutter中,color使用的是ARGB,0x后面的就是ARGB,A就是FF表示透明度,RGB就是三原色了,


比如,RGB的红色是#ff0000


所以,ARGB红色我们就可以这样表示


0xffff0000



我们除了改主题的颜色之外,还有很多系统的控件颜色都可以修改的,查看源码ThemeData即可。



目录
相关文章
Flutter笔记:AnimationMean、AnimationMax 和 AnimationMin 三个类的用法
Flutter笔记:AnimationMean、AnimationMax 和 AnimationMin 三个类的用法
93 3
|
20天前
|
容器
Flutter &&鸿蒙next中的 Stack 和 Positioned 用法详解
在 Flutter 中,Stack 和 Positioned 是创建层叠布局和灵活定位元素的常用组件。Stack 可以将多个子组件叠加在一起,允许子组件相互重叠;Positioned 用于在 Stack 内部精确控制子组件的位置。本文详细介绍了它们的基本用法、属性和应用场景,包括动画、弹出层和悬浮按钮等。
69 1
|
22天前
|
Dart 安全 编译器
Flutter结合鸿蒙next 中数据类型转换的高级用法:dynamic 类型与其他类型的转换解析
在 Flutter 开发中,`dynamic` 类型提供了灵活性,但也带来了类型安全性问题。本文深入探讨 `dynamic` 类型及其与其他类型的转换,介绍如何使用 `as` 关键字、`is` 操作符和 `whereType<T>()` 方法进行类型转换,并提供最佳实践,包括避免过度使用 `dynamic`、使用 Null Safety 和异常处理,帮助开发者提高代码的可读性和可维护性。
73 1
|
3月前
|
JavaScript 前端开发 Android开发
Flutter笔记:关于WebView插件的用法(下)
Flutter笔记:关于WebView插件的用法(下)
223 5
|
3月前
|
存储 缓存 JavaScript
Flutter笔记:关于WebView插件的用法(上)
Flutter笔记:关于WebView插件的用法(上)
1552 4
|
6月前
|
Dart 小程序 前端开发
WebSocket 解析与应用(包含web前端、服务端、小程序、dart/flutter中的用法)
WebSocket 解析与应用(包含web前端、服务端、小程序、dart/flutter中的用法)
782 0
|
6月前
|
开发框架 Java 开发者
Flutter特殊用法介绍
Flutter特殊用法介绍 Flutter是一种开源移动应用程序开发框架,具有高效、快速、美观、灵活等特点。本文将介绍Flutter中的一些特殊用法,帮助开发者更好地使用Flutter进行应用程序开发。
|
存储 Android开发 iOS开发
flutter系列之:Navigator的高级用法
上篇文章我们讲到了flutter中navigator的基本用法,我们可以使用它的push和pop方法来进行Router之间的跳转。 在flutter中一个Router就是一个widget,但是在Android中,一个Router就是Activity,在IOS中,一个Router是一个ViewController。 Router除了之前讲过的push和pop方法之外,还有一些更加高级的用法,一起来看看吧。
flutter系列之:Navigator的高级用法
|
存储 Dart 前端开发
Flutter(三)——一篇文章掌握Dart语言的用法(三)
Flutter(三)——一篇文章掌握Dart语言的用法(三)
265 0
Flutter(三)——一篇文章掌握Dart语言的用法(三)
|
存储 Dart JavaScript
Flutter(三)——一篇文章掌握Dart语言的用法(一)
Flutter(三)——一篇文章掌握Dart语言的用法(一)
378 0
Flutter(三)——一篇文章掌握Dart语言的用法(一)