Question

我希望有一个名为主题的页面，其中包含网格图像，当我单击图像时，选择该图像作为主页的背景。

这是我的清单：

List<Theme2> themeitems = [
  Theme2(
    background: 'assets/images/theme/deskWhite.png',
    selected: false,
  ),
  Theme2(
    background: 'assets/images/theme/greenDrop.png',
    selected: false,
  ),
  Theme2(
    background: 'assets/images/theme/leaf.png',
    selected: false,
  ),
],

这是我要设置背景图像的主页：

child: Scaffold(
          body: Container(
            decoration: BoxDecoration(
              image: DecorationImage(
                image: AssetImage('assets/images/theme/sand.png'),
         ////// image: AssetImage(themeitems[idx].background.selected), // I know this is not correct
                fit: BoxFit.cover,
              ),
            ),
            child: Column(.........

那么，如何从这些列表项之一设置背景图像？

我尝试使用themeitems[index].selected = !themeitems[index].selected;，但不确定如何正确使用它。如果网上有类似问题，请给我发送链接。

谢谢您的时间。

Answer 1

根据您的代码，我认为将图像重命名为顺序更容易一些，例如：image1.png，image2.png，image3.png，...

您可以将其存储在list中，但是我认为您不需要这样做，只要您已将图像添加到资源文件夹中即可。

然后，在代码内选择图像：

int index = 0; //this variable is to store your selected index

child: Scaffold(
          body: Container(
            decoration: BoxDecoration(
              image: DecorationImage(
                image: AssetImage('assets/images/theme/image$index.png'), //So if the index = 0, so image).png will appear. And, so on.
                fit: BoxFit.cover,
              ),
            ),
            child: Column( //YOUR CODE

从列表中设置背景抖动

1 个答案: