Controller

  Controller层属于业务后台对前端的api入口。
主要职责：

数据校验。
数据转换。
根据实际业务需要，合理调度系统内部的业务模块。
业务路由。
鉴权、授权。




Service

  Service主要任务就是将各种业务按照大的模块进行分类、集成，对外可以完成一个业务完备的可独立部署的业务单元，在某些系统中，Service又被称为子系统或者某某系统。比如权限中心、资产中心、账单中心、订单中心等。Service在系统中以可独立部署的集群服务形式存在。不同Service之间的数据是可以独立存在的。

Business

  Business对于传统的单war项目中的Service层，即业务逻辑层。这一层可以根据实际业务需要，与Service层集中部署，也可以独立部署。多个领域对象模型在这里被系统计算、转化、提取。这一层中，信息是核心，我们将会面向有价值的业务信息展开相关的开发。

Data

  Data既可以对应到传统的单war结构的dao层，也可以应到大型分布式系统中的数据分析层。在这里，数据将被存储、转化、提取、分析。这一层的核心是业务无关的数据的王国。

1 Access Layer
1.1 Overview




Layout
Description
Base Package
Base url




User background
用户后台接入层
com.xtwj.dragon.api.user
http://127.0.0.1:18000:/api


Enterprise background
企业后台接入层
com.xtwj.dragon.api.ent
http://127.0.0.1:18001:/api


Operation background
运营应用接入层
com.xtwj.dragon.api.ops
http://127.0.0.1:18002:/api


1.2 Resources Map




Resources
Description
url
Handle
Input
Output




Order
订单
/orders
OrderController
OrderAI
OrderAO


Role
角色
/roles
RoleController
RoleAI
RoleAO


1.3 Package layout




Item
package
Description




OrderController
controller



OrderAI
ai
-


OrderAO
ao
-


1.4 Layer Associate




Item
Layer
Associate
Input
Output
Description




OrderController
Service
OrderService
OrderSI
OrderSO
-


OrderController
Service
UserService
UserSI
UserSO
-


OrderController
Service
CommodityService
CommoditySI
CommoditySO
-


OrderController
Service
LogisticsService
LogisticsSI
LogisticsSO
-


2 Service Layer
2.1 Overview




Element
Interface
Implement
Input
Output
Base Package
Description




Order
OrderService
OrderServiceImpl
OrderSI
OrderSO
com.xtwj.dragon.service
订单


2.2 Package layout




Item
package
Description




OrderService
spec
-


OrderServiceImpl
impl
-


OrderSI
si
-


OrderSO
so
-


2.3 Layer Associate




Item
Layer
Associate
Input
Output
Description




OrderServiceImpl
Business
OrderBusiness
OrderBI
OrderBO
-


3 Business Layer
3.1 Overview




Element
Interface
Implement
Input
Output
Base Package
Description




Order
OrderBusiness
OrderBusinessImpl
OrderBI
OrderBO
com.xtwj.dragon.business
订单


3.2 Package layout




Item
package
Description




OrderBusiness
spec
-


OrderBusinessImpl
impl
-


OrderBI
bi
-


OrderBO
bo
-


3.3 Layer Associate




Item
Layer
Associate
Input
Output
Description




OrderServiceImpl
Repository
OrderRepository
OrderDI
OrderDO
-


4 Repository Layer
3.1 Overview




Element
Interface
Implement
Input
Output
Base Package
Description




Order
OrderRepository
-
OrderRI
OrderRO
com.xtwj.dragon.service
订单


3.2 Package layout




Item
package
Description




OrderRepository
spec
-


OrderRI
ri
-


OrderRO
ro
-

使用 jq easy ui 首先需要在文档头目引入相应的css ,jq文件`

引入顺序按照如下代码：
  <link href="css/themes/default/easyui.css" rel="stylesheet" type="text/css" />
   <link href="css/themes/default/easyui.css" rel="stylesheet" type="text/css" />
   <script src="jq/jquery.min.js" type="text/javascript"></script>
    <script src="jq/jquery.easyui.min.js" type="text/javascript"></script> 

lay out 布局就是在一个div中添加一个class属性为 easyui-layout 在div的内部有可分为 west :左 ,north:上 ,east:右,south:上  center:中区域

其中:center中心区域 必须有
例如：`
<div data-options="region:'north'" style="height:50px">上端内容</div>
		<div data-options="region:'south',title:'south',collapsible:false,split:true" style="height:50px;"> 下端内容</div>
        <div data-options="region:'west',title:'菜单导航栏',collapsible:false,split:true" style="height:50px; width:200px;"> 
        
        </div>
		<div data-options="region:'center',title:'Main Title',iconCls:'icon-ok'" style="padding:10px">中间内容</div>

