如何在Flutter中使用提供程序包更改图像

Question

问题：我单击按钮“做某事”，图像似乎无法从“你好”变为“再见”。返回的错误是

“错误：参数类型'Image'不能分配给参数类型'String'。

• “图像”来自“ package：flutter / src / widgets / image.dart”（“ ../../ Development / flutter / packages / flutter / lib / src / widgets / image.dart”）。 返回Image.asset（myValue）;'

是否可以将String更改为图像，以便它将读取图像并将其显示在屏幕上？

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

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Provider<MyModel>(//                              <--- Provider
      create: (context) => MyModel(),
      child: Consumer<MyModel>( //                           <--- MyModel Consumer
          builder: (context, myModel, child) {
            return ValueListenableProvider<Image>.value( // <--- ValueListenableProvider
              value: myModel.someValue,
              child: MaterialApp(
                home: Scaffold(
                  appBar: AppBar(title: Text('My App')),
                  body: Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[

                      Flexible(
                        child: Container(
                            padding: const EdgeInsets.all(20),
                            color: Colors.green[200],
                            child: Consumer<MyModel>( //       <--- Consumer
                              builder: (context, myModel, child) {
                                return RaisedButton(
                                  child: Text('Do something'),
                                  onPressed: (){
                                    myModel.doSomething();
                                  },
                                );
                              },
                            )
                        ),
                      ),

                      Flexible(
                        child: Container(
                          padding: const EdgeInsets.all(35),
                          color: Colors.blue[200],
                          child: Consumer<Image>(//           <--- String Consumer
                            builder: (context, myValue, child) {
                              return Image.asset(myValue);
                            },
                          ),
                        ),
                      ),

                    ],
                  ),
                ),
              ),
            );
          }),
    );
  }
}

class MyModel { //                                             <--- MyModel
  ValueNotifier<Image> someValue = ValueNotifier(Image.asset('images/hello.png')); // <--- ValueNotifier
  void doSomething() {
    someValue.value = Image.asset('images/goodbye.png');
    print(someValue.value);
  }
}

Answer 1

pg_dump

myValue已经是图像，因此您无需从import 'package:flutter/material.dart'; import 'package:provider/provider.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return Provider<MyModel>( // <--- Provider create: (context) => MyModel(), child: Consumer<MyModel>(// <--- MyModel Consumer builder: (context, myModel, child) { return ValueListenableProvider<Image>.value( // <--- ValueListenableProvider value: myModel.someValue, child: MaterialApp( home: Scaffold( appBar: AppBar(title: Text('My App')), body: Row( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ Flexible( child: Container( padding: const EdgeInsets.all(20), color: Colors.green[200], child: Consumer<MyModel>( // <--- Consumer builder: (context, myModel, child) { return RaisedButton( child: Text('Do something'), onPressed: () { myModel.doSomething(); }, ); }, )), ), Flexible( child: Container( padding: const EdgeInsets.all(35), color: Colors.blue[200], child: Consumer<Image>( // <--- String Consumer builder: (context, myValue, child) { return myValue; // <--- **Change** }, ), ), ), ], ), ), ), ); }), ); } } class MyModel { // <--- MyModel ValueNotifier<Image> someValue = ValueNotifier(Image.asset('images/hello.png')); // <--- ValueNotifier void doSomething() { // <--- **Change** if (someValue.value.toString() == Image.asset('images/hello.png').toString()) { someValue.value = Image.asset('images/goodbye.png'); } else if (someValue.value.toString() == Image.asset('images/goodbye.png').toString()) { someValue.value = Image.asset('images/hello.png'); } } } 重新打开图像，还添加了功能，可以为Image.asset函数来回更改图像