Image 即使在pubspec.yaml flatter中指定了资源,图像也不会显示在GridView中
我现在正在开发一个菜单亭应用程序,在我的应用程序中加载图像时遇到一些问题,我确保在我的pubspec.yaml中指定每个图像,但图像仍然不显示。我得到的错误是:Image 即使在pubspec.yaml flatter中指定了资源,图像也不会显示在GridView中,image,flutter,dart,Image,Flutter,Dart,我现在正在开发一个菜单亭应用程序,在我的应用程序中加载图像时遇到一些问题,我确保在我的pubspec.yaml中指定每个图像,但图像仍然不显示。我得到的错误是: ════════ 图像资源服务捕获到异常════════════════════════════ 无法加载资源:带有Choco Dip.png的资源/图像/侧甜点/勺 ════════════════════════════════════════════════════════════════════════════════ 这是我的
════════ 图像资源服务捕获到异常════════════════════════════
无法加载资源:带有Choco Dip.png的资源/图像/侧甜点/勺
════════════════════════════════════════════════════════════════════════════════代码>
这是我的pubspec.yaml包含的内容
# To add assets to your application, add an assets section, like this:
assets:
- assets/images/
- assets/images/sideNav/
#pizza assets
- assets/images/pizza/Hawaiian Overload.png
- assets/images/pizza/Bacon Overload.png
- assets/images/pizza/All In Overload.png
- assets/images/pizza/All Beef Overload.png
- assets/images/pizza/hamandCheese.png
- assets/images/pizza/Peperroni Classic.png
- assets/images/pizza/veggies_cheesedouble.png
- assets/images/pizza/Ham Pineapple Classic.png
- assets/images/pizza/Cheese Classic.png
#barkada assets
- assets/images/barkada/Barkada Bundle A.png
- assets/images/barkada/Barkada Bundle B.png
- assets/images/barkada/Barkada Bundle C.png
#chicken assets
- assets/images/chicken/1pc Chicken with Rice.png
- assets/images/chicken/2pc Chicken Meal with Rice.png
- assets/images/chicken/Chicken Waves.png
#combo assets
- assets/images/combo/Carbonara Chicken Combo.png
- assets/images/combo/Creamy Bacon Carbonara Value Meal.png
- assets/images/combo/Lasagna Chicken Combo.png
- assets/images/combo/Lasagna Supreme Value Meal.png
- assets/images/combo/Meaty Spaghetti Chicken Combo.png
- assets/images/combo/Meaty Spaghetti Value Meal.png
- assets/images/combo/Pizza Value Meal A.png
- assets/images/combo/Pizza Value Meal B.png
- assets/images/combo/Pizza Value Meal C.png
- assets/images/combo/Pizza Loaded Combo D.png
- assets/images/combo/Pizza Loaded Combo E.png
#drink assets
- assets/images/drinks/Choco Slush.png
- assets/images/drinks/coke pitcher.png
- assets/images/drinks/Coke Zero.png
- assets/images/drinks/Coke.png
- assets/images/drinks/Coke Glass.png
- assets/images/drinks/Ice Tea.png
- assets/images/drinks/Nestea Glass.png
- assets/images/drinks/Nestea Pitcher.png
- assets/images/drinks/PJ Pitcher.png
- assets/images/drinks/Pj.png
- assets/images/drinks/Sprite.png
#pasta assets
- assets/images/pasta/Lasagna Supreme Ala Carte.png
- assets/images/pasta/Meaty Spaghetti Ala Carte.png
- assets/images/pasta/Creamy Bacon Carbonara Ala Carte.png
- assets/images/pasta/Lasagna Supreme Large Pan.png
- assets/images/pasta/Meaty Spaghetti Large Pan.png
- assets/images/pasta/Creamy Bacon Carbonara Pan.png
- assets/images/pasta/Lasagna Supreme Pan.png
- assets/images/pasta/Meaty Spaghetti Regular Pan.png
- assets/images/pasta/Creamy Bacon Carbonara Regular Pan.png
#sides Desserts assets
- assets/images/sideDesserts/Regular Potato Waves.png
- assets/images/sideDesserts/Cheesy Bread Sticks with Dip.png
- assets/images/sideDesserts/Dippers with Choco Dip.png
- assets/images/sideDesserts/Large Potato Waves.png
- assets/images/sideDesserts/Plain Rice.png
#logos
- assets/images/Logos/box Logo.png
- assets/images/Logos/long logo.png
我还为不同的菜单类型创建了自定义静态列表模型,例如:
class BarkadaData {
String name;
String imagePath;
double price;
BarkadaData({this.imagePath, this.name, this.price});
static List<BarkadaData> barkadaList = [
BarkadaData(
name: 'Barkada Bundle A (for 3)',
price: 469.00,
imagePath: 'assets/images/barkada/Barkada Bundle A.png'),
BarkadaData(
name: 'Barkada Bundle B (for 4)',
price: 569.00,
imagePath: 'assets/images/barkada/Barkada Bundle B.png'),
BarkadaData(
name: 'Barkada Bundle C (for 6)',
price: 969.00,
imagePath: 'assets/images/barkada/Barkada Bundle C.png'),
];
}
类数据{
字符串名;
字符串图像路径;
双倍价格;
BarkadaData({this.imagePath,this.name,this.price});
静态列表BAKADALIST=[
巴卡达数据(
名称:'Barkada捆绑包A(用于3)',
价格:469.00,
imagePath:'assets/images/barkada/barkada Bundle A.png'),
巴卡达数据(
名称:'Barkada束B(用于4)',
价格:569.00,
imagePath:'assets/images/barkada/barkada Bundle B.png'),
巴卡达数据(
名称:“Barkada捆绑包C(用于6)”,
价格:969.00,
imagePath:'assets/images/barkada/barkada Bundle C.png'),
];
}
最后,我使用GridView.builder显示它。我的小部件树如下所示:
Container(
width: MediaQuery.of(context).size.width * .75,
child: GridView.builder(
itemCount: barkadaList.length,
gridDelegate:
SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3),
itemBuilder: (BuildContext context, int index) {
return InkWell(
onTap: () {
print(barkadaList[index].name);
},
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Stack(
children: <Widget>[
Container(
width: MediaQuery.of(context).size.width *
.22,
child: Image(
image: AssetImage(
barkadaList[index].imagePath),
),
),
Text(
'${barkadaList[index].name}',
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 18),
textAlign: TextAlign.center,
)
],
),
),
);
},
),
)
容器(
宽度:MediaQuery.of(context).size.width*.75,
子项:GridView.builder(
itemCount:barkadaList.length,
gridDelegate:
SliverGridDelegateWithFixedCrossAxisCount(
交叉轴计数:3),
itemBuilder:(构建上下文,int索引){
回墨槽(
onTap:(){
打印(barkadaList[index].name);
},
孩子:填充(
填充:常数边集全部(8.0),
子:堆栈(
儿童:[
容器(
宽度:MediaQuery.of(上下文).size.width*
.22,
孩子:图像(
图片:资产评估(
barkadaList[index].imagePath),
),
),
正文(
“${barkadaList[index].name}”,
样式:TextStyle(
fontWeight:fontWeight.w600,
尺寸:18),,
textAlign:textAlign.center,
)
],
),
),
);
},
),
)
如您所见,gridview.builder之所以能够工作,是因为显示的是名称,而不是图像。任何帮助都将不胜感激重命名您的图像。您的图像名称有空格。在android图像中,不加载空间名称。因此,将你的图像名称用巧克力蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸蘸
从
到
非常感谢你!iOS的约定相同吗?如果有空格,资产是否不会加载?IOS可以支持带“”的图像名称。因此,对于这两种操作系统支持,请使用带有“”的名称。注意:IOS也支持带有特殊字符的图像名称,但android不支持。
- assets/images/barkada/Barkada Bundle A.png
- 'assets/images/barkada/Barkada Bundle A.png'