Question

我搜索过高和低，但是找不到一种方法来更改ListTile的背景颜色，例如当用户点击它时。

有人能解决似乎常见的用例吗？

Answer 1

要更改ListTile的背景色，只需将其包装在Container中并更改其color属性即可。之后，当onTap中的ListTile被触发时，您可以更改颜色。

演示：

演示来源：

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: CustomTile()
        ),
      ),
    );
  }
}

class CustomTile extends StatefulWidget {
  @override
  CustomTileState createState() => CustomTileState();
}

class CustomTileState extends State<CustomTile> {
  Color color;

  @override
  void initState() {
    super.initState();

    color = Colors.transparent;
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      color: color,
      child: ListTile(
        title: Text('Title'),
        subtitle: Text('Subtitle'),
        onTap: () {
          setState(() {
            color = Colors.lightBlueAccent;
          });
        },
      ),
    );
  }
}

Answer 2

因为您没有描述用例或共享任何代码，所以我共享了示例示例代码，这些示例代码更改了Listile颜色onTap()

class Screen1 extends StatefulWidget {
  @override
  Screen1State createState() {
    return new Screen1State();
  }
}

class Screen1State extends State<Screen1> {
  bool _color;

  @override
  void initState() {
    super.initState();
    _color = true;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Center(
      child: Card(
        color: _color ? Colors.deepOrangeAccent : Colors.purpleAccent,
        child: ListTile(
          onTap: () {
            setState(() {
              _color = !_color;
            });
          },
          title: Text(
            'Title',
            style: TextStyle(color: Colors.white),
          ),
          subtitle: Text(
            'Subtitle',
            style: TextStyle(color: Colors.white),
          ),
        ),
      ),
    ));
  }
}

Answer 3

如果您只是想要一种快速的方法，而无需太多代码和自定义，则可以使用RaisedButton将其包装起来，如下所示：

RaisedButton(
  color: ...
  child: ListTile(
    color: Colors.transparent,
    ...
  )

）

您还可以使用许多属性，例如高程，突出显示颜色，焦点颜色等等。

点击时如何更改ListTile背景颜色？

3 个答案: