Flutter Taobao App Add to start drawing the simplest implementation

Is not that complicated to talk about problems you might encounter
himself writing and expression levels in general, it may be typos or wrong, please forgive me

Flutter is a mobile cross-platform UI framework, a code to a consistent experience across Android and iOS, but some still need to modify our iOS and Android code to achieve, such as today say start drawing!

Flutter is not enabled by default chart, it is open App interface is a flash of black and white, a good experience App certainly need to start drawing.

Flutter currently use development should be mostly iOS or Android developers, will either Android or iOS will, involving modifications to start drawing, it may look a little ignorant of the force. This article I will teach you to start drawing App Add easiest way, I believe will bring you help!

See complete example

GitHub: Flutter Taobao App

A, iOS start FIG disposed

1, start adding map

First we open the project
to find Assets.xcassets this file
click open +
click New Image Set
to Name the image
and then separately add @ 2x, @ 3x pictures

@ 1x pictures is not required, only need on the iPhone 3GS

2224233-943280108ebbc65e
image

2, the startup FIG.

Xcode has given us the default generated LaunScreen.storyboard, we can modify the startup map through this document.
So the steps in the following figure, to run again, you will find a boot chart is no longer black and white.

Note To modify the image of the Content Mode to Scale To Fill

2224233-cd90593a542b24f3
image

Two, Android FIG set start

1, start adding map

Open the res directory, the path is android / app / src / main / res
will in turn added to the directory you start mipmap map

The pictures are the same size can

2224233-3d51b69b418c03f8
image

Set to start drawing

Opened res directory drawable directory
open launch_background.xml file
add the following code

//这样写可以通过图片铺满整个屏幕,不同屏幕可能会有拉伸
<item android:drawable="@mipmap/launch_image"></item>
2224233-1910c834e74f4bf1
image

Guess you like

Origin blog.csdn.net/weixin_34080571/article/details/90807791