add update phone number and recovery email
This commit is contained in:
tzw
188
lib/pages/widgets/input_phone.dart
Normal file
188
lib/pages/widgets/input_phone.dart
Normal file
@@ -0,0 +1,188 @@
|
||||
import 'package:fcs/helpers/theme.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:country_picker/country_picker.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../../localization/app_translations.dart';
|
||||
import '../main/model/language_model.dart';
|
||||
|
||||
typedef OnValueChange = Function(Country country);
|
||||
|
||||
class InputPhone extends StatefulWidget {
|
||||
final String? lableKey;
|
||||
final String? validationLabel;
|
||||
final OnValueChange onValueChange;
|
||||
final Country selectedCountry;
|
||||
final TextEditingController phoneCtl;
|
||||
final Function(String)? onInputChanged;
|
||||
final bool autofocus;
|
||||
|
||||
const InputPhone(
|
||||
{super.key,
|
||||
this.lableKey,
|
||||
required this.onValueChange,
|
||||
required this.selectedCountry,
|
||||
this.onInputChanged,
|
||||
required this.phoneCtl,
|
||||
this.validationLabel,
|
||||
this.autofocus = false});
|
||||
|
||||
@override
|
||||
State<InputPhone> createState() => _InputPhoneState();
|
||||
}
|
||||
|
||||
class _InputPhoneState extends State<InputPhone> {
|
||||
List<String>? signinCountries = [];
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
init();
|
||||
super.initState();
|
||||
}
|
||||
|
||||
init() {
|
||||
List<String>? countries = ['mm', 'us'];
|
||||
|
||||
for (var c in countries) {
|
||||
setState(() {
|
||||
signinCountries?.add(c.toUpperCase());
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
bool isMyanmar = widget.selectedCountry.phoneCode == "95";
|
||||
var languageModel = Provider.of<LanguageModel>(context);
|
||||
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(top: 10),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
GestureDetector(
|
||||
onTap: () {
|
||||
showCountryPicker(
|
||||
context: context,
|
||||
countryFilter: signinCountries,
|
||||
showPhoneCode: true,
|
||||
showSearch: true,
|
||||
countryListTheme: const CountryListThemeData(
|
||||
flagSize: 25,
|
||||
backgroundColor: Colors.white,
|
||||
textStyle: TextStyle(fontSize: 15, color: Colors.black),
|
||||
bottomSheetHeight: 500,
|
||||
borderRadius: BorderRadius.only(
|
||||
topLeft: Radius.circular(20.0),
|
||||
topRight: Radius.circular(20.0),
|
||||
),
|
||||
inputDecoration: InputDecoration(
|
||||
labelText: 'Search',
|
||||
labelStyle: TextStyle(color: Colors.black),
|
||||
floatingLabelStyle: TextStyle(color: Colors.black),
|
||||
hintText: 'Search',
|
||||
hintStyle: TextStyle(color: Colors.black),
|
||||
hintMaxLines: 1,
|
||||
prefixIcon: Icon(Icons.search, color: Colors.black),
|
||||
border: OutlineInputBorder(),
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderSide:
|
||||
BorderSide(width: 1, color: Colors.black)),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderRadius:
|
||||
BorderRadius.all(Radius.circular(5.0)),
|
||||
borderSide: BorderSide(color: Colors.black)),
|
||||
),
|
||||
searchTextStyle: TextStyle(color: Colors.black)),
|
||||
onSelect: (Country country) {
|
||||
widget.onValueChange(country);
|
||||
},
|
||||
);
|
||||
},
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: [
|
||||
Container(
|
||||
width: 95,
|
||||
padding: const EdgeInsets.only(
|
||||
left: 5, bottom: 12, right: 5, top: 12),
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(color: Colors.grey.shade400),
|
||||
borderRadius: BorderRadius.circular(5),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.fromLTRB(0, 0, 5, 0),
|
||||
child: Text(widget.selectedCountry.flagEmoji)),
|
||||
Text(
|
||||
isMyanmar
|
||||
? "+95"
|
||||
: "+${widget.selectedCountry.phoneCode}",
|
||||
style: const TextStyle(
|
||||
fontSize: 16, color: Colors.black),
|
||||
),
|
||||
const Icon(Icons.arrow_drop_down),
|
||||
],
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 5),
|
||||
Flexible(
|
||||
child: Container(
|
||||
padding: const EdgeInsets.only(left: 10),
|
||||
child: TextFormField(
|
||||
autofocus: widget.autofocus,
|
||||
keyboardType: TextInputType.phone,
|
||||
onChanged: widget.onInputChanged,
|
||||
controller: widget.phoneCtl,
|
||||
maxLines: 1,
|
||||
cursorColor: primaryColor,
|
||||
style: const TextStyle(fontSize: 16, color: Colors.black),
|
||||
decoration: InputDecoration(
|
||||
labelStyle: languageModel.isEng
|
||||
? newLabelStyle(color: Colors.black54, fontSize: 20)
|
||||
: newLabelStyleMM(
|
||||
color: Colors.black54, fontSize: 20),
|
||||
labelText: widget.lableKey != null
|
||||
? AppTranslations.of(context)!
|
||||
.text(widget.lableKey!)
|
||||
: null,
|
||||
hintStyle: const TextStyle(color: Color(0xFFBBBBBB)),
|
||||
errorStyle: const TextStyle(color: dangerColor),
|
||||
prefix: Padding(
|
||||
padding: EdgeInsets.only(left: isMyanmar ? 0 : 13),
|
||||
child: Text(isMyanmar ? "9 " : "",
|
||||
style: const TextStyle(color: Colors.black))),
|
||||
enabledBorder: const UnderlineInputBorder(
|
||||
borderSide:
|
||||
BorderSide(color: primaryColor, width: 1.0)),
|
||||
focusedBorder: const UnderlineInputBorder(
|
||||
borderSide:
|
||||
BorderSide(color: primaryColor, width: 1.0)),
|
||||
errorBorder: null,
|
||||
focusedErrorBorder: null),
|
||||
validator: (value) {
|
||||
if (value!.isEmpty) {
|
||||
if (widget.validationLabel == null) return null;
|
||||
return AppTranslations.of(context)!
|
||||
.text(widget.validationLabel!);
|
||||
}
|
||||
return null;
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user