我没有检查真实设备,而是测试模拟器。
我在CustomScrollView
. 看下面的代码。当我运行代码片段时,我在模拟器iPhone XR中向上向下滚动时遇到的屏幕滚动不顺畅。检查其他模拟器后它工作正常吗?下面的代码有什么问题吗?我不这么认为,否则我不会在其他模拟器上工作?
import 'package:flutter/material.dart';
class AnimalWidget extends StatefulWidget {
_AnimalWidgetState createState() => _AnimalWidgetState();
}
class _AnimalWidgetState extends State<AnimalWidget> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: CustomScrollView(
slivers: <Widget>[
SliverAppBar(
expandedHeight: 210,
pinned: true,
flexibleSpace: FlexibleSpaceBar(
background: Image.network(
'https://static.independent.co.uk/s3fs-public/thumbnails/image/2017/09/12/11/naturo-monkey-selfie.jpg?w968h681',
fit: BoxFit.cover),
title: Text('Animals Dashboard'),
),
),
SliverToBoxAdapter(
child: Container(
margin: EdgeInsets.only(left: 8, top: 12, right: 8),
child: Card(
elevation: 4,
child: Container(
margin: EdgeInsets.only(left: 8, top: 8, right: 8, bottom: 8),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Container(
decoration: BoxDecoration(
border: Border.all(
color: Theme.of(context).primaryColor,
width: 1,
style: BorderStyle.solid)),
child: ListTile(
leading: Icon(Icons.fastfood,
color: Theme.of(context).primaryColor, size: 30),
title: Text(
"Monkey",
style: TextStyle(
color: Theme.of(context).primaryColor),
),
trailing: Icon(
Icons.arrow_drop_down,
color: Theme.of(context).primaryColor,
size: 40,
),
onTap: () {},
),
),
SizedBox(
height: 15,
),
Container(
decoration: BoxDecoration(
border: Border.all(
color: Theme.of(context).primaryColor,
width: 1,
style: BorderStyle.solid)),
child: ListTile(
leading: Icon(Icons.local_florist,
color: Theme.of(context).primaryColor, size: 30),
title: Text(
"Donkey",
style: TextStyle(
color: Theme.of(context).primaryColor),
),
trailing: Icon(
Icons.arrow_drop_down,
color: Theme.of(context).primaryColor,
size: 40,
),
onTap: () {},
),
),
SizedBox(
height: 15,
),
Container(
decoration: BoxDecoration(
border: Border.all(
color: Theme.of(context).primaryColor,
width: 1,
style: BorderStyle.solid)),
child: ListTile(
leading: Icon(Icons.find_replace,
color: Theme.of(context).primaryColor, size: 30),
title: Text(
"Camel",
style: TextStyle(
color: Theme.of(context).primaryColor),
),
trailing: Icon(
Icons.arrow_drop_down,
color: Theme.of(context).primaryColor,
size: 40,
),
onTap: () {},
),
),
SizedBox(height: 15),
Container(
height: 50,
color: Colors.teal,
child: FlatButton(
onPressed: () {},
color: Theme.of(context).primaryColor,
child: Text('SELECT ANIMAL',
style: TextStyle(
color: Colors.white,
fontSize: 16,
fontWeight: FontWeight.w600)),
)),
SizedBox(height: 15),
],
),
),
),
),
),
SliverList(delegate: SliverChildBuilderDelegate(
(BuildContext context, int index) {
return ListTile(
leading: CircleAvatar(
child: Text(
'A',
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
textAlign: TextAlign.center,
),
),
title: Text('Animal => $index'),
);
},
)),
],
),
);
}
}
为此,只需复制并粘贴代码即可。