flutter文本简单实现

 1 import 'package:flutter/material.dart';
 2 import 'package:flustars/flustars.dart';
 3 import 'package:fl_chart/fl_chart.dart';
 4 
 5 void main()=>MyApp();//所有的写在一起就客园直接用=>来替代
 6 
 7 
 8 class MyApp extends StatelessWidget{
 9   @override
10   Widget build(BuildContext context) {
11     // TODO: implement build
12     return MaterialApp(
13       home: Scaffold(
14         appBar: AppBar(
15           title: Row(
16             children: <Widget>[
17               GestureDetector(
18                 onTap: (){
19                   print("我是一个人1");
20                 },
21                 child: Icon(Icons.arrow_back_ios),
22               ),
23               Container(//通过容器来添加标题
24                 width: 250,//高度来控制
25                 child: Center(
26                     child: Text('统计报表',style: TextStyle(
27                       // color: Colors.black,
28                     ),
29                     )
30                 ),
31               ),
32             ],
33           ),
34         ),
35         body: click(),
36       ),
37     );
38   }
39 }
40 
41 class click extends StatelessWidget{
42   @override
43   Widget build(BuildContext context) {
44     // TODO: implement build
45     return Text.rich(
46       TextSpan(
47         children: [
48           TextSpan(text: "静夜思",style: TextStyle(
49             fontSize: 30,
50           ),
51           ),
52           TextSpan(text: "[唐] 李白",style: TextStyle(
53             fontSize: 10,
54             color: Colors.orange,
55           ),
56           ),
57           TextSpan(text: "\n床前明月光，疑是地上霜。\n举头望明月，低头思故乡。",style: TextStyle(
58             fontSize: 20,
59           ),
60           ),
61         ]
62       ),
63       textAlign: TextAlign.center,//盒子内部居中
64     );
65   }
66 }
67 class text extends StatelessWidget{
68   @override
69   Widget build(BuildContext context) {
70     // TODO: implement build
71     return Text('静夜思\n[唐] 李白\n床前明月光，疑是地上霜。\n举头望明月，低头思故乡。',
72         style:TextStyle(
73           fontSize: 20,
74         ) ,
75     );
76   }
77 }
flutter简单文本实现效果如下
flutter文本简单实现

猜你喜欢
