谈谈我对 Flutter 未来发展 和 “嵌套地狱” 的浅显看法

移动开发 作者: 2024-08-25 10:55:01
Flutter 未来发展 提到 Flutter 就不得不提到 Fuchsia 系统,这是一个尚未正式发布的操作的系统,引用 Android 和 Chrome 的高级副总裁 Hiroshi Lockhe
@override
Widget build(BuildContext context) {
  return Column(
    children: <Widget>[
      Container(
        height: 45,child: Row(
          children: <Widget>[
            SizedBox(
              width: 30,),Icon(
              Icons.notifications,color: Colors.blue,SizedBox(
              width: 30,Expanded(
              child: Text('消息中心'),Container(
              padding: EdgeInsets.symmetric(horizontal: 10),decoration: BoxDecoration(
                  shape: BoxShape.rectangle,borderRadius: BorderRadius.all(Radius.circular(50)),color: Colors.red),child: Text(
                '2',style: TextStyle(color: Colors.white),SizedBox(
              width: 15,],Divider(),//类似上面的布局写6个
    ],);
}
_buildItem(IconData iconData,Color iconColor,String title,Widget widget) {
  return Container(
    height: 45,child: Row(
      children: <Widget>[
        SizedBox(
          width: 30,Icon(
          iconData,color: iconColor,SizedBox(
          width: 30,Expanded(
          child: Text('$title'),widget,SizedBox(
          width: 15,);
}

@override
Widget build(BuildContext context) {
  return Column(
    children: <Widget>[
      _buildItem(...),_buildItem(...),);
}
class SettingDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        _SettingItem(
          iconData: Icons.notifications,iconColor: Colors.blue,title: '消息中心',suffix: _NotificationsText(
            text: '2',_SettingItem(
          iconData: Icons.thumb_up,iconColor: Colors.green,title: '我赞过的',suffix: _Suffix(
            text: '121篇',_SettingItem(
          iconData: Icons.grade,iconColor: Colors.yellow,title: '收藏集',suffix: _Suffix(
            text: '2个',_SettingItem(
          iconData: Icons.shopping_basket,title: '已购小册',suffix: _Suffix(
            text: '100个',_SettingItem(
          iconData: Icons.account_balance_wallet,title: '我的钱包',suffix: _Suffix(
            text: '10万',_SettingItem(
          iconData: Icons.location_on,iconColor: Colors.grey,title: '阅读过的文章',suffix: _Suffix(
            text: '1034篇',_SettingItem(
          iconData: Icons.local_offer,title: '标签管理',suffix: _Suffix(
            text: '27个',);
  }
}

class _SettingItem extends StatelessWidget {
  const _SettingItem(
      {Key key,this.iconData,this.iconColor,this.title,this.suffix})
      : super(key: key);

  final IconData iconData;
  final Color iconColor;
  final String title;
  final Widget suffix;

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 45,child: Row(
        children: <Widget>[
          SizedBox(
            width: 30,Icon(iconData,SizedBox(
            width: 30,Expanded(
            child: Text('$title'),suffix,SizedBox(
            width: 15,);
  }
}

class _NotificationsText extends StatelessWidget {
  final String text;

  const _NotificationsText({Key key,this.text}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 10),decoration: BoxDecoration(
          shape: BoxShape.rectangle,child: Text(
        '$text',);
  }
}

class _Suffix extends StatelessWidget {
  final String text;

  const _Suffix({Key key,this.text}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Text(
      '$text',style: TextStyle(color: Colors.grey.withOpacity(.5)),);
  }
}
原创声明
本站部分文章基于互联网的整理,我们会把真正“有用/优质”的文章整理提供给各位开发者。本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
本文链接:http://www.jiecseo.com/news/show_68355.html