text

  1. import 'package:flutter/material.dart';
  2. void main() => runApp(MyApp());
  3. class MyApp extends StatelessWidget {
  4. @override
  5. Widget build(BuildContext context) {
  6. return MaterialApp(
  7. title: 'Flutter Demo',
  8. theme: ThemeData(
  9. primarySwatch: Colors.blue,
  10. ),
  11. home: MyHomePage(title: '傻╮(╯▽╰)╭'),
  12. );
  13. }
  14. }
  15. class MyHomePage extends StatefulWidget {
  16. MyHomePage({Key key, this.title}) : super(key: key);
  17. final String title;
  18. @override
  19. _MyHomePageState createState() => _MyHomePageState();
  20. }
  21. class _MyHomePageState extends State<MyHomePage> {
  22. int _counter = 0;
  23. void _incrementCounter() {
  24. setState(() {
  25. _counter+=2;
  26. });
  27. }
  28. @override
  29. Widget build(BuildContext context) {
  30. return Scaffold(
  31. appBar: AppBar(
  32. title: Text(widget.title),
  33. ),
  34. body: Center(
  35. child: Column(
  36. mainAxisAlignment: MainAxisAlignment.center,
  37. children: <Widget>[
  38. Text(
  39. '假设生命倒计时是 $_counter 天 倒计时假装生命倒计时是 $_counter 天假装生命倒计时假装生命倒计时是 天假装生命倒时假装生命倒计时是3天假装生命倒计时',
  40. textAlign: TextAlign.center,//居中对齐 .left .right 对齐 还有start end
  41. maxLines: 2,//最大显示行数
  42. overflow: TextOverflow.ellipsis,//TextOverflow.ellipsis结尾多余部分显示3个点,fade 渐变消失(垂直)
  43. style: TextStyle(
  44. fontSize: 26.0,
  45. color: Color.fromARGB(200, 250, 120, 120),//第一个是透明度后3是rjb
  46. decoration: TextDecoration.underline,//下划线
  47. decorationStyle: TextDecorationStyle.solid,//实线
  48. ),
  49. ),
  50. Text(
  51. '$_counter 剩下',
  52. style: TextStyle(
  53. fontFamily: '微软雅黑',
  54. fontSize: 30.0,
  55. color: Color.fromARGB(255, 10, 200, 100)
  56. ),
  57. ),
  58. Text(
  59. '就乖乖学习',
  60. ),
  61. ],
  62. ),
  63. ),
  64. floatingActionButton: FloatingActionButton(
  65. onPressed: _incrementCounter,
  66. tooltip: 'Increment',
  67. child: Icon(Icons.add),
  68. ),
  69. );
  70. }
  71. }

text、container、image属性 - 图1

container

  1. import 'package:flutter/material.dart';
  2. void main() => runApp(MyApp());
  3. class MyApp extends StatelessWidget {
  4. @override
  5. Widget build(BuildContext context) {
  6. return MaterialApp(
  7. title: 'Flutter Demo',
  8. theme: ThemeData(
  9. primarySwatch: Colors.yellow,
  10. ),
  11. home: Scaffold(
  12. appBar: AppBar(
  13. title: Text('hhh'),
  14. ),
  15. body: Center(
  16. child: Container(
  17. child: new Text('hi dwh', style: TextStyle(fontSize: 28.0,color: Colors.blue),),
  18. alignment: Alignment.topLeft,
  19. width: 300,
  20. height: 300,
  21. //color: Colors.black,
  22. padding: const EdgeInsets.fromLTRB(20, 30, 0, 0),//内边距
  23. margin: const EdgeInsets.all(10),//外边距
  24. decoration: new BoxDecoration(
  25. gradient: const LinearGradient(//线性渐变
  26. colors: [Colors.lightGreenAccent,Colors.lightGreen,Colors.pink]
  27. ),
  28. border: Border.all(width: 2.0, color: Colors.blue,)//边框
  29. ),
  30. ),
  31. ),
  32. ),
  33. );
  34. }
  35. }

text、container、image属性 - 图2

引用外部Image

  1. home: Scaffold(
  2. appBar: AppBar(
  3. title: Text('hhhh'),
  4. ),
  5. body: Center(
  6. child: Container(
  7. child: Container(
  8. child: new Image.network(
  9. 'https://img.isharebest.com/2018041509.jpg',
  10. fit: BoxFit.contain,
  11. //尽量充满,维持比例,fill全充满,
  12. //fitWidth 横向充满,纵向多余裁切
  13. //cover 图片不变形 四周裁切,scaleDown图片大小不变
  14. )
  15. ),
  16. width: 500.0,
  17. height: 350.0,
  18. color: Colors.yellow,
  19. padding: const EdgeInsets.all(10),
  20. ),
  21. ),
  22. ),

text、container、image属性 - 图3


  1. child: Container(
  2. child: new Image.network(
  3. 'https://img.isharebest.com/2018041509.jpg',
  4. fit: BoxFit.contain,
  5. color: Colors.lightGreen,
  6. colorBlendMode: BlendMode.darken,//颜色混合
  7. //colorBlendMode: BlendMode.colorBurn //增强对比度
  8. //colorBlendMode: BlendMode.colorDodge//提升曝光?
  9. )
  10. ),

text、container、image属性 - 图4text、container、image属性 - 图5
text、container、image属性 - 图6text、container、image属性 - 图7