wrapAlignment not working
hi-glenn opened this issue · comments
hi-glenn commented
And , It is always center
Liew Jun Tung commented
Maybe you can show how you implemented it?
hi-glenn commented
-
wrapAlignment: WrapAlignment.spaceBetween not work.
-
PinCodeTextField has two unnecessary inner padding on left and right. It leading to wrong alignment with other widgets in the Column.
import 'package:flutter/material.dart';
import 'package:pin_code_text_field/pin_code_text_field.dart';
class MyPinCodeTextField extends StatefulWidget {
@override
_MyPinCodeTextFieldState createState() => _MyPinCodeTextFieldState();
}
class _MyPinCodeTextFieldState extends State<MyPinCodeTextField> {
TextEditingController controller = TextEditingController();
String thisText = "";
int pinLength = 6;
bool hasError = false;
String errorMessage;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: Container(
decoration: BoxDecoration(
border: Border.all(),
color: Colors.blueGrey,
),
padding: EdgeInsets.symmetric(
horizontal: 20,
),
child: Container(
decoration: BoxDecoration(
color: Colors.grey,
border: Border.all(),
),
child: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
// crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Padding(
padding: const EdgeInsets.only(bottom: 60.0),
child: Text(thisText, style: Theme.of(context).textTheme.title),
),
PinCodeTextField(
autofocus: false,
controller: controller,
highlight: true,
highlightColor: Colors.blue,
defaultBorderColor: Colors.black,
hasTextBorderColor: Colors.green,
maxLength: pinLength,
hasError: hasError,
onTextChanged: (text) {
setState(() {
hasError = false;
});
},
onDone: (text) {
print("DONE $text");
},
pinBoxWidth: 40,
wrapAlignment: WrapAlignment.spaceBetween,
pinCodeTextFieldLayoutType: PinCodeTextFieldLayoutType.AUTO_ADJUST_WIDTH,
pinBoxDecoration: ProvidedPinBoxDecoration.underlinedPinBoxDecoration,
pinTextStyle: TextStyle(fontSize: 30.0),
pinTextAnimatedSwitcherTransition: ProvidedPinBoxTextAnimation.scalingTransition,
pinTextAnimatedSwitcherDuration: Duration(milliseconds: 300),
),
Visibility(
child: Text(
"Wrong PIN!",
style: TextStyle(color: Colors.red),
),
visible: hasError,
),
Container(
color: Colors.red,
width: double.infinity,
height: 20,
),
Container(
padding: const EdgeInsets.only(top: 32.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Expanded(
child: MaterialButton(
color: Colors.blue,
textColor: Colors.white,
child: Text("SUBMIT"),
onPressed: () {
setState(() {
this.thisText = controller.text;
});
},
),
),
Expanded(
child: MaterialButton(
color: Colors.red,
textColor: Colors.white,
child: Text("SUBMIT Error"),
onPressed: () {
setState(() {
this.hasError = true;
});
},
),
),
],
),
)
],
),
),
),
),
);
}
}
Patrick waweru commented
WIth the latest version i still have the same issue