美文网首页
Container 封装

Container 封装

作者: Victory_886 | 来源:发表于2021-04-25 11:08 被阅读0次

Flutter 开发中Container组件用到太多了,我也是结合自己的项目简单封装了一些够我使用的。不用再用InkWell等组件来添加事件方法了,目前这个只是非常简单的封装等后期我再升级一下。

大家先看看吧

代码如下:

/// Container 封装
class WLContainer extends StatelessWidget {
  final Color color;
  final Widget child;
  final double width;
  final double height;
  final Function onClick;
  final Clip clipBehavior;
  final Decoration decoration;
  final EdgeInsetsGeometry margin;
  final EdgeInsetsGeometry padding;
  final BoxConstraints constraints;
  final AlignmentGeometry alignment;
  final Decoration foregroundDecoration;

  const WLContainer({
    Key key,
    this.child,
    this.color,
    this.width,
    this.height,
    this.margin,
    this.onClick,
    this.padding,
    this.alignment,
    this.decoration,
    this.constraints,
    this.foregroundDecoration,
    this.clipBehavior = Clip.none,
  }) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return InkWell(
      child: Container(
        child: child,
        width: width,
        color: color,
        height: height,
        margin: margin,
        padding: padding,
        alignment: alignment,
        decoration: decoration,
        constraints: constraints,
        clipBehavior: clipBehavior,
        foregroundDecoration: foregroundDecoration,
      ),
      onTap: onClick,
    );
  }
}

使用如下:

    WLContainer(
      height: 30,
      width: 120,
      padding: insetLR(20, 10),
      alignment: Alignment.centerRight,
      onClick: () {
          /// 点击事件处理
      },
      decoration: circleDecoration(20, 1, Colors.amberAccent),
      child: Row(
        children: <Widget>[
          Text(_sourceTitle(context) ?? ""),
          Icon(Icons.keyboard_arrow_down, color: Colors.red),
          SizedBox(width: 5),
        ],
      ),
    );

也可以看我的其它文章也使用到了:传送门

相关文章

  • Container 封装

    在Flutter 开发中Container组件用到太多了,我也是结合自己的项目简单封装了一些够我使用的。不用再用I...

  • docker初探

    docker最早是LXC(Linux Container)的二次封装发行,后来使用的是Libcontainer技术...

  • C++ 容器的简单使用

    vector 的使用 向量(Vector)是一个封装了动态大小数组的顺序容器(Sequence Container...

  • Element布局的小坑,el-container布局不正常

    问题说明 在使用Element-UI的Container布局容器时,我将el-header和el-aside封装成...

  • flannel host-gw模式工作原理浅析

    一、前言 flannel作为一个container互联解决方案,不仅提供基于封装类型的互联技术,也提供基于路由技术...

  • 容器概念的理解

    容器(Container)作为动态资源分配单位,每个容器中都封装了一定数量的CPU、内存、磁盘等资源,从而限定每个...

  • 视频与FFMPEG那些事

    1. 基本概念 1.1 容器(Container) 容器也就是封装格式,例如MP4。容器中主要包含以下内容: 视频...

  • Docker Overview

    Container OCI (Open Container Initiative) CRI (Container ...

  • Notekepper开发文档

    添加一项笔记 表单容器(form container):所有的用户输入微件并封装包含在一个表单内。 将会作为笔记的...

  • Docker 基本的 container 操作

    Container Create/Start/Stop Container Enter Container Att...

网友评论

      本文标题:Container 封装

      本文链接:https://www.haomeiwen.com/subject/vngsrltx.html