如何在 flutter listview 中只制作一张可滑动的幻灯片？

Question

import 'package:flutter/material.dart';
import 'package:flutter_slidable/flutter_slidable.dart';

class MapSelectPage extends StatefulWidget {
  const MapSelectPage({Key? key}) : super(key: key);

  @override
  State<MapSelectPage> createState() => _MapSelectPageState();
}

class _MapSelectPageState extends State<MapSelectPage> {
  @override
  Widget build(BuildContext context) {
    Get.put<MapSelectViewController>(MapSelectViewController());
    MapSelectViewController _controller = Get.find<MapSelectViewController>();
    return Scaffold(
      body: Obx(() {
        if (_controller.mapList.value == null) {
          return Center(
            child: TLoader.Loader(),
          );
        } else {
          return SafeArea(
            child: RefreshIndicator(
              child: ListView(
                children: [
                  _pageTitle(),
                  for (MapData data in _controller.mapList.value!) _mapButton(),
                  _createMapButton(),
                ],
              ),
              onRefresh: () async {
                _controller.getMapList();
              },
            ),
          );
        }
      }),
    );
  }
}

// 페이지 타이틀
Widget _pageTitle() {
  return Column(
    children: [
      Text(
        "지도를 선택하세요!",
        style: TText.style.displaySmall,
      )
    ],
  );
}

// 지도 생성버튼
Widget _createMapButton() {
  return Container(
    padding: const EdgeInsets.all(10),
    child: InkWell(
      onTap: () => Get.to(const MapCreatePage()),
      child: TCard(
          child: Column(
        children: [
          const SizedBox(
            height: 200,
            child: RiveAnimation.asset(
              "images/ani/new_book.riv",
            ),
          ),
          const SizedBox(height: 10),
          Text("새로운 지도를 생성하세요!!", style: TText.style.titleLarge),
        ],
      )),
    ),
  );
}

class _mapButton extends StatelessWidget {
  const _mapButton({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      padding: const EdgeInsets.all(10),
      child: TCard(
        child: Container(
          width: double.infinity,
          child: Slidable(
            endActionPane: ActionPane(
              motion: const ScrollMotion(),
              children: [
                SlidableAction(
                  icon: Icons.ac_unit,
                  label: "test",
                  onPressed: (context) {
                    print("112312");
                  },
                )
              ],
            ),
            child: Container(
              width: double.infinity,
              child: InkWell(
                onTap: () {
                  Slidable.of(context)!.close();
                },
                child: Container(
                  padding: const EdgeInsets.all(10),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        "data",
                        style: TText.style.titleLarge,
                      ),
                      const SizedBox(height: 10),
                      Text(
                        "data",
                        style: TText.style.titleSmall,
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }

以上是使用我的slideable的代码，我在可滑动的内部有一个墨水瓶小部件，当我点击它时，那个滑动应该关闭，但它没有关闭，

═══════= Exception caught by gesture =====
Null check operator used on a null value
═══════= ===============

returns这个错误 }

当我在 listview slidable 中滑动并单击 inkwell 时，slid 应该会关闭，但不会关闭并报错，如何关闭 slide？

Slidable.of(上下文)!.close();

点击后变为空

Slidable.of(上下文)?.close();

不但不能一路做到，还差点成这样

tcard 自定义小部件是

import 'package:flutter/material.dart';

class TCard extends StatelessWidget {
  const TCard({
    Key? key,
    required this.child,
    this.padding = 5,
    this.onTap,
  }) : super(key: key);

  final Widget child;
  final Function()? onTap;
  final double padding;

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: onTap,
      child: Ink(
        padding: EdgeInsets.all(padding),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(5),
          color: Colors.white,
          boxShadow: const [
            BoxShadow(
              color: Colors.grey,
              offset: Offset(1, 2),
              blurRadius: 2,
              spreadRadius: 2,
            ),
          ],
        ),
        child: child,
      ),
    );
  }
}

Answer 1

关于报错，可以在使用前检查null。

或者直接替换

 Slidable.of(context)!.close();

和

 Slidable.of(context)?.close();

如何在 flutter listview 中只制作一张可滑动的幻灯片？

How can I make only one slidable slide in a flutter listview?

flutter

dart

flutter-layout

flutter-getx