dart Flutter中ListView中列表项的显示属性

iswrvxsc 于 2023-09-28 发布在 Flutter

关注(0)|答案(1)|浏览(99)

我正在创建一个小的Flutter程序来了解它，但无法使用ListView Builder显示“Task”对象（存在于List中）的“description”属性。我已经尝试了它与普通文本，它显示它如何我想要它，这导致我相信布局是正确的;只是访问'Task.description'我不能做，因为它返回'Instance member 'description'can 't be accessed using static access.'只是为了澄清，包含任务的列表和列表视图生成器在不同的文件中，尽管我不明白为什么这会是一个问题。
下面是包含Task对象示例的List（还有3个）：

final List<Task> taskList = [
  Task(
    title: 'Clean Spillage On Aisle 4',
    description:
        'Clear up using mop & cleaning solution found in store cupboard B',
    creator: 'John Smith',
    status: CompletionStatus.notStarted,
    completeBy: "08:30 am",
  ),
];

下面是ListView Builder的主要方法：

import 'package:task_management/data/tasks.dart';

class TaskCard extends StatelessWidget {
  static String desc = Task.description;
  final Task task;
  const TaskCard(this.task, {Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Container(
          padding: const EdgeInsets.fromLTRB(8, 8, 8, 8),
          height: 290,
          width: double.maxFinite,
          child: Card(
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(15.0),
            ),
            shadowColor: Colors.black,
            elevation: 15,
            child: ClipPath(
              clipper: ShapeBorderClipper(
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(30),
                ),
              ),
//Start of relevant code block
              child: ListView.builder(
                itemCount: taskList.length,
                itemBuilder: ((context, index) {
                  return ListTile(
                    leading: CircleAvatar(
                      child: Text(Task.description),
                    ),
                    title: Text(Task.description),
                  );
                }),
              ),
//End of relevant code block
            ),
          ),
        ),
      ),
    );
  }
}

dart

来源：https://stackoverflow.com/questions/77039891/display-attribute-of-list-item-in-a-listview-in-flutter

1条答案

按热度按时间

bvn4nwqk1#

我相信我明白你想表达的意思。您希望提取存储在列表中的对象的单个值并将其显示在列表视图生成器中。我为你写了一个最小的代码。只需将其复制并粘贴到main.dart文件中并尝试测试即可。承认我&随时在评论区问任何问题。
原始程式码：

import "package:flutter/material.dart";

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Flutter Demo",
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final List<Task> taskList = <Task>[
    Task(title: "It's title 01", subtitle: "It's subtitle 01"),
    Task(title: "It's title 02", subtitle: "It's subtitle 02"),
    Task(title: "It's title 03", subtitle: "It's subtitle 03"),
    Task(title: "It's title 04", subtitle: "It's subtitle 04"),
    Task(title: "It's title 05", subtitle: "It's subtitle 05"),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: ListView.builder(
          itemCount: taskList.length,
          itemBuilder: (BuildContext context, int index) {
            // Important 👇🏻
            final Task task = taskList[index];
            // Important 👆🏻
            return ListTile(
              title: Text("Title: ${task.title}"),
              subtitle: Text("Subtitle: ${task.subtitle}"),
            );
          },
        ),
      ),
    );
  }
}

class Task {
  Task({required this.title, required this.subtitle});

  final String title;
  final String subtitle;
}

赞(0）回复(0）举报 2023-09-28

我来回答

dart Flutter中ListView中列表项的显示属性

1条答案

相关问题

热门标签

最新问答