flutter进阶与提升

1，图片的使用

加载图片：当根目录新建一个文件，命门随意，本处于image为例，而后在下面能够放图片，由于移动端屏墓大小不一样，图片大小不一样，能够在建一个倍率大小的相同名字文件，用于适配

节构以下：

      image文件夹

    　　2.0文件夹

　　　xx.jpg

　　 xxx1.jpg　　

而后在pubspes.yaml 文件图片配置那儿引用：第三37行，user_materia;-design:true 下面有关于图片资源配团置， 

    　　assets:

　　　　- images/xx.jpg

　　　　- image/xxx1.fpg

对于图片太多，能够不给文件名真接:- image/  表示所有导入，

为了演示，咱们首先建二个文件，一个入口主程序，进入后用生命周期加载后自动跳转到另外一个路由的方法来演示：

主路由代码：

import 'package:flutter/material.dart'

import 'images.dart'   / /导入另外一个路由的界面

 

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

class MyApp extends StatelesWidget{

@override

Widget build(BuildContext context){

　　return new MaterialApp(

　　home: new MyHomePage(titile:'Flutter Demo Home Page'),

　　routes:<String,WidgetBuilder>{       //定义路由

　　　　'imagepage' :(BuildContext context)=>new ImagePage(),

},

initialroute:  ' imagepage',  初使化时进入路由

 

)

}

}  //本代码是在浏览器打，为了练指法，只是示意，没有效验单词，红色标记为重点

 

 

新建一个文件存放imagepape代码：

 

class MyApp extends StatelesWidget{

@override

Widget build(BuildContext context){

　　return new scaffold(

　　　　appBar:appBar(

　　　　　　title:text("imagepage")

        )

　　　　　　body: new listView(   //  listview  控件，在他指定的方法列表布局，

　　　　　　children:<Widget>[

　　　　　　　　//图片调用网络，本地，调用方法不同，大约为为network file  assetImage等图片，这儿先于资源文件assetImage调用为例：

　　　　　　new Image(image:AssetImage('image/xxxx.jpg'))　　 //new一张图片

           　　　//　在于本地加载方法加载一张图片：并在图片后面直接加属性来操做样式：

　　　　　　Image.asset(''image/xxx.jpg，

　　　　　　　　width:200.0, // 宽

　　　　　　　　height 150.0,   //长

　　　　　　　　colorBlendMode:BlendMode.colorBurn,  //混合色，须要与　color属性混合，

　　　　　　　　color: 　Colors.green   // 色度

　　　　　　　　repeat: ImageRepeat.noRepeat   //重复

　　　　　　　　Directionality   //方向

　　　　　　　　centerSlice,  //中心缩放

　　　　　　　　matchTextDirection //  镜向  ，须要与方向配合　　

　　　　　　　　gaplessPlayback=false   切换图片时过分　

 

                    )，

　　　　　　　 下面是有关图片设置的方法　　

　　　　　　　 读取本地文件　，这儿须要导入io包

　　　　　　　还要配置权限：

　　　　　　　　　　android -> app->src->main - >AndroidManiFest.xml 第六行下面加入：网络权限也默认有，只需增长本地权限：

　　　　　　　　　　<user-permission androin:name="android.permission.INTERNET">

　　　　　　　　　　<user-permission android:name="andrid.permission.READ__EXTERNAL_STORAGE">

　　　　　　　　　　　　　　　　

　　　　　　　　　　

　　　　　　　　　　　　　　　　　　　　

　　　　　　　　　　　　　

                            import 'dart:io';

　　　　　　　　Image.file(new file: '/storage/emulated/0/Download/')　

　　　　　　　　网络请求图片：　　

　　　　　　　　Image.network('www.baidu.com/xxxx/sss.jpg')

　　　　　　　　

　　　　　

　　　　　

 

 

]

         )

）

}

}