Flutter Widget : NumberStepper (数字步进组件)

Flutter 2019-12-10 11:40:49 15941 0

数字步进组件(通常叫Stepper) 在商城类应用中必不可少的, 但是翻遍了Flutter文档, 貌似没有这个组件, 唯一同名的, 是步骤组件(Progress) .两者名称上确实有概念混淆的可能.

怎么办呢, 去pub上搜了一通, 找到两个功能类似的 stepper_touch 和 ayn_stepper . stepper_touch风格比较特殊,没继续看了.

ayn_stepper功能比较符合预期,但是有几点 

  1. 不支持手动输入

  2. 尺寸是写死在代码里的 (宽50高100)

  3. 布局是竖向的(这个有点奇葩)

于是把代码克隆下来, 做了些改进, 手动输入这个暂时不加.

其它的,增加了布局方向的参数, 并且修改为默认横向布局, 增加了尺寸参数以及尺寸算法. 另外就是原组件参数里有几个颜色, 并没有体现在组件上. 可能作者没有进一步完善.

修改完后预览效果如下

preview.png

github地址: NumberStepper

由于网络问题, pub包尚未发布成功

如需引用可以采用以下写法

number_stepper:
  git:
    url: https://github.com/shirne/NumberStepper.git
    ref: master