Flutter--Text封装


import 'package:flutter/material.dart';

class UIText extends StatelessWidget {

  final String text;

  final TextOverflow overflow;
  final TextAlign textAlign;
  final int maxLines;

  final double fontSize;
  final Color color;
  final FontWeight fontWeight;
  final List<Shadow> shadows;
  final TextDecoration decoration;
  final Color decorationColor;
  final TextDecorationStyle decorationStyle;
  final double decorationThickness;

  UIText(this.text, {
    this.overflow,
    this.textAlign,
    this.maxLines,
    this.fontSize,
    this.color,
    this.fontWeight,
    this.shadows,
    this.decoration,
    this.decorationColor,
    this.decorationStyle,
    this.decorationThickness
  });

  @override
  Widget build(BuildContext context) {
    return Text(
      text,
      maxLines: maxLines,
      overflow: overflow,
      textAlign: textAlign,
      style: TextStyle(
        color: color,
        fontSize: fontSize,
        fontWeight: fontWeight,  //文字宽度
        //letterSpacing: -5, //字母之间的间距,可以为负
        //wordSpacing: 10,  //单词之间的间距, 其实是增加文本中空格所占宽度
        //height: 10,  //Text高度为文本实际高度的几倍
        //leadingDistribution: TextLeadingDistribution.even, //针对高度属性的调整,文字在垂直方向的位置
        //textBaseline: TextBaseline.ideographic
        shadows: shadows,
        decoration: decoration,
        decorationColor: decorationColor,
        decorationStyle: decorationStyle,
        decorationThickness: decorationThickness
      ),
    );
  }

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Flutter中的路由可以通过Navigator实现,通常我们会对Navigator进行封装来方便使用。下面是一个简单的路由封装示例: 1. 创建一个名为router.dart的文件,用于存放路由相关的代码。 2. 在router.dart中定义一个名为Routes的类,用于存放所有路由的名称。 ```dart class Routes { static const String home = '/'; static const String detail = '/detail'; // 添加更多路由名称 } ``` 3. 在router.dart中定义一个名为Router的类,用于实现路由的封装。 ```dart import 'package:flutter/material.dart'; class Router { static Route<dynamic> generateRoute(RouteSettings settings) { switch (settings.name) { case Routes.home: return MaterialPageRoute(builder: (_) => HomePage()); case Routes.detail: var data = settings.arguments as String; return MaterialPageRoute(builder: (_) => DetailPage(data: data)); // 添加更多路由 default: return MaterialPageRoute(builder: (_) => Scaffold(body: Text('Unknown Route'))); } } static void navigateTo(BuildContext context, String routeName, {Object arguments}) { Navigator.pushNamed(context, routeName, arguments: arguments); } static void navigateBack(BuildContext context) { Navigator.pop(context); } } ``` 在Router类中,我们实现了一个generateRoute方法来处理路由的跳转,同时也可以通过navigateTo和navigateBack方法来实现路由的跳转和返回。 4. 在main.dart中注册路由 ```dart import 'package:flutter/material.dart'; import 'router.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', initialRoute: Routes.home, onGenerateRoute: Router.generateRoute, ); } } ``` 在main.dart中,我们将onGenerateRoute设置为Router.generateRoute,即可实现路由的跳转。使用时,可以通过Router.navigateTo来跳转到指定的路由页面,通过Router.navigateBack来返回上一个页面。 以上就是一个简单的Flutter路由封装示例,可以根据实际需求进行修改和扩展。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值