InputNumber 数字输入框

数字输入框组件，支持通过加减按钮或键盘输入来调整数值。

何时使用

当需要获取用户输入的数字，并对输入值有一定控制要求时（如限制最大最小值、指定步长等），应该使用数字输入框。

代码演示

import 'package:antd_flutter_example/demo_block.dart';
import 'package:flutter/widgets.dart';
import 'package:trionesdev_antd_mobile/trionesdev_antd_mobile.dart';

class InputNumberPage extends StatefulWidget{
  const InputNumberPage({super.key});

  @override
  State<StatefulWidget> createState() =>_InputNumberPageState();
}
class _InputNumberPageState extends State<InputNumberPage>{
  @override
  Widget build(BuildContext context) {
    return AntScaffold(
      appBar: AntAppBar(title: Text("InputNumber 数字输入框"),),
      body: SingleChildScrollView(
        child: Column(
          children: [
            DemoBlock(title: "基本使用",child: AntInputNumber(),),
            DemoBlock(title: "步长设置",child: AntInputNumber(step: 5,),),
            DemoBlock(title: "限制输入范围",child: AntInputNumber(min: 0,max: 20,),),
            DemoBlock(title: "默认值",child: AntInputNumber(min: 0,max: 20,defaultValue: 10,),),
          ],
        ),
      ),
    );
  }

}

API

数字输入框的属性说明如下：

属性	说明	类型	默认值
size	组件大小	AntSize	middle
step	步长	num	1
min	最小值	double?	null
max	最大值	double?	null
keyboard	是否使用键盘	bool	true
defaultValue	默认值	num?	null
value	当前值	num?	null
disabled	是否禁用	bool	false
onChange	值改变回调	Function(num val)?	null

AntSize 枚举值

值	说明	尺寸
small	小尺寸	高24px
middle	中尺寸	高32px
large	大尺寸	高48px