以下属性用法如下：

布局选项（Layout Options）

名称	类型	描述	默认值

fit	boolean	当设置为 true 时，就设置布局（layout）的尺寸适应它的父容器。当在 ‘body’ 标签上创建布局（layout）时，它将自动最大化到整个页面的全部尺寸。	false
区域面板选项（Region Panel Options）

区域面板选项（Region Panel Options）是定义在面板（panel）组件中，下面是一些共同的和新增的属性：

名称	类型	描述	默认值

title	string	布局面板（layout panel）的标题文本。	null

region	string	定义布局面板（layout panel）的位置，其值是下列之一：north、south、east、west、center。	

border	boolean	当设置为 true 时，就显示布局面板（layout panel）的边框。	true

split	boolean	当设置为 true 时，就显示拆分栏，用户可以用它改变面板（panel）的尺寸。	false

iconCls	string	在面板（panel）头部显示一个图标的 CSS class。	null

href	string	从远程站点加载数据的 URL 。	null

collapsible	boolean	定义是否显示可折叠按钮。	true

minWidth	number	面板（panel）最小宽度。	10

minHeight	number	面板（panel）最小高度。	10

maxWidth	number	面板（panel）最大宽度。	10000

maxHeight	number	面板（panel）最大高度。	10000

方法

名称	参数	描述

resize	none	设置布局（layout）的尺寸。

panel	region	返回指定的面板（panel），‘region’ 参数可能的值是：‘north’、‘south’、‘east’、‘west’、‘center’。

collapse	region	折叠指定的面板（panel），‘region’ 参数可能的值是：‘north’、‘south’、‘east’、‘west’。

expand	region	展开指定的面板（panel），‘region’ 参数可能的值是：‘north’、‘south’、‘east’、‘west’。

add	options	添加一个指定的面板（panel），options 参数一个配置对象，更多细节请参阅标签页面板（tab panel）属性。

remove	region	移除指定的面板（panel），‘region’ 参数可能的值：‘north’、‘south’、‘east’、‘west’。

各方法例子如下：

1、添加删除区域
	function addPanel(){
			var region = $('#region').val();
			var options = {
				region: region
			};
			if (region=='north' || region=='south'){
				options.height = 50;
			} else {
				options.width = 100;
				options.split = true;
				options.title = $('#region option:selected').text();
			}
			$('#cc').layout('add', options);
		}
		function removePanel(){
			$('#cc').layout('remove', $('#region').val());
		}

2、自适应高度
<h2>Auto Height for Layout</h2>
	<p>This example shows how to auto adjust layout height after dynamically adding items.</p>
	<div style="margin:20px 0;">
		<a href="javascript:void(0)" class="easyui-linkbutton" onclick="addItem()">Add Item</a>
		<a href="javascript:void(0)" class="easyui-linkbutton" onclick="removeItem()">Remove Item</a>
	</div>
	<div id="cc" style="width:700px;height:350px;">
		<div data-options="region:'north'" style="height:50px"></div>
		<div data-options="region:'south'" style="height:50px;"></div>
		<div data-options="region:'west'" style="width:150px;"></div>
		<div data-options="region:'center'" style="padding:20px">
			<p>Panel Content.</p>
			<p>Panel Content.</p>
			<p>Panel Content.</p>
			<p>Panel Content.</p>
			<p>Panel Content.</p>
		</div>
	</div>
	<script type="text/javascript">
		$(function(){
			$('#cc').layout();
			setHeight();
		});
		
		function addItem(){
			$('#cc').layout('panel','center').append('<p>More Panel Content.</p>');
			setHeight();
		}
		
		function removeItem(){
			$('#cc').layout('panel','center').find('p:last').remove();
			setHeight();
		}
		
		function setHeight(){
			var c = $('#cc');
			var p = c.layout('panel','center');	// get the center panel
			var oldHeight = p.panel('panel').outerHeight();
			p.panel('resize', {height:'auto'});
			var newHeight = p.panel('panel').outerHeight();
			c.layout('resize',{
				height: (c.height() + newHeight - oldHeight)
			});
		}
	</script>

 

