Description => It is a language translator app that makes the communication sysytem easier it helps to convert one language to another language simply .
Here are the full code with explanation .
void main(){
runApp(Myapp());
}
class Myapp extends StatelessWidget {
const Myapp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Language Translator',
debugShowCheckedModeBanner: false,
home: Fir(),
);
}
}
Material app => this widget gives the function to add widgets
home: => it is us e for navigate the page
theme: => in the theme data we use scaffoldcolor to change the color of the page in the bacground
Here is the photo of the output of this code;
class Fir extends StatefulWidget {
const Fir({super.key});
@override
State<Fir> createState() => _FirState();
}
class _FirState extends State<Fir> {
var language = ['Hindi', 'English'];
var originlan = 'From';
var destinationlan = 'To';
var output = '';
TextEditingController languagecontroller = TextEditingController();
void translate(String src, String dest, String input) async {
GoogleTranslator translator = GoogleTranslator();
try {
var translation = await translator.translate(input, from: src, to: dest);
setState(() {
output = translation.text;
});
} catch (e) {
setState(() {
output = 'Failed to translate';
});
}
}
String getLanguageCode(String language) {
if (language == 'English') {
return 'en';
} else if (language == 'Hindi') {
return 'hi';
}
return '--';
}
In above code:
We can see that the logic of this code
First we use stateful widgets to add logic
variables ;
langauage => it use for add languages
originlanguage => means where the language start or what u choose
destination => means whereu wanna go
output => for the output
Texteditiongcontroller => use for adding additinaol widgets that related to the app means language controller
void => we use this function to add logic
and in this function we use some logic like
string and async function to naviagte
Google translator =>first we add dependency to translate the function
then we use try catch function and add
a var translation in the translation function we use void tranlate all the codes
setstate => for the use of curly braces and adding some logics
then we make a function name
String language => in this function we add if statement to add language logics
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Language Translator'),
backgroundColor: Colors.green,
elevation: 0,
),
body: Center(
child: Column(
children: [
const SizedBox(height: 10),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// Origin Language Dropdown
DropdownButton<String>(
value: originlan != 'From' ? originlan : null,
hint: const Text('From', style: TextStyle(color: Colors.black)),
dropdownColor: Colors.white,
icon: const Icon(Icons.keyboard_arrow_down),
items: language.map((String dropDownStringItem) {
return DropdownMenuItem<String>(
value: dropDownStringItem,
child: Text(dropDownStringItem),
);
}).toList(),
onChanged: (String? newValue) {
setState(() {
originlan = newValue!;
});
},
),
const SizedBox(width: 20),
const Icon(Icons.arrow_right_outlined, size: 40, color: Colors.black),
const SizedBox(width: 20),
// Destination Language Dropdown
DropdownButton<String>(
value: destinationlan != 'To' ? destinationlan : null,
hint: const Text('To', style: TextStyle(color: Colors.black)),
dropdownColor: Colors.white,
icon: const Icon(Icons.keyboard_arrow_down),
items: language.map((String dropDownStringItem) {
return DropdownMenuItem<String>(
value: dropDownStringItem,
child: Text(dropDownStringItem),
);
}).toList(),
onChanged: (String? newValue) {
setState(() {
destinationlan = newValue!;
});
},
),
],
),
const SizedBox(height: 40),
In above code
Scaffold => for running the code of the widgets
App bar => it is the basic layout of the code
body => for functioning the part of the layout
then we add
Row => for adding all the function in the row wise
in row we add main axix allignment centre so that all our output will be formed into the centre
then we add origin language dropdown
Dropdownbotton<String> => we add our logic
if value = originlan add from that the user find that what to do with this item
then we add [Hint] that use for text icon
dropdowncolor => adding color of down that if we select the dropdowndown he show us the color
icon: for adding icons
items => then we add [map] for adding string dropdownitems who we make first
language.map => in this function we simply return value of the string and text of the string
and add to list
then we add [onchanged] onchanged function add to change the value of the function and other items
we add string nd defined the sting as a newvalue
sestate => add setstate for adding some items like originlan to newvalue
and this function add agian respect to the to function .
.png)
.png)
.png&description=Language translator app flutter app | Flutter language translator ,flutter translator ,flutter ){kind=link}
0 Comments