Question

我想开发一个滑块来立即调整图像的亮度。就像想要Instagram一样。

在调整亮度后，我采用了StreamBuilder来检索图像。但是当我移动滑块时，图像始终显示图像->黑色->图像->黑色。而且滑块很滞后，在我移动时继续跳跃。

显示图像代码：

child: StreamBuilder(
    stream: _imageRefresher.imageRefreshStream,
    initialData: widget.post.imagesFileList[0].imageFile,
    builder: (context, snap) {
      return PageView.builder(
        controller: PageController(
            initialPage: 0
        ),
        scrollDirection: Axis.horizontal,
        itemCount: widget.post.imagesFileList.length,

        onPageChanged: (index) {
          setState(() {
            listIndex = index;
            print(listIndex);
          });
        },
        itemBuilder: (BuildContext context, int index) {
          return Hero(
            tag: 'heroFeatured$index',
            child: Container(
              decoration: new BoxDecoration(
                image: new DecorationImage(
                    fit: BoxFit.cover,
                    image: FileImage(snap.data)
                ),
              ),
            ),
          );
        },
      );
    }
)

滑子代码：

child:Slider(
  label: 'Brightness',
  min: -100,
  max: 100,
  value: widget.post.imagesFileList[listIndex].brightness,
  onChanged: (value) {
    print(value);
    setState(() {
      widget.post.imagesFileList[listIndex].brightness = value;
    });
    _imageRefresher.updatePicutre(widget.post.imagesFileList[listIndex].imagePath, value);
    //updatePicutre(widget.post.imagesFileList[listIndex].brightness, value);

  },
),

StreamController代码：

class ImageRefresher {
  StreamController<File> _controller;
  final File imageFile;

  ImageRefresher({this.imageFile}){
    _controller = StreamController();
  }

  Stream<File> get imageRefreshStream => _controller.stream;


  void updatePicutre(String imagePath, double brightness)  async{
    File f = await FlutterNativeImage.adjustBrightness(imagePath, brightness);
    _controller.sink.add(f);
  }

  dispose() {
    _controller.close();
  }

}

Answer 1

我认为 StreamBuildier 不是为了支持图片更新而设计的。查看 Flutter dev 的 Texture 类，它可能更适合于此。 https://api.flutter.dev/flutter/widgets/Texture-class.html

滑块加载时抖动加载图像

1 个答案: