二 Flutter开发实战高仿微信发现页 _微信开发

开发实战高仿微信（二）发现页1.2.4 添加依赖1.2.5 新建四个主页对应四个 1.3 发现页面布局 2.知识点 2.2 基本组件3.深入研究
开发实战高仿微信（二）发现页 1.1 微信发现页面简述在上一篇《开发微信之一》中讲解了项目框架的简单搭建，整个APP分为四个：微信，通讯录，发现，我。其中发现是最简单一个页面，先从最容易的页面入手，实现发现页面主页搭建。1.2 APP框架优化 1.2.1 配置APP Logo和启动图片 IOS 启动图片配置
启动图片配置
1.2.2 配置资源图片
项目资源在.yaml中配置
在代码中使用图片资源的方式：
不同分辨率的图片使用
跟的多图片适配相同，将不同分辨率下的图片放到对应的目录即可，如下：
使用代码：
new Image.asset("assets/images/a.png");
在项目中加载资源的两种方式：
import 'package:flutter/services.dart';Widget _createBody() {return new FutureBuilder(future: rootBundle.loadString('assets/a.json'),builder: (context,snapshot){if(snapshot.hasData) {return new Text(snapshot.data.toString());}},);
import 'package:flutter/services.dart';Widget _createBody() {return new FutureBuilder(future: DefaultAssetBundle.of(context).loadString('assets/a.json'),builder: (context,snapshot){if(snapshot.hasData) {return new Text(snapshot.data.toString());}},);
1.2.3 配置其他资源 1.2.3.1资源配置
新建一个.dart文件，比如.dart:
import 'package:flutter/material.dart';class UIData {//routes页面路径static const String homeRoute = "/home";static const String profileOneRoute = "/View Profile";static const String profileTwoRoute = "/Profile 2";//stringsstatic const String appName = "Flutter UIKit";//fonts字体相关static const String quickFont = "Quicksand";static const String ralewayFont = "Raleway";static const String quickBoldFont = "Quicksand_Bold.otf";static const String quickNormalFont = "Quicksand_Book.otf";static const String quickLightFont = "Quicksand_Light.otf";//imagesstatic const String imageDir = "assets/images";static const String pkImage = "$imageDir/pk.jpg";//login比如登录页面用到的文本static const String enter_code_label = "Phone Number";static const String enter_code_hint = "10 Digit Phone Number";//gneric 通用的文本static const String error = "Error";static const String success = "Success";static const MaterialColor ui_kit_color = Colors.grey;//colorsstatic List kitGradients = [// new Color.fromRGBO(103, 218, 255, 1.0),// new Color.fromRGBO(3, 169, 244, 1.0),// new Color.fromRGBO(0, 122, 193, 1.0),Colors.blueGrey.shade800,Colors.black87,];static List kitGradients2 = [Colors.cyan.shade600,Colors.blue.shade900];//randomcolorstatic final Random _random = new Random();/// Returns a random color.static Color next() {return new Color(0xFF000000 + _random.nextInt(0x00FFFFFF));}}
1.2.3.2 国际化
详情参考：国际化官方教程
1.2.4 添加依赖
在.yaml 中添加依赖
注意，只有在添加平台所需相关依赖时，才需要去工程中的中添加依赖。
1.2.5 新建四个主页对应四个 1.3 发现页面布局 2.知识点 2.1 布局 2.1.1 Row 水平布局简介
flex水平布局控件，能够将子控件水平排列，是基于Web的的布局模式设计的。
Row子控件有灵活与不灵活的两种，Row首先列出不灵活的子控件，减去它们的总宽度，计算还有多少可用的空间。然后Row按照.flex属性确定的比例在可用空间中列出灵活的子控件。要控制灵活子控件，需要使用控件。
注意该控件不支持滑动，如果子控件超过剩余空间，会报错，如果想支持水平滑动，考虑使用。