enter image description here

因此,上图在网格视图中显示了12个文本.但我想要文本格式字段而不是文本(a,b,c,d,.),如果用户点击下一步,所有的12个文本应该在单个字符串中.我该怎么做呢?

推荐答案

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:world_virtual_coin/services/app_utils.dart';
import 'package:world_virtual_coin/utils/en_extensions.dart';
import 'package:world_virtual_coin/widget/back_button.dart';
import 'package:world_virtual_coin/widget/colors.dart';
import 'package:world_virtual_coin/widget/custom_container.dart';
import '../../services/theme.dart';
import '../../widget/custom_button.dart';

class TwelvePhrase extends StatefulWidget {
  const TwelvePhrase({Key? key}) : super(key: key);

  @override
  State<TwelvePhrase> createState() => _TwelvePhraseState();
}

class _TwelvePhraseState extends State<TwelvePhrase> {
  List<TwelvePhraseModel> phraseList = [
    TwelvePhraseModel(""),
    TwelvePhraseModel(""),
    TwelvePhraseModel(""),
    TwelvePhraseModel(""),
    TwelvePhraseModel(""),
    TwelvePhraseModel(""),
    TwelvePhraseModel(""),
    TwelvePhraseModel(""),
    TwelvePhraseModel(""),
    TwelvePhraseModel(""),
    TwelvePhraseModel(""),
    TwelvePhraseModel(""),
  ];

  @override
  Widget build(BuildContext context) {
    return SafeArea(
        child: Scaffold(
      backgroundColor: Colors.white,
      body: CustomContainer(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const CustomBackButton(title: 'Twelve phrase'),
            35.heightBox,
            GridView.builder(
              primary: false,
              shrinkWrap: true,
              // padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 12.h),
              padding: EdgeInsets.symmetric(horizontal: 0, vertical: 12.h),
              gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: 3,
                  mainAxisSpacing: 8,
                  childAspectRatio: 6 / 2,
                  crossAxisSpacing: 8),
              itemCount: phraseList.length,
              itemBuilder: (context, i) {
                return Row(
                  // mainAxisSize: MainAxisSize.max,
                  children: [
                    Text(
                      "${i + 1}",
                      style: TextStyle(
                          fontSize: 11.sp,
                          fontFamily: fontRegular,
                          color: Colors.black),
                    ),
                    8.widthBox,
                    Expanded(
                      child: Center(
                        child: TextField(
                          inputFormatters: [
                            FilteringTextInputFormatter.deny(RegExp(r'\s')),
                          ],
                          style: const TextStyle(
                              fontSize: 15.0, color: Colors.black),
                          decoration: InputDecoration(
                            contentPadding: const EdgeInsets.symmetric(
                                horizontal: 7, vertical: 7),
                            enabledBorder: OutlineInputBorder(
                              borderSide: const BorderSide(
                                  width: 3, color: colorPrimary),
                              //<-- SEE HERE
                              borderRadius: BorderRadius.circular(30.0),
                            ),
                          ),
                          onChanged: (value) {
                            setState(() {
                              phraseList[i].strKey = value.toString();
                              phraseList[i].checker = i + 1;
                            });
                          },
                        ),
                      ),
                    ),
                  ],
                );
              },
            ),
            20.heightBox,
            CustomButton(
              onPressed: () {
                String result = "";
                // Get.offNamed('/otpVerification');
                for (int i = 0; i < phraseList.length; i++) {
                  TwelvePhraseModel model = phraseList[i];
                  result = result + model.strKey.toString();
                }
                if (result.isNotEmpty) {
                  AppUtils.showSuccessSnackBar(result);
                } else {
                  AppUtils.showErrorSnackBar("Please Fill all fields");
                }

              },
              label: 'Next',
            ),
          ],
        ),
      ),
    ));
  }
}

class TwelvePhraseModel {
  String strKey;
  int checker = 1;

  TwelvePhraseModel(this.strKey);
}

Flutter相关问答推荐

具有可变高度小部件的SingleChildScrollView内的列

如何增加容器高度?

手势捕获的异常:类型';Double';不是类型转换中类型';Double';的子类型

Android Emulator冻结,但在调整窗口大小时解冻

使用自定义控制器将项插入到ListView中时行为不正确

如何将Will POP示波器转换为POP数据抖动的POP示波器

修复后期变量的抖动皮棉

如何在抖动中预加载一条路由,或者即使在屏幕外也保持加载小工具?

UI中的Flutter 下拉列表值未更改

没有为类型 'Widget' 定义运算符 '[]' .try 定义运算符[]

Flutter开发中,如何通过'nfc_manager'插件在Android设备上避免默认的New Tag Scanned弹出窗口?

获取通过列表呈现的相同 TextEditingController 的值

如何删除图像边框半径与其父容器边框半径之间的空白

Flutter/Dart - 从外部类更新状态

扩展磁贴尾随图标在与一个磁贴交互时更新列表中的所有内容.如何只更改展开图块的图标?

Getx Flutter 在更新值时抛出空错误

使用 onPressed 切换到另一个屏幕无法正常工作

主题:ThemeData() Flutter

如何在dart中编写多个条件?

在 Flutter Bloc 中具有称为 status 的属性的一种状态或不同的状态,哪个更可取?