I’m building a language application. The purpose of the application is to teach Turkish to the English. First, let me give you the images:
There is a scrolling system. The Turkish language of the word written above the textFormField will be entered into the textFormField.
I keep the English word and its Turkish meaning in a list.
List:
List<wordAndMeaning> wordsList = [
wordAndMeaning("Hello", "Merhaba", false),
wordAndMeaning("What's up?", "Naber", false),
wordAndMeaning("How are you?", "Nasılsın", false),
wordAndMeaning("Good morning", "Günaydın", false),
wordAndMeaning("Good night", "İyi geceler", false),
wordAndMeaning("How's it going?", "Nasıl gidiyor", false),
wordAndMeaning("How's your day?", "Günün nasıldı", false),
wordAndMeaning("How's your day going?", "Günün nasıl gidiyor", false),
wordAndMeaning("Nice to see you", "Seni görmek güzel", false),
wordAndMeaning("It's been a while", "Görüşmeyeli uzun zaman oluyor", false),
];
The order in the screen scrolling system is exactly the same as in the list. I want it to be sorted randomly. How can I do that?
Codes:
import 'package:flutter/material.dart';
import 'package:carousel_slider/carousel_slider.dart';
import 'package:getwidget/getwidget.dart';
class selamlasma_test1 extends StatefulWidget {
@override
State<selamlasma_test1> createState() => _selamlasma_test1State();
}
class _selamlasma_test1State extends State<selamlasma_test1> {
final CarouselController _controller = CarouselController();
final myController = TextEditingController();
List<wordAndMeaning> wordsList = [
wordAndMeaning("Hello", "Merhaba", false),
wordAndMeaning("What's up?", "Naber", false),
wordAndMeaning("How are you?", "Nasılsın", false),
wordAndMeaning("Good morning", "Günaydın", false),
wordAndMeaning("Good night", "İyi geceler", false),
wordAndMeaning("How's it going?", "Nasıl gidiyor", false),
wordAndMeaning("How's your day?", "Günün nasıldı", false),
wordAndMeaning("How's your day going?", "Günün nasıl gidiyor", false),
wordAndMeaning("Nice to see you", "Seni görmek güzel", false),
wordAndMeaning("It's been a while", "Görüşmeyeli uzun zaman oluyor", false),
];
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.amber[500],
appBar: AppBar(
backgroundColor: Colors.amber[500],
bottomOpacity: 0,
leading: IconButton(
icon: Icon(Icons.arrow_back_ios),
onPressed: () {
Navigator.pop(context);
},
),
title: Text("Selamlaşma Testi 1", style: TextStyle(fontSize: 25),),
),
body: Builder(builder: (context) {
final double height = MediaQuery.of(context).size.height - 160;
return Column(
children: [
CarouselSlider(
carouselController: _controller,
options: CarouselOptions(
reverse: false,
height: height,
viewportFraction: 1.0,
onPageChanged: (index, reason) => setState(() {
myController.clear();
}),
),
items: wordsList.map((wordAndMeaning word) {
return Builder(
builder: (BuildContext context) {
return Container(
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(color: Colors.amber),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
Expanded(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text(
word.word,
style: TextStyle(
fontSize: 30,
fontWeight: FontWeight.bold, color: Colors.black),
),
SizedBox(height: 20,),
Padding(
padding: EdgeInsets.all(15),
child: TextFormField(
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.white,
width: 3
),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.white,
// border kalınlığı:
width: 3,
),
),
border: OutlineInputBorder(),
labelText: '"' + word.word + '"' + " Türkçesi", floatingLabelStyle: TextStyle(fontSize: 23, color: Colors.white),
prefix: Padding(
padding: EdgeInsets.only(left: 5, right: 10),
child: Icon(Icons.translate),
),
labelStyle: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
),
),
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
),
controller: myController,
onChanged: (value) {
},
),
),
GFButton(
padding: EdgeInsets.only(left: 20, right: 20),
size: 45,
text: "Kontrol et", textStyle: TextStyle(fontSize: 25),
// kenar ovallaştirme:
shape: GFButtonShape.pills,
onPressed: () {
//eğer bir değer girilmemişse:
if (myController.text == "") {
Scaffold.of(context).showSnackBar(SnackBar(
content: Text("Lütfen bir değer giriniz!", style: TextStyle(fontSize: 20),),
duration: Duration(seconds: 2),
),
);
}
else if (myController.text.toLowerCase() != word.meaning.toLowerCase()) {
Scaffold.of(context).showSnackBar(SnackBar(
content: Text("Yanlış cevap!", style: TextStyle(fontSize: 20),),
duration: Duration(seconds: 2),
),
);
}
if (myController.text.toLowerCase() == word.meaning.toLowerCase()) {
print("Doğru");
myController.clear();
AlertDialog dogru = AlertDialog(
content: Text("Tebrikler! Doğru bildiniz.", style: TextStyle(fontSize: 22),),
actions: [
GFButton(
padding: EdgeInsets.only(left: 20, right: 20),
size: 35,
text: "Sonraki soru", textStyle: TextStyle(fontSize: 25),
onPressed: () {
_controller.nextPage(
duration: Duration(milliseconds: 500),
curve: Curves.ease,
);
// alert dialog u kapatma:
Navigator.pop(context);
},
),
],
);
showDialog(
context: context,
builder: (BuildContext context) {
return dogru;
},
);
}
},
),
],
),
),
const SizedBox(
width: 10,
),
],
),
);
},
);
}).toList(),
),
Container(
padding: EdgeInsets.all(5),
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(20)),
),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
),
width: 55,
height: 55,
child: RaisedButton(
color: Colors.blue,
child: Icon(Icons.arrow_back_ios, size: 30, color: Colors.white,),
onPressed: () {
_controller.previousPage(
duration: const Duration(milliseconds: 100),
curve: Curves.easeInCirc,
);
},
// köşeyi yuvarlaştırma:
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(25),
),
)
),
SizedBox(
width: 10,
),
SizedBox(
width: 10,
),
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
),
width: 55,
height: 55,
child: Container(
child: RaisedButton(
color: Colors.blue,
child: Icon(Icons.arrow_forward_ios, size: 30, color: Colors.white,),
onPressed: () {
_controller.nextPage(
duration: const Duration(milliseconds: 100),
curve: Curves.easeInCirc,
);
},
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(25),
),
)
),
),
],
),
],
),
)
],
);
}) ,
);
}
}
class wordAndMeaning {
String word;
String meaning;
bool showMeaning;
wordAndMeaning(this.word, this.meaning, this.showMeaning);
}
Thanks in advance for the help.
>Solution :
You can create an initial state and use the shuffle method. Do the following.
@override
initState() {
wordsList.shuffle();
super.initState();
}