Flutter 基础 widgets -- Icon 和 Color
作者:互联网
常用 Icon
Flutter 集成了 MaterialApp的图标库 用法:Icon(Icons.具体名称)import 'package:flutter/material.dart'; class Home extends StatelessWidget { const Home({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: const Text('Icon Demo'), // 单色 Icon leading: const Icon(Icons.arrow_back_ios_new), actions: const [ Icon(Icons.more_horiz), Icon(Icons.share), ], ), body: Row( children: const [ // 自定义 Icon 样式 Icon( Icons.favorite, color: Colors.pink, size: 24, semanticLabel: 'Text to announce', ), Icon( Icons.audiotrack, color: Colors.green, size: 30, ), Icon( Icons.beach_access, color: Colors.blue, size: 36, ) ], ), ); } }
常用 Color Color(自定义颜色) Flutter 中通过 ARGB 来声明颜色 Color(0xFF42A5F5); // 16进制的ARGB = 透明度 + 六位十六进制颜色 Color.fromARGB(int a, int r, int g, int b); const Color.fromARGB(0xFF, 0x42, 0xA5, 0xF5); const Color.fromARGB(255, 66, 165, 245); Color.fromRGBO(int r, int g, int b, double opacity); const Color.fromRGBO(66, 165, 255, 1.0);
Colors.(英文字母声明的颜色) 来自于 Material Design 提供的颜色
import 'package:flutter/material.dart'; class Home extends StatelessWidget { const Home({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: const Text('Color'), ), body: Center( child: Text.rich(TextSpan( children: <TextSpan>[ const TextSpan( text: '问道诗', style: TextStyle( color: Color.fromRGBO(35, 225, 125, 1.0), fontSize: 36, ), ), const TextSpan( text: '练得身形似鹤形', style: TextStyle( color: Color(0xFFFF9000), fontSize: 16, ), ), const TextSpan( text: '千株松下两涵经', style: TextStyle( color: Color.fromARGB(0xFF, 0x00, 0xFF, 0xFF), fontSize: 18, ), ), const TextSpan( text: '我来问道无余说', style: TextStyle( color: Color.fromARGB(66, 255, 0, 0), fontSize: 20, ), ), TextSpan( text: '云在青天水在瓶', style: TextStyle( color: Colors.amber[300], fontSize: 22, ), ), ], ))), ); } }
标签:const,Icons,--,Color,int,widgets,color,Icon 来源: https://www.cnblogs.com/rogerwu/p/16228453.html