如何从 UI Flutter 中删除元素答案

【问题标题】：How can I remove element from UI Flutter如何从 UI Flutter 中删除元素
【发布时间】：2020-03-28 02:54:57
【问题描述】：

我正在使用图像选择器来选择视频，然后它会显示在我的 UI 上，所以我想从我的屏幕上删除选择的视频缩略图，在选择的视频上有一个红色按钮，当用户点击这个按钮时，视频应该从屏幕上删除.我已经尝试过，但我认为我的功能似乎有问题，这是我的代码

 if (_image != null)
      Stack(
        children: <Widget>[
        Container(
        height: 55,
        width: 60,
          child: Image.memory(_image)),
          Positioned(
          top: -15,
          right: -15,
          child: ClipRRect(
          borderRadius:
          BorderRadius.circular(
          16.0),
          child: IconButton(
          hoverColor: Colors.red,
          icon: Icon(
          Icons.delete,
          color: Colors.red,
          size: 23,
           ),
          onPressed: () =>
             _removeVideo),
           ),
         ),
        ],
        ),

 Future<void> _videoPicker() async {
    if (mounted) {
      final file = await ImagePicker.pickVideo(source: ImageSource.gallery);
      if (file?.path != null) {
        final thumbnail = await _flutterVideoCompress.getThumbnail(
          file.path,
          quality: 50,
          position: -1,
        );

        setState(() {
          _image = thumbnail;
        });

        final resultFile = await _flutterVideoCompress.getThumbnailWithFile(
          file.path,
          quality: 50,
          position: -1,
        );
        debugPrint(resultFile.path);

        assert(resultFile.existsSync());

        debugPrint('file Exists: ${resultFile.existsSync()}');

        final MediaInfo info = await _flutterVideoCompress.compressVideo(
          file.path,
          deleteOrigin: false,
          quality: VideoQuality.LowQuality,
        );
        debugPrint(info.toJson().toString());
      }
    }
  }



 void _removeVideo() {
    setState(() {
      _image = null;
    });
  }

【问题讨论】：

试试Visibility 小部件。因为，我不明白您要做什么，所以我无法帮助您实现小部件。我在这里解释了如何使用它：stackoverflow.com/questions/60798709/…
对不起，我不想隐藏小部件，我想完全删除它。你不明白哪一部分？屏幕上有一个用 image_picker 挑选的视频，所以我把这个视频放在容器中，然后在这个容器上放按钮。当用户单击此按钮时，应从屏幕上删除拾取的视频。这就是我想要的
据我所知，我认为不可能以编程方式做到这一点。做到这一点的唯一方法是隐藏它并将其设置为消失，以便使用 Visibility 小部件显示在屏幕外。另一种方法是将视频放在 ListView.builder 中，然后从 ListView.builder 中删除该项目。您可以使用 sqflite 将项目存储到本地存储或通过 json 从 Web 获取它们。
如何使用上面的代码将视频放入 ListView.builder 中？
网上有很多教程。你只需要谷歌。以下是其中一些：youtube.com/watch?v=TdWhYERuv7g 和 medium.com/@DakshHub/…

标签： flutter video

【解决方案1】：

摆脱 if (_image != null)，尝试跟随

_image == null ? Container(): Stack(
    children: <Widget>[
    Container(
    height: 55,
    width: 60,
      child: Image.memory(_image)),
      Positioned(
      top: -15,
      right: -15,
      child: ClipRRect(
      borderRadius:
      BorderRadius.circular(
      16.0),
      child: IconButton(
      hoverColor: Colors.red,
      icon: Icon(
      Icons.delete,
      color: Colors.red,
      size: 23,
       ),
      onPressed: () =>
         _removeVideo),
       ),
     ),
    ],
    ),

【讨论】：