How to show country code in the container - flutter

Question

I'm working on phone number textfield, so for i got this package, and i want its CustomDecoration style, but i'm not getting it. here is my code.
Widget phonetextformfieldCustomwithouticon(context, width, controller, height) {
return Container(
width: width,
child: InternationalPhoneNumberInput(
inputDecoration: InputDecoration(
contentPadding:EdgeInsets.symmetric(vertical: 20.0, horizontal: 10.0),
},
),
);
}
updated:
I want country should have some padding, becuase it starts from the leftmost, and when i add validation in it, redner flow
Container(
width: MediaQuery.of(context).size.width * 0.9,
height: 55.0,
decoration: BoxDecoration(
border: Border.all(color: HexColor("#6e6b7b")),
color: Colors.white,
borderRadius: BorderRadius.all(
Radius.circular(10),
),
),
child: InternationalPhoneNumberInput(
inputDecoration: InputDecoration(
contentPadding:EdgeInsets.symmetric(vertical: 20.0, horizontal: 10.0),
labelText: "Phone number",
labelStyle: GoogleFonts.montserrat(color: HexColor("#6e6b7b")),
hintStyle: GoogleFonts.montserrat(),
hintText: "Enter a phone number",
border: InputBorder.none,
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(
width: 0.0,
))),
// enabledBorder: InputBorder.none,
onInputChanged: (PhoneNumber number) {
print(number.phoneNumber);
},
onInputValidated: (bool value) {
print(value);
},
selectorConfig: SelectorConfig(
selectorType: PhoneInputSelectorType.DIALOG,
),
ignoreBlank: false,
autoValidateMode: AutovalidateMode.disabled,
selectorTextStyle: TextStyle(color: Colors.black),
// initialValue: number,
textFieldController: contactNo,
formatInput: false,
keyboardType: TextInputType.numberWithOptions(
signed: true, decimal: true),
inputBorder: InputBorder.none,
onSaved: (PhoneNumber number) {
print('On Saved: $number');
},
),
),
here is the output:

Answer 1

Try below code hope its helpful to you.refer package here and example here
create variables:
final GlobalKey<FormState> formKey = GlobalKey<FormState>();
final TextEditingController controller = TextEditingController();
String initialCountry = 'NG';
PhoneNumber number = PhoneNumber(isoCode: 'NG');
Create one function for getting number and dispose your controller
void getPhoneNumber(String phoneNumber) async {
PhoneNumber number =
await PhoneNumber.getRegionInfoFromPhoneNumber(phoneNumber, 'US');
setState(() {
this.number = number;
});
}
#override
void dispose() {
controller?.dispose();
super.dispose();
}
Your widget:
Container(
padding: EdgeInsets.all(7),
color: Colors.blue,
child: Card(
child: Form(
key: formKey,
child: Container(
padding: EdgeInsets.all(8.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
InternationalPhoneNumberInput(
onInputChanged: (PhoneNumber number) {
print(number.phoneNumber);
},
onInputValidated: (bool value) {
print(value);
},
selectorConfig: SelectorConfig(
selectorType: PhoneInputSelectorType.BOTTOM_SHEET,
),
ignoreBlank: false,
autoValidateMode: AutovalidateMode.disabled,
selectorTextStyle: TextStyle(color: Colors.black),
initialValue: number,
textFieldController: controller,
formatInput: false,
keyboardType: TextInputType.numberWithOptions(
signed: true, decimal: true),
inputBorder: InputBorder.none,
onSaved: (PhoneNumber number) {
print('On Saved: $number');
},
),
],
),
),
),
),
),
Your result screen on your need->

Answer 2

I've just written this:
InternationalPhoneNumberInput(
onInputChanged: (val) {},
inputDecoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(
width: 0.0,
),
),
enabledBorder: InputBorder.none,
),
),
and it seems like these:
But I couldn't test it on android. Can you try this?