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



问题:我点击按钮"做某事",图像似乎无法从"你好"变为"再见"。返回的错误是

"错误:无法将参数类型"Image"分配给参数类型"String"。"。

  • "图像"来自"package:flutter/src/widgets/Image.dart"("../../Development/flutter/packages/flutter/lib/src/widgets/Image.dar"(。return Image.asset(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 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);
}
}
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');
}
}
}

myValue已经是一个图像,因此您不需要从Image.asset再次打开它。此外,还为doSomething()功能添加了来回更改图像的功能

最新更新