Customization
Country Filter
If you want your country only in country choosing dialog which we saw in login, registration and forget password page, you have to set your default country first from admin panel Business Setup section. Then open
<project>/lib/features/auth/screens/create_account_screen.dart
file and search CountryCodePickerWidget. Now add a parameter with value like this:/lib/features/auth/screens/create_account_screen.dartcountryFilter: [_countryDialCode]
tip
Recommended tutorial is below 👇
If you want to disable country choosing dialog the just remove
showDropDownButton: true,
parameter and add one parameter like this:/lib/features/auth/screens/create_account_screen.dartenabled: false
Change onboarding text and graphics
I) Text: If you want to change onboarding text, open <project>/assets/language/en.json
and you will found some texts with key named “select_your_items_to_buy”. You just need to change the values. Do not change key. Also do same things for <project>/assets/language/ar.json
file also.
"select_your_items_to_buy": “YOUR_PREFERRED_TEXT”,
ii) Graphics: If you want to change graphics of on boarding page then go to <project>/assets/image/
and replace onboard_1.png
with your preferred image. Must use same name and extension for your graphics.
Add New Local Language
Go to
/assets/language
and press right button on language folder and create new file and name it with your language code (.json). For example if your language is Bengali then you have to named your file asbn.json
. You have to name it with proper and valid language code otherwise app won’t work. For getting language and country code you can visit this url: https://docs.oracle.com/cd/E13214_01/wli/docs92/xref/xqisocodes.htmlCopy all data from
en.json
and paste it in your created file.Translate all English text placed here after colon(:) to your local language. There texts are in key-value formatted. You have to translate value only not key otherwise it won’t work. For example:
“home”: “Home” -> “home”: “বাড়ি”
Add your country picture on
/assets/image
folder.Open
/lib/util/app_constrants.dart
, scroll down to bottom and add one more LanguageModel under languages array with yourimageUrl
,languageName
,countryCode
andlanguageCode
. Again must remember that your language code and country code should valid otherwise app won’t work. In image url field you have to put your image path asassets/image/added_country_picture_name.extension
. For example if your added country picture name isbangladesh.png
then path will beassets/image/bangladesh.png
.tip
Recommended tutorial is below 👇
Change App Color
Open
<project>/lib/theme/light_theme.dart
file and set primary, accent and etc. colours for light theme.In the same way open
<project>/lib/theme/dark_theme.dart
file and set preferred primary, accent and etc. color for dark theme.tip
Recommended tutorial is below 👇
Change App Font
Download you preferred font from internet. Google has many free font you can check them: https://fonts.google.com/
Unzip fonts and paste it them to
<project>/assets/font/ folder
.Mentioned them in
<project>/pubspec.yaml
file like: fonts:- family:
YOUR_FONT_FAMILY_NAME
fonts:- asset:
assets/font/YOUR_FONT_FILE_NAME.ttf
weight:YOUR_FONT_WEIGHT
- asset:
- family:
Open
/lib/util/app_constrants.dart
and replace fontFamily variable value with your own Font Family.static const String fontFamily = 'Rubik';