1

我无法在定位的小部件内添加文本字段。有人可以帮我写代码吗

import 'package:flutter/material.dart;
import 'dart:math' as math;import 'dart:math' as math;import 'dart:math' as math;
import 'package:flutter_svg/flutter_svg.dart';

class Android1Widget extends StatelessWidget {
          @override
          Widget build(BuildContext context) {
          // Figma Flutter Generator Android1Widget - FRAME
            return 
              const TextField(

              );
              Container(
      width: 360,
      height: 640,
      decoration: BoxDecoration(
        color : Color.fromRGBO(255, 255, 255, 1),
  ),
      child: Stack(
        children: <Widget>[ 
          Positioned(
        top: 0,
        left: 0,
        child: Container(
        width: 360,
        height: 420,
        decoration: BoxDecoration(
          borderRadius : BorderRadius.only(
            topLeft: Radius.circular(0),
            topRight: Radius.circular(0),
            bottomLeft: Radius.circular(50),
            bottomRight: Radius.circular(50),
          ),
      color : Color.fromRGBO(252, 165, 165, 1),
        )
        )
        const TextField(

        ),
          ),
      Positioned(
        top: 301,
        left: 22,
        child: Container(
        width: 317,
        height: 400,
        decoration: BoxDecoration(
          borderRadius : BorderRadius.only(
            topLeft: Radius.circular(20),
            topRight: Radius.circular(20),
            bottomLeft: Radius.circular(20),
            bottomRight: Radius.circular(20),
          ),
      boxShadow : [BoxShadow(
          color: Color.fromRGBO(0, 0, 0, 0.25),
          offset: Offset(10,10),
          blurRadius: 4
      )],
      color : Color.fromRGBO(255, 255, 255, 1),
  )   
      )
      ),Positioned(
        top: 427,
        left: 57,
        child:
        Text('Your phone number', textAlign: TextAlign.left, style: TextStyle(
        decoration: TextDecoration.none,
        color: Color.fromRGBO(141, 145, 145, 1),
        fontFamily: 'Roboto',
        fontSize: 16,
        letterSpacing: 0 /*percentages not used in flutter. defaulting to zero*/,
        fontWeight: FontWeight.normal,
        height: 1
      ),)
      ),
      Positioned(
        top: 329,
        left: 60,
        child: Text('Personal Information', textAlign: TextAlign.left, style: TextStyle(
        decoration: TextDecoration.none,  
        shadows: [
        Shadow(
        offset: Offset(6.0, 6.0),
        blurRadius: 4.0,
        color: Color.fromRGBO(0, 0, 0, 0.25),
        ),
        ],
        color: Color.fromRGBO(0, 0, 0, 1),
        fontFamily: 'Roboto',
        fontSize: 25,
        letterSpacing: 0 /*percentages not used in flutter. defaulting to zero*/,
        fontWeight: FontWeight.normal,
        height: 1
      ),)
      ),Positioned(
        top: 348,
        left: 57,
        child: Transform.rotate(
        angle: -0.2012986355707143 * (math.pi / 180),
        child: Divider(
        color: Color.fromRGBO(0, 0, 0, 1),
        thickness: 1
      ),
      )
      ),Positioned(
        top: 569,
        left: 48,
        child: Text('OTP will be sent to your phone number', textAlign: TextAlign.left, style: TextStyle(
        decoration: TextDecoration.none,  
        color: Color.fromRGBO(0, 0, 0, 1),
        fontFamily: 'Roboto',
        fontSize: 16,
        letterSpacing: 0 /*percentages not used in flutter. defaulting to zero*/,
        fontWeight: FontWeight.normal,
        //height: 1
      ),)
      ),Positioned(
        top: 510,
        left: 152,
        child: Container(
      width: 58,
      height: 57,
      decoration: BoxDecoration(
          color : Color.fromRGBO(255, 255, 255, 1),
  ),
      child: Stack(
        children: <Widget>[
          Positioned(
        top: 0,
        left: 0,
        child: Container(
      width: 58,
      height: 57,
      decoration: BoxDecoration(
          color : Color.fromRGBO(255, 255, 255, 1),
  ),
      child: Stack(
        children: <Widget>[
          /*Positioned(
        top: 00,
        left: 0,
        child: Container(
        width: 58,
        height: 57,
        decoration: BoxDecoration(
          color : Color.fromRGBO(253, 171, 159, 1),
      borderRadius : BorderRadius.all(Radius.elliptical(58, 57)),
  )
      )
      ),*/
        ]
      )
    )
      ),
        ]
      )
    )
      ),Positioned(
        top: 379,
        left: 57,
        child: Container(
        width: 40,
        height: 26.666664123535156,
        decoration: BoxDecoration(
          image : DecorationImage(
          image: AssetImage('assets/images/1200pxflag_of_india1.png'),
          fit: BoxFit.fitWidth
      ),
  )
      )
      ),Positioned(
        top: 391,
        left: 114,
        child: Text('INDIA(+91)', textAlign: TextAlign.left, style: TextStyle(
        decoration: TextDecoration.none,  
        color: Color.fromRGBO(0, 0, 0, 1),
        fontFamily: 'Roboto',
        fontSize: 17,
        letterSpacing: 0 /*percentages not used in flutter. defaulting to zero*/,
        fontWeight: FontWeight.normal,
        height: 1
      ),)
      ),Positioned(
        top: 10,
        left: -10,
        child: Container(
        width: 375,
        height: 291,
        decoration: BoxDecoration(
          image : DecorationImage(
          image: AssetImage('assets/images/Imageedit_9_40029377491.png'),
          fit: BoxFit.fitWidth
      ),
  )
      )
      ),
      Positioned(
        top: 612,
        left: 152,
        child: Container(
        width: 62,
        height: 62,
        decoration: BoxDecoration(
          image : DecorationImage(
          image: AssetImage('assets/images/Ellipse 6 (1).png'),
          fit: BoxFit.fitWidth
      ),
      //borderRadius : BorderRadius.all(Radius.elliptical(84, 68)),
  )
        )
      ),
        ]
      )
    );
          }
        }

这是一个注册页面，询问用户的电话号码并发送 OTP，但我无法在此代码中添加文本字段。因为我在 figma 中设计了我的 UI 并使用 figmaToflutter 插件进行了转换。我尝试手动添加 textField 但它显示错误

4

2 回答 2

0

您可以将 TextField 设置为堆栈树中的小部件，也可以将其设置为位置小部件中的子项，该位置小部件由包含宽度的 Sizedbox 包围

于 2021-08-13T17:16:05.410 回答
0

TextField 需要添加为您想要的任何 Positioned 小部件的子级。但是，如果您不了解 Flutter 的基础知识，您将很难进一步发展。也许您可以参加 Udemy 的初学者课程？分号前的材料包也缺少单引号，它应该是：

import 'package:flutter/material.dart';
于 2021-08-12T18:17:49.787 回答