<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">今天我们讲到了UIViewController，然后就提到了一个横屏和竖屏的时候视图变化问题，刚开始我们学的是一个比较传统的方法，通过判断屏幕当前的状态然后在对view进行重新的调整。在学习的过程中，翔哥又给我们提到了一种新的方法VFL,并且用代码简单的实现了一下，然而并不是很懂。。。然后就自己在网上找了多篇对VFL的使用，不过都不是很明了。然后就自己就总结实践了一下，下面说一下我自己的使用方法。</span>

 

1.先创建两个类，LoginViewController和LoginView，父类分别是UIViewController和UIView。然后将LoginView挂到LoginViewController上。然后再LoginView中添加两个UILabel属性

2.当屏幕旋转的时候视图控制器会向他下面的LoginView发送一个消息，让视图进行重新布局。

3.在LoginView中对View重新布局

 

- (void)layoutSubviews
{
    [self addConstraints:(NSArray *)];
}

 

 

从上面的布局方法中可以看到addConstraints:(NSArray *)需要一个NSArray类型的参数。而下面的方法返回类型正好是NSArray。所以就必须先了解下面的方法：

 

NSLayoutConstraint经常使用的一个方法

+ (NSArray *)constraintsWithVisualFormat:(NSString *)format options:(NSLayoutFormatOptions)opts metrics:(NSDictionary *)metrics views:(NSDictionary *)views;

参数介绍：

format：字符串类型的。主要是用来约束屏幕在横竖的时候控件或view的位置尺寸的

opts:默认参数，默认写0；具体根据自己想实现的要求去选择枚举值

metrics：是一个字典，里面主要写一些format字符串中要使用到的参数。系统会自动的将format字符串中的参数  在metrics字典中查找和参数名相同的key值，然后使用key值对应得value值。如果，你使用metrics这个字典了，就必须保证format字符串能在里面找到这个key值，否则会报错。

views：又是一个字典。这里面是VFL中所有使用到的view。

 

对format字符串中的格式做一个了解

 

功能　　　　　　　　表达式

水平方向  　　　　　　  H:

垂直方向  　　　　　　  V:

Views　　　　　　　　 [view]

SuperView　　　　　　|

关系　　　　　　　　　>=,==,<=

空间,间隙　　　　　　　-

优先级　　　　　　　　@value

代码实现：

在LoginView中添加两个UILabel属性，记得释放哦

 

#import <UIKit/UIKit.h>

@interface LoginView : UIView

@property (nonatomic , retain) UILabel *firstLabel;
@property (nonatomic , retain) UILabel *secLabel;

@end

 

 

在LoginView.m中进行实现：

第一种情况：

1.LoginView中只添加一个控件的时候，我们将firstLabel添加上去

 

 

// 布局视图
- (void)addSubviews
{
    // 设置背景颜色
    self.backgroundColor = [UIColor cyanColor];
    
    // 添加firstLabel
    self.firstLabel = [[UILabel alloc] initWithFrame:CGRectMake(50, 100, 200, 30)];
    self.firstLabel.layer.borderWidth = 1;
    self.firstLabel.layer.borderColor = [[UIColor lightGrayColor] CGColor];
    self.firstLabel.layer.cornerRadius = 5;
    self.firstLabel.text = @"点我";
    self.firstLabel.textAlignment = NSTextAlignmentCenter;
    
    [self addSubview:self.firstLabel];
    [self.firstLabel release];

}


