#flutter-layout
Вопрос:
Я хочу добавить вид прокрутки только в список, но вид прокрутки прокручивает всю страницу. я хочу реализовать прокрутку только для элемента списка. любезно предложите помощь, так как я новичок в флаттере. Я хочу добавить вид прокрутки только в список, но вид прокрутки прокручивает всю страницу. я хочу реализовать прокрутку только для элемента списка. любезно предложите помощь, так как я новичок в флаттере.Я хочу добавить вид прокрутки только в список, но вид прокрутки прокручивает всю страницу. я хочу реализовать прокрутку только для элемента списка. любезно предложите помощь, так как я новичок в флаттере. Это экран, на котором scrollview должен начинаться после заголовка brown
@override
Widget build(BuildContext context) {
pr = ProgressDialog(context);
getData().then((serviceData) => {_serviceData = serviceData});
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.light
.copyWith(statusBarColor: Colors.transparent));
return Scaffold(
appBar: AppBar(
leading: GestureDetector(
onTap: () {
Navigator.pop(context);
},
child: Icon(
Icons.arrow_back_ios_new_outlined,
),
),
title: Text("My Request"),
backgroundColor: Colors.orangeAccent,
),
body: Container(
child: SingleChildScrollView(
child: Column(
children: [
Container(
padding: EdgeInsets.symmetric(vertical: 20.0),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
GestureDetector(
onTap: () {
_selectStartDate(context);
},
child: Column(
children: <Widget>[
Container(
padding: EdgeInsets.symmetric(
vertical: 5.0, horizontal: 15.0),
child: Column(
children: <Widget>[
Icon(Icons.date_range_outlined),
Text("Start Date",
style:
TextStyle(fontWeight: FontWeight.bold)),
Text(startDate),
],
),
),
],
),
),
GestureDetector(
onTap: () {
_selectDate(context);
},
child: Column(
children: <Widget>[
Container(
padding: EdgeInsets.symmetric(
vertical: 5.0, horizontal: 15.0),
child: Column(
children: <Widget>[
Icon(Icons.date_range_outlined),
Text("End Date",
style:
TextStyle(fontWeight: FontWeight.bold)),
Text(getDateTime()),
],
),
),
],
),
),
],
),
),
Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
Expanded(
child: Container(
height: 55,
alignment: Alignment.center,
padding: EdgeInsets.symmetric(
vertical: 10.0, horizontal: 10.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(4)),
shape: BoxShape.rectangle,
color: Colors.brown,
border: Border.all(
color: Colors.white,
width: 2,
)),
child: Text("Sr No.",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold))),
),
Expanded(
child: Container(
height: 55,
alignment: Alignment.center,
padding: EdgeInsets.symmetric(
vertical: 10.0, horizontal: 10.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(4)),
shape: BoxShape.rectangle,
color: Colors.brown,
border: Border.all(
color: Colors.white,
width: 2,
)),
child: Text("Date amp; Time",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold))),
),
Expanded(
child: Container(
height: 55,
alignment: Alignment.center,
padding: EdgeInsets.symmetric(
vertical: 10.0, horizontal: 10.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(4)),
shape: BoxShape.rectangle,
color: Colors.brown,
border: Border.all(
color: Colors.white,
width: 2,
)),
child: Text("Request",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold))),
),
Expanded(
child: Container(
height: 55,
alignment: Alignment.center,
padding: EdgeInsets.symmetric(
vertical: 10.0, horizontal: 10.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(4)),
shape: BoxShape.rectangle,
color: Colors.brown,
border: Border.all(
color: Colors.white,
width: 2,
)),
child: Text("Status",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold))),
),
],
),
),
FutureBuilder(
future: getData(),
builder: (context, AsyncSnapshot snapshot) {
if (!snapshot.hasData) {
return Center(child: CircularProgressIndicator());
} else {
return Container(
color: Colors.white,
child: _serviceData == null || _serviceData.isEmpty
? Text(
"No Record Found",
style:
TextStyle(fontSize: 20, color: Colors.brown),
)
: ListView.builder(
scrollDirection: Axis.vertical,
shrinkWrap: true,
physics: new BouncingScrollPhysics(),
itemCount: null == _serviceData
? 0
: _serviceData.length,
itemBuilder: (context, index) {
PatientServiceDetails pd = _serviceData[index];
return Card(
child: InkWell(
onTap: () {
showDialogFunc(context, pd);
},
child: Container(
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceAround,
children: <Widget>[
Expanded(
child: Container(
alignment: Alignment.center,
child: ListTile(
title: Text(
pd.requestNumber.toString(),
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 12,
color: getColor(
pd.status))),
),
),
),
Expanded(
child: Container(
alignment: Alignment.center,
child: ListTile(
title: Text(
pd.createdDate.toString(),
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 12)),
),
),
),
Expanded(
child: Container(
alignment: Alignment.center,
child: ListTile(
title: Text(
pd.reqComment.toString(),
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 12)),
),
),
),
Expanded(
child: Container(
child: ListTile(
title: Text(
getStatus(pd.status),
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 12)),
),
),
),
],
))),
);
}),
);
}
}),
// container
],
),
),
),
);
}
Ответ №1:
Просто используйте Column
и Listview.Builder()
см.Этот пример метода сборки. вы можете заменить «ВЕРХНИЕ ВИДЖЕТЫ» своими виджетами. используя этот метод сборки, вы можете добиться ожидаемого поведения
@override
Widget build(BuildContext context) {
return Scaffold(
body : Column(
mainAxisSize:MainAxisSize.max,
children:[
Container(child: Text("TOP WIDGETS")),
Expanded(
flex:1,
child:ListView.builder(
itemCount: 50,
itemBuilder: (context,index){
return Text("List Item 1");
},
)
)
]
)
);
}
Этот очень простой и эффективный способ, ListView.Builder() может использоваться для динамических списков и может обрабатывать, если значение равно null!