如何将文本设置为一行

时间:2018-11-28 11:06:25

标签: dart flutter

我在第4行文本字段中输入了下一个关于flutter / dart的代码:

Container(
            margin: EdgeInsets.all(8.0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.start,
              children: <Widget>[
                Container(
                    width: 100.0,
                    child: TextField(
                      maxLength: 2,
                      onChanged: (value) {
                        card.expMonth = int.parse(value);
                      },
                      keyboardType: TextInputType.number,
                      textAlign: TextAlign.center,
                      decoration: InputDecoration(
                          border: InputBorder.none, hintText: 'month'),
                    )),
                Text("/",
                    style: TextStyle(fontSize: 36),
                    textAlign: TextAlign.center),
                Container(
                    width: 100.0,
                    child: TextField(
                      maxLength: 2,
                      onChanged: (value) {
                        card.expYear = int.parse(value);
                      },
                      keyboardType: TextInputType.number,
                      textAlign: TextAlign.center,
                      decoration: InputDecoration(
                          border: InputBorder.none, hintText: 'year'),
                    )),
                Container(
                    padding: EdgeInsets.only(left: 80.0),
                    width: 180.0,
                    child: TextField(
                      maxLength: 3,
                      onChanged: (value) {
                        card.cvc = int.parse(value);
                      },
                      keyboardType: TextInputType.number,
                      textAlign: TextAlign.center,
                      decoration: InputDecoration(
                          border: InputBorder.none, hintText: 'cvc'),
                    )),
              ],
            ),
          )

他看到了这个:enter image description here

如何将所有文本字段都放在一行中。在android应用中,我简单地使用指南或其他简单路径。在这里,我扑朔迷离的现实,乍一看,不同的文本字段具有相同的可见性,而乍一看,参数

UPD 。:我制定了拐杖解决方案:

Padding(
                  padding: EdgeInsets.only(bottom: 20),
                  child: Text("/",
                      style: TextStyle(fontSize: 36),
                      textAlign: TextAlign.center),
                ),

但是我的想法很愚蠢

1 个答案:

答案 0 :(得分:0)

这就是我要做的:

Row(children: <Widget>[
            Expanded(
                child: TextField(
                  inputFormatters: [LengthLimitingTextInputFormatter(2)],
                  keyboardType: TextInputType.number,
                  textAlign: TextAlign.center,
                  decoration: InputDecoration(
                      border: InputBorder.none, hintText: 'month'),
                )),
            Expanded(
                child: Text("/",
                    style: TextStyle(fontSize: 36),
                    textAlign: TextAlign.center)),
            Expanded(
                child: TextField(
                  inputFormatters: [LengthLimitingTextInputFormatter(2)],
                  keyboardType: TextInputType.number,
                  textAlign: TextAlign.center,
                  decoration: InputDecoration(
                      border: InputBorder.none, hintText: 'year'),
                )),
            Expanded(
                child: TextField(
                  inputFormatters: [LengthLimitingTextInputFormatter(3)],
                  keyboardType: TextInputType.number,
                  textAlign: TextAlign.center,
                  decoration: InputDecoration(
                      border: InputBorder.none, hintText: 'cvc'),
                )),
        ])

哪个产生这个:

enter image description here

我使用了inputFormatters: [LengthLimitingTextInputFormatter(2)]而不是maxLength,因此用户仍然只能输入有限的长度,但是由于TextField看起来比较整洁,所以您无法在public class UsageModel { [BsonIgnore] public static readonly string CollectionName = "ApiUsage"; [BsonRequired] public string User { get; set; } [BsonRequired, BsonDictionaryOptions(DictionaryRepresentation.ArrayOfArrays)] public Dictionary<DateTime, int> History { get; private set; } public static IMongoCollection<UsageModel> Collection { get => MongoDb.Database.GetCollection<UsageModel>(CollectionName); } public static void IncrementTodayStats(string user) { var filter = Builders<UsageModel>.Filter.Eq(doc => doc.User, user); var update = Builders<UsageModel>.Update. SetOnInsert(doc => doc.History[DateTime.Now.Date], 0). Inc(doc => doc.History[DateTime.Now.Date], 1); var res = Collection.UpdateOne(filter, update); } } 下找到计数器。