Я не могу добавить текстовое поле внутри позиционированного виджета во флаттере
Я не могу добавить текстовое поле внутри позиционированного виджета. Может ли кто-нибудь помочь мне с кодом
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 и преобразовал его с помощью плагинов figmaToflutter. Я попытался вручную добавить textField, но он показывает ошибку
2 ответа
Вы можете установить TextField как виджет в дереве стека или как дочерний элемент в виджете позиции, окруженном Sizedbox, который содержит ширину
TextField необходимо добавить как дочерний элемент любого позиционированного виджета, которым вы хотите его видеть. Но у вас будут проблемы с дальнейшим продвижением, если вы не знаете основ Flutter. Может быть, вы могли бы пройти курс для начинающих по Удеми? Также перед точкой с запятой отсутствует одинарная кавычка для пакета материалов, она должна быть:
import 'package:flutter/material.dart';