flutter - 根据当前时间在 ListTile 中突出显示时间表

Question

我有这段代码，但不知道如何根据当前时间突出显示日程。它可以是卡片、盒子装饰或只是影子。

class _MainPageState extends State<MainPage> {
  String displaycode = '';

  @override
  Widget build(BuildContext context) {
    var futureBuilder = FutureBuilder<Tasks>(
          ...
          ...
            else
            return createListView(context, snapshot);
        }
      },
    );

    return Scaffold(
      body: futureBuilder,
    );
  }

//ListTile times
  Widget createListView(BuildContext context, AsyncSnapshot snapshot){
    return Container(
      padding: const EdgeInsets.symmetric(vertical: 30, horizontal: 20),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          _mainList("Math", Text(DateFormat("hh:mm a").format(DateFormat("HH:mm").parse(snapshot.data.task1)))),
          _mainList("English", Text(DateFormat("hh:mm a").format(DateFormat("HH:mm").parse(snapshot.data.task2)))),
          _mainList("History", Text(DateFormat("hh:mm a").format(DateFormat("HH:mm").parse(snapshot.data.task3)))),
        ],
      ),
    );
  }
    
 _mainList(String name, clock){
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 0),
      child: ListTile(
        title: Text(name, textScaleFactor: 1.2),
        trailing: clock,
      ),
    );
  }
}

例如，如果它是下午 4:35，它应该如下图所示，在晚上 7:23，时间表“历史”应该突出显示

谢谢你的时间，我真的很感激

标签： flutter

Answer 1

尝试这个：

class _MainPageState extends State<MainPage> {
  String displaycode = '';

  @override
  Widget build(BuildContext context) {
    var futureBuilder = FutureBuilder<Tasks>(
          ...
          ...
            else
            return createListView(context, snapshot);
        }
      },
    );

    return Scaffold(
      body: futureBuilder,
    );
  }

//ListTile times
  Widget createListView(BuildContext context, AsyncSnapshot snapshot){
    return Container(
      padding: const EdgeInsets.symmetric(vertical: 30, horizontal: 20),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          _mainList("Math", Text(DateFormat("hh:mm a").format(DateFormat("HH:mm").parse(snapshot.data.task1)))),
          _mainList("English", Text(DateFormat("hh:mm a").format(DateFormat("HH:mm").parse(snapshot.data.task2)))),
          _mainList("History", Text(DateFormat("hh:mm a").format(DateFormat("HH:mm").parse(snapshot.data.task3)))),
        ],
      ),
    );
  }

 _mainList(String name, clock, bool isHighlighted){
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 0),
      child: Container(
        color:isHighlighted?Colors.grey:Colors.transparent
        ListTile(
        title: Text(name, textScaleFactor: 1.2),
        trailing: clock,
      ),
    );
  }
}

为了便于阅读，我将在此处保留您的条件逻辑：

(DateFormat("hh:mm a").format(DateTime.parse(snapshot.data.task1)))==DateFormat("hh:mm a").format(DateTime.now()))?true:false;

在调用 _mainList 时使用此条件逻辑传递布尔值。