英文:
Horizontal ListView builder end with one button using row
问题
I need horizontal list view (ListView.builder) with scrollable and these list end with one button, I am using row but screen cannot able to scroll.
我需要一个水平列表视图（ListView.builder），可以滚动，且列表末尾有一个按钮，我正在使用行（Row），但屏幕无法滚动。
I am newbie in flutter.
我是Flutter的新手。
英文:
I need horizontal list view (ListView.builder) with scrollable and these list end with one button, I am using row but screen cannot able to scroll
I am newbie in flutter.
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: MediaQuery.of(context).size.height/2,
child: ListView.builder(
physics: ClampingScrollPhysics(),
shrinkWrap: true,
scrollDirection: Axis.horizontal,
itemCount: newList!.content.length,
itemBuilder: (BuildContext context, int index) => Column(
children: [
Container(
padding: newList!.content.length == index
? EdgeInsets.only(right: 13)
: 0 == index
? EdgeInsets.only(left: 13, right: 13)
: EdgeInsets.only(right: 13),
child: Column(
children: [
Column(
children: [
ImageCard(
contentItem: newList.content[index],
isInINR: newList.isInINR)
],
)
],
),
),
],
),
)),
],
),
答案1
得分: 1
// 在Flutter中向listView.builder的末尾添加小部件，您可以检查当前索引，如果索引是最后一个项目的索引，我们意识到listView已经构建了所有项目，我们可以将一个小部件添加到列表的末尾，同时我们需要增加listCount，以下是一个简单的示例：
SizedBox(
height: MediaQuery.of(context).size.height / 2,
child: ListView.builder(
physics: ClampingScrollPhysics(),
shrinkWrap: true,
scrollDirection: Axis.horizontal,
itemCount: newList!.content.length + 1,
itemBuilder: (BuildContext context, int index) =>
index == newList!.content.length
? TextButton()
: YourListItemWidget(),
),
)
英文:
to add a widget to the end of listView.builder in flutter, you can check the current index, if index is the last item index, we realize that listView has built all the items and we can add a widget to the end of list,also we need to increase listCount, here is a simple:
SizedBox(
height: MediaQuery.of(context).size.height / 2,
child: ListView.builder(
physics: ClampingScrollPhysics(),
shrinkWrap: true,
scrollDirection: Axis.horizontal,
itemCount: newList!.content.length + 1,
itemBuilder: (BuildContext context, int index) =>
index == newList!.content.length
? TextButton()
: YourListItemWidget(),
)),
答案2
得分: 0
以下是您要翻译的内容：
"Instead of adding new element in list you add the condition like below. If index is last then you can show the view all button. I hope you will get the answer. You can ask more if you have any queries.
import 'package:flutter/material.dart';
const Color darkBlue = Color.fromARGB(255, 18, 32, 47);
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(
scaffoldBackgroundColor: darkBlue,
),
debugShowCheckedModeBanner: false,
home: Scaffold(
body: Center(
child: MyWidget(),
),
),
);
}
}
class _MyWidgetState extends State<MyWidget> {
bool displayAllList = false;
int minimumCount = 4;
@override
Widget build(BuildContext context) {
List list = List.generate(8, (index) => index).toList();
return ListView.builder(
scrollDirection: Axis.horizontal,
itemBuilder: (BuildContext context, int index) {
return Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
children: [
const SizedBox(
width: 50, height: 50, child: ColoredBox(color: Colors.red)),
if ((list.length > minimumCount && (index == minimumCount - 1)) && (list.length > 4 && displayAllList == false)) ...[
TextButton(onPressed: () {
setState(() {
displayAllList = true;
});
}, child: Text('View All'))
]
],
),
);
},
itemCount: (list.length > 4 && displayAllList == false) ? 4 : list.length,
);
}
}
希望对您有所帮助。如果有任何问题，请随时提出。
英文:
Instead of adding new element in list you add the condition like below. If index is last then you can show the view all button. I hope you will get the answer. You can ask more if you have any queries.
import 'package:flutter/material.dart';
const Color darkBlue = Color.fromARGB(255, 18, 32, 47);
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(
scaffoldBackgroundColor: darkBlue,
),
debugShowCheckedModeBanner: false,
home: Scaffold(
body: Center(
child: MyWidget(),
),
),
);
}
}
class _MyWidgetState extends State<MyWidget> {
bool displayAllList = false;
int minimumCount = 4;
@override
Widget build(BuildContext context) {
List list = List.generate(8, (index) => index).toList();
return ListView.builder(
scrollDirection: Axis.horizontal,
itemBuilder: (BuildContext context, int index) {
return Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
children: [
const SizedBox(
width: 50, height: 50, child: ColoredBox(color: Colors.red)),
if ((list.length > minimumCount && (index == minimumCount - 1)) && (list.length > 4 && displayAllList == false)) ...[
TextButton(onPressed: () {
setState((){
displayAllList = true;
});
}, child: Text('View All'))
]
],
),
);
},
itemCount: (list.length > 4 && displayAllList == false) ? 4 : list.length,
);
}
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论