在屏幕底部的背景图象在振翼app
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了在屏幕底部的背景图象在振翼app相关的知识，希望对你有一定的参考价值。
在我的颤动应用程序中，我正在尝试将背景图像放在屏幕的底部。我已经使用堆栈将背景与我的应用内容分开，并使用扩展容器的列将我的图像推到底部。
不幸的是，这种组合导致我的应用程序崩溃。如果我从背景中删除列，它可以正常工作。所以关于计算布局的事情就失败了。
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Flutter Demo',
theme: new ThemeData(
primarySwatch: Colors.grey,
),
home: Scaffold(
body: Background(),
),
);
}
}
class Background extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Stack(
children: <Widget>[
Column(
children: <Widget>[
Expanded(
child: Container(),
),
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage("assets/background.png"),
fit: BoxFit.fitWidth,
),
),
),
],
),
Center(
child: Text("App content would be here"),
),
],
);
}
}
堆栈跟踪：
flutter: ══╡ EXCEPTION CAUGHT BY SERVICES ╞══════════════════════════════════════════════════════════════════
flutter: The following assertion was thrown resolving an image codec:
flutter: Unable to load asset: assets/background.png
flutter:
flutter: When the exception was thrown, this was the stack:
flutter: #0 PlatformAssetBundle.load (package:flutter/src/services/asset_bundle.dart:221:7)
flutter: <asynchronous suspension>
flutter: #1 AssetBundleImageProvider._loadAsync (package:flutter/src/painting/image_provider.dart:427:44)
flutter: <asynchronous suspension>
flutter: #2 AssetBundleImageProvider.load (package:flutter/src/painting/image_provider.dart:412:14)
flutter: #3 ImageProvider.resolve.<anonymous closure>.<anonymous closure> (package:flutter/src/painting/image_provider.dart:266:86)
flutter: #4 ImageCache.putIfAbsent (package:flutter/src/painting/image_cache.dart:143:20)
flutter: #5 ImageProvider.resolve.<anonymous closure> (package:flutter/src/painting/image_provider.dart:266:63)
flutter: #6 SynchronousFuture.then (package:flutter/src/foundation/synchronous_future.dart:38:29)
flutter: #7 ImageProvider.resolve (package:flutter/src/painting/image_provider.dart:264:30)
flutter: #8 DecorationImagePainter.paint (package:flutter/src/painting/decoration_image.dart:239:55)
flutter: #9 _BoxDecorationPainter._paintBackgroundImage (package:flutter/src/painting/box_decoration.dart:395:19)
flutter: #10 _BoxDecorationPainter.paint (package:flutter/src/painting/box_decoration.dart:413:5)
flutter: #11 RenderDecoratedBox.paint (package:flutter/src/rendering/proxy_box.dart:1876:16)
flutter: #12 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2024:7)
flutter: #13 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:131:13)
flutter: #14 _RenderFlex&RenderBox&ContainerRenderObjectMixin&RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2222:15)
flutter: #15 RenderFlex.paint (package:flutter/src/rendering/flex.dart:931:7)
flutter: #16 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2024:7)
flutter: #17 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:131:13)
flutter: #18 _RenderStack&RenderBox&ContainerRenderObjectMixin&RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2222:15)
flutter: #19 RenderStack.paintStack (package:flutter/src/rendering/stack.dart:604:5)
flutter: #20 RenderStack.paint (package:flutter/src/rendering/stack.dart:612:7)
flutter: #21 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2024:7)
flutter: #22 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:131:13)
flutter: #23 _RenderCustomMultiChildLayoutBox&RenderBox&ContainerRenderObjectMixin&RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2222:15)
flutter: #24 RenderCustomMultiChildLayoutBox.paint (package:flutter/src/rendering/custom_layout.dart:360:5)
flutter: #25 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2024:7)
flutter: #26 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:131:13)
flutter: #27 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:127:15)
flutter: #28 _RenderInkFeatures.paint (package:flutter/src/material/material.dart:456:11)
flutter: #29 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2024:7)
flutter: #30 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:131:13)
flutter: #31 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:127:15)
flutter: #32 RenderPhysicalModel.paint (package:flutter/src/rendering/proxy_box.dart:1644:15)
flutter: #33 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2024:7)
flutter: #34 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:131:13)
flutter: #35 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:127:15)
flutter: #36 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2024:7)
flutter: #37 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:131:13)
flutter: #38 _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:127:15)
flutter: #39 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2024:7)
flutter: #40 PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:111:11)
flutter: #41 PipelineOwner.flushPaint (package:flutter/src/rendering/object.dart:791:29)
flutter: #42 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:272:19)
flutter: #43 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&RendererBinding&WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:627:13)
flutter: #44 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:208:5)
flutter: #45 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:990:15)
flutter: #46 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:930:9)
flutter: #47 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:842:5)
flutter: #48 _invoke (dart:ui/hooks.dart:120:13)
flutter: #49 _drawFrame (dart:ui/hooks.dart:109:3)
flutter:
flutter: Image provider: AssetImage(bundle: null, name: "assets/background.png")
flutter: Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#3853b(), name: "assets/background.png",
flutter: scale: 1.0)
flutter: ════════════════════════════════════════════════════════════════════════════════════════════════════
Error -32000 received from application: Server error
有什么建议？这对Flutter来说是不可能的布局请求吗？
答案
你可以直接使用Image.asset和alignment: Alignment.bottomCenter
Stack(
children: <Widget>[
Positioned.fill(
child: Image.asset(
"assets/background.jpg",
fit: BoxFit.fitWidth,
alignment: Alignment.bottomLeft,
),
),
Center(
child: Text("App content would be here"),
)
],
);
以上是关于在屏幕底部的背景图象在振翼app的主要内容，如果未能解决你的问题，请参考以下文章