Используя флаттер, я пытаюсь создать список языков, и в конце списка мне нужен круговой флажок, который выбрал язык. Нажатие в любом месте текста или флажка должно показать включенное состояние, а повторное нажатие должно отключить его. Я не уверен, как обрабатывать состояние каждого флажка отдельно. Я тоже пробовал использовать CheckBoxListTile, но не уверен, как добиться желаемого. Может ли кто-нибудь привести примеры?
Смотрите мое изображение здесь
`
import 'package:basic_utils/basic_utils.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:pankaj_app/config.dart';
import 'package:pankaj_app/model/LanguageModel.dart';
import 'package:shared_preferences/shared_preferences.dart';
class ChooseLanguage extends StatefulWidget {
ChooseLanguage({Key key, this.language}) :super(key: key);
List<LanguageModel> language;
@override
_ChooseLanguageState createState() => _ChooseLanguageState();
}
class _ChooseLanguageState extends State<ChooseLanguage> {
int languageIndex = 0;
bool _isSelected = false;
@override
void initState() {
super.initState();
SystemChrome.setEnabledSystemUIOverlays(SystemUiOverlay.values);
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
]);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text(AppStrings.language)),
backgroundColor: Color(0xFFfbf5e7),
resizeToAvoidBottomPadding: false,
body: Container(child: Container(
padding:EdgeInsets.all(5),
child:new Center(
child: new FutureBuilder<List<LanguageModel>>(
future: getlanguage(),
builder: (context, snapshot) {
if (snapshot.hasData) {
if (snapshot.connectionState == ConnectionState.done) {
return ListView.builder(
//shrinkWrap: true,
itemCount: snapshot.data.length,
itemBuilder: ((context, index) => languageList(
list: snapshot.data,
index: index,
)));
} else {
return Center(
child: CircularProgressIndicator(),
);
}
}else {
return Center(
child: CircularProgressIndicator(),
);
}
},
),
),
),
),
bottomNavigationBar:BottomAppBar(
child: Container(
color: Colors.transparent,
width: MediaQuery.of(context).size.width,
height: 60,
child: FlatButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(0),
side: BorderSide(color: Colors.blueAccent)),
color: Colors.purpleAccent,
textColor: Colors.white,
padding: EdgeInsets.all(8.0),
onPressed: () {},
child: Text("Continue".toUpperCase(),
style: TextStyle(
fontSize: 14.0,),),),)
),
);
}
Widget languageList({List<LanguageModel> list, int index}){
return Column(
mainAxisAlignment: MainAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Padding(
padding: EdgeInsets.all(0),
child: Ink(
color: _isSelected ? Colors.blue : Colors.transparent,
child: new ListTile(
dense: false,
title: new Text(list[index].language,
style: new TextStyle(
fontWeight: FontWeight.w600,
fontSize: 16.0,
color: Colors.deepPurple),),
// trailing: new Row(
// children: <Widget>[
// new Checkbox(
// value: list[index].isCheck, onChanged: (bool value) {
// setState(() {
// list[index].isCheck = value;
// });
// })
// ],
// )
// GestureDetector(
// child: _isSelected
// ? Icon(
// Icons.favorite,
// color: Colors.red,
// )
// : Icon(
// FontAwesomeIcons.heart,
// color: null,
// ),
onTap: () {
if(_isSelected){
setState(() {
_isSelected = true;
});
}
}
// if (!_isSelected) {
// setState(() {
// _isSelected = true;
// });
// // saveLikeValue(_isLiked);
// // postLike(list[index].reference, currentUser);
// } else {
// setState(() {
// _isSelected = false;
// });
// //saveLikeValue(_isLiked);
// // postUnlike(list[index].reference, currentUser);
// }
// }),
),),
),
],);
}
}
`