Возможен ли SingleChildScrollView с виджетом "Таблица"?
Я разделил экран пополам на 3/5. В нижнюю часть я добавил виджет "таблица". Но я хочу, чтобы нижняя часть была прокручиваемой. Я добавил SingleChildScrollView, но он не работает. Что я должен делать?
void main() {
runApp(
MaterialApp(
home: HomePage(),
),
);
}
class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
final _scaffoldKey = GlobalKey<ScaffoldState>();
@override
Widget build(BuildContext context) {
final screenHeight = MediaQuery.of(context).size.height;
return Scaffold(
key: _scaffoldKey,
body: Stack(
children: <Widget>[
Column(
children: <Widget>[
Expanded(
flex: 3,
child: Stack(
children: <Widget>[
OpaqueImage(
imageUrl: "assets/images/matematik_sembolleri.jpg",
),
SafeArea(
child: Padding(
padding: const EdgeInsets.all(4),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Align(
alignment: Alignment.centerLeft,
child: IconButton(
icon: const Icon(Icons.menu),
color: Colors.white,
onPressed: () {
_scaffoldKey.currentState.openDrawer();
},
),
),
Align(
alignment: Alignment.topCenter,
child: Text(
"Pirekare Matematik",
textAlign: TextAlign.center,
style: headingTextStyle,
),
),
Align(
alignment: Alignment.centerRight,
child: IconButton(
icon: const Icon(Icons.star),
color: Colors.white,
onPressed: () {},
),
),
],
),
MyInfo(),
],
),
),
),
],
),
),
Код до этого момента предназначен для верхней части экрана и является фиксированным. (Вы должны объединить коды.)
Приведенные ниже коды предназначены для нижней части экрана, и я хочу, чтобы их можно было прокручивать.
Expanded(
flex: 5,
child: SingleChildScrollView(
child: Container(
padding: const EdgeInsets.only(top: 30),
color: Colors.white,
child: Table(
children: [
TableRow(
children: [
GestureDetector(
onTap: () {},
child: ProfileInfoBigCard(
firstText: "Özel Ders Programı",
secondText:
"Seviyenize göre çalışma programı ayarlayın",
icon: Icon(
Icons.next_plan,
size: 16,
color: blueColor,
),
),
),
GestureDetector(
onTap: () {},
child: ProfileInfoBigCard(
firstText: "Konu Anlatım Videoları",
secondText:
"İstediğiniz konuya videoları izleyerek çalışın",
icon: Icon(
Icons.video_collection_rounded,
size: 16,
color: blueColor,
)),
),
],
),
TableRow(
children: [
GestureDetector(
onTap: () {},
child: ProfileInfoBigCard(
firstText: "Soru Tipleri",
secondText:
"Soru çözme yeteneğinizi arttırın",
icon: Icon(
Icons.text_snippet_rounded,
size: 16,
color: blueColor,
)),
),
GestureDetector(
onTap: () {},
child: ProfileInfoBigCard(
firstText: "Soru Cüzdanı",
secondText:
"Kaydetmek istediğiniz soruları cüzdanınıza ekleyin",
icon: Icon(
Icons.local_post_office,
size: 16,
color: blueColor,
),
),
),
],
),
TableRow(
children: [
GestureDetector(
onTap: () {},
child: ProfileInfoBigCard(
firstText: "Puan Tablosu",
secondText:
"Diğer öğrencilerle puanlarınızı karşılaştırın",
icon: Icon(
Icons.leaderboard,
size: 16,
color: blueColor,
),
),
),
GestureDetector(
onTap: () {},
child: ProfileInfoBigCard(
firstText: "Türkiye Geneli Sınav",
secondText:
"Diğer öğrencilerle aynı anda sınava girin",
icon: Icon(
Icons.map,
size: 16,
color: blueColor,
),
),
),
],
),
],
),
),
),
),
],
),
Positioned(
top: screenHeight * (3 / 8) - 60 / 2,
left: 16,
right: 16,
child: Container(
height: 60,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
ProfileInfoCard(firstText: "54", secondText: "Net"),
SizedBox(
width: 10,
),
ProfileInfoCard(firstText: "543", secondText: "Puanınız"),
SizedBox(
width: 10,
),
ProfileInfoCard(firstText: "15", secondText: "Seviye"),
],
),
),
),
],
),
drawer: Drawer(
child: DrawerDosyasi(),
),
);
}
}
Если я не могу использовать Table, что вы посоветуете?
1 ответ
Решение
Вы можете указать высоту своему контейнеру, который обернул вашу таблицу, и обернуть ее с помощью Listview. Теперь вы можете прокручивать строку таблицы.
Expanded(
flex: 5,
child: SingleChildScrollView(
child: Container(
height: 80,
padding: const EdgeInsets.only(top: 30),
color: Colors.white,
child: ListView(
children: [
Table(
children: [
TableRow(
children: [
GestureDetector(
onTap: () {}, child: Text("heey")),
GestureDetector(
onTap: () {}, child: Text("heey")),
],
),
TableRow(
children: [
GestureDetector(
onTap: () {}, child: Text("heey")),
GestureDetector(
onTap: () {}, child: Text("heey")),
],
),
TableRow(
children: [
GestureDetector(
onTap: () {}, child: Text("heey")),
GestureDetector(
onTap: () {}, child: Text("heey")),
],
),
TableRow(
children: [
GestureDetector(
onTap: () {}, child: Text("heey")),
GestureDetector(
onTap: () {}, child: Text("heey")),
],
),
],
),
],
),
),
),
),