0

https://i.stack.imgur.com/NmkxE.jpg 在此处输入图像描述 如何在单击 2~3 个切换按钮时更改图像这就是我想要做的。示例中包含 9cat 图片。

我想加载猫图像（总共 9 张猫图像）//单击房间 1 按钮，猫 1 按钮 -> 加载猫 1 图像 // room1 按钮，猫 2 按钮 - > 加载猫 2 图像 ...单击房间 3，猫 3 按钮 -> 加载猫 9 图像 进入图像此处描述 此处 输入代码

import '123.dart';
import '456.dart';

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('imageToggle'),),
        body: Column(
          children: [
            Expanded(child: Image.asset('images/meow.jpg')),
            Button123(),
            Button456(),

          ],
        ),
      ),
    );
  }
}


class Button123 extends StatefulWidget {
  @override
  _Button123State createState() => _Button123State();
}

class _Button123State extends State<Button123> {
  List<bool> isSelected = List.generate(3, (index) => false);
  @override
  Widget build(BuildContext context) {
    return Container(
      height: 40,
      child: ToggleButtons(
        isSelected: isSelected,
        color: Colors.black,
        fillColor: Colors.grey,
        children: [
          Padding(padding: const EdgeInsets.symmetric(horizontal: 2),
          child: Text('room1'),),
          Padding(padding: const EdgeInsets.symmetric(horizontal: 2),
            child: Text('room2'),),
          Padding(padding: const EdgeInsets.symmetric(horizontal: 2),
            child: Text('room3'),),


        ],
        onPressed: (int newIndex) {
          setState(() {
            for (int index = 0; index < isSelected.length; index++) {
              if (index == newIndex) {
                isSelected[index] = true;
              } else {
                isSelected[index] = false;
              }
            }
          });
        },

      )
    );
  }
}
4

0 回答 0