#pragma mark - 屏幕旋转方法的实现
- (void)layoutSubviews
{
    
    UILabel *fl = self.firstLabel;
    
    fl.translatesAutoresizingMaskIntoConstraints = NO;// 这个必须写否则下面的约束方法不起作用
  
    //firstLabel控件约束
    // 水平方向上的约束
    [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-50-[fl]-50-|" options:0 metrics:nil views:@{@"fl":fl}]];
    //垂直方向上的约束
    [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-100-[fl(==30)]" options:0 metrics:nil views:@{@"fl":fl}]];
      
}

对约束方法解析：

 

<span style="color:#ff0000;">@"H:|-50-[fl]-50-|"</span><span style="color: rgb(37, 37, 37); font-family: 'Helvetica Neue', Helvetica, STheiti, 微软雅黑, 黑体, Arial, Tahoma, sans-serif, serif; line-height: 25px; background-color: rgb(250, 250, 250);"><span style="font-size:12px;">其中"H:"是表示这是水平方向上的约束，"|"是表示superView，"-"表示一个间隔空间，这个间隔如果是和superView之间的，那么就是20px,如果是两个同级别的view，比如@"[label]-[label1]"，那么这里表示的是8px.</span></span>

<span style="color:#ff0000;">@"V:|-100-[fl(==30)]"</span><span style="font-family: 'Helvetica Neue', Helvetica, STheiti, 微软雅黑, 黑体, Arial, Tahoma, sans-serif, serif; line-height: 25px;"><span style="font-size:12px;"><span style="color:#252525;"><span style="background-color: rgb(250, 250, 250);">其中"V:"中代表这是垂直方向上的约束,"|-100-"这里的意思就是距离头部为100px，相当于y坐标为100。后面的"[fl</span></span></span></span><span style="color: rgb(37, 37, 37); line-height: 25px; font-family: 'Helvetica Neue', Helvetica, STheiti, 微软雅黑, 黑体, Arial, Tahoma, sans-serif, serif; background-color: rgb(250, 250, 250);">(==30)]"，是指定这个label的高度为30px.y坐标固定了，高度固定了，那这个view的约束就完成了。如果你有需要，你的高度值（或者其他同类型的）可以使用>=,==,<=来表示，甚至你可以组合来用，像上面的30</span>

 

运行结果对比：



 

2.LoginView中有2个控件，也可以由多个控件，上代码：

 

// 布局视图
- (void)addSubviews
{
    // 设置背景颜色
    self.backgroundColor = [UIColor cyanColor];
    
    // 添加firstLabel
    self.firstLabel = [[UILabel alloc] initWithFrame:CGRectMake(50, 100, 200, 30)];
    self.firstLabel.layer.borderWidth = 1;
    self.firstLabel.layer.borderColor = [[UIColor lightGrayColor] CGColor];
    self.firstLabel.layer.cornerRadius = 5;
    self.firstLabel.text = @"点我";
    self.firstLabel.textAlignment = NSTextAlignmentCenter;
    
    [self addSubview:self.firstLabel];
    [self.firstLabel release];
    
    // 添加secLabel
    self.secLabel = [[UILabel alloc] initWithFrame:CGRectMake(50, 150, 200, 30)];
    self.secLabel.layer.borderWidth = 1;
    self.secLabel.layer.borderColor = [[UIColor lightGrayColor] CGColor];
    self.secLabel.layer.cornerRadius = 5;
    
    self.secLabel.text = @"使劲点";
    self.secLabel.textAlignment = NSTextAlignmentCenter;
    [self addSubview:self.secLabel ];
    [self.secLabel  release];
    
    
    
}


#pragma mark - 屏幕旋转方法的实现
- (void)layoutSubviews
{
    // 拿到两个控件
    UILabel *fl = self.firstLabel;
    UILabel *sl = self.secLabel;
    
    fl.translatesAutoresizingMaskIntoConstraints = NO;// 这个必须写否则下面的约束方法不起作用
    sl.translatesAutoresizingMaskIntoConstraints = NO;
    
    // metrics参数 和 views参数
    NSDictionary *metrics = @{@"Height":@30 , @"Width":@200};
    NSDictionary *views = NSDictionaryOfVariableBindings(fl,sl);
    
    //firstLabel控件约束
    // 水平方向上的约束
    [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-50-[fl]-50-|" options:0 metrics:metrics views:views]];
    //垂直方向上的约束
    [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:<span style="color:#ff6666;">@"V:|-100-[fl(==Height)]"</span> options:0 metrics:metrics views:views]];
    
    
    // secLabel约束
    // 水平约束
    [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:<span style="color:#ff6666;">@"H:|-50-[sl(==fl)]"</span> options:0 metrics:metrics views:views]];
    // 垂直约束
    [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:<span style="color:#ff6666;">@"V:[fl]-30-[sl(==fl)]"</span> options:0 metrics:metrics views:views]];
    
}

 


 

 

 

当两个控件时，我们可以像添加第一个控件时把第二个控件添加上去；同时也可以把第一个控件作为参照添加第二个控件，上面的方法就是把第一个控件作为参照，对控件重新布局；

首先看一下这个俩个参数：

 

// metrics参数 和 views参数
    NSDictionary *metrics = @{@"Height":@30 , @"Width":@200};
    <span style="color:#ff6666;">NSDictionary *views = NSDictionaryOfVariableBindings(fl,sl);</span>

metrics中的参数在VFL中有用到，就是format

 

views主要用在多控件的时候；

通过下面的水平和垂直设置实现：第二个控件和第一个控件等高同宽(如下)；也可以自己定义宽度和高度

@"H:|-50-[sl(==fl)]"

@"V:[fl]-30-[sl(==fl)]"

 

 

 


 

运行结果对比：

 

   

（竖屏）

 

    

（横屏）