实战项目：通讯录 UI—第十一天

 1、推出视图的两种方式：

 1.通过导航控制器push到下一个界面,使用pop返回到上一个界面

 2.通过模态的形式推出视图，不需要依赖于导航控制器,通过使用present到下一个界面，通过dismiss返回到上一个界面
 如何选择使用哪种视图的推出方法？

 秘诀:看视图之间的依赖关系
 1.当下一个页面要展示的数据依赖于上一个界面使用push

 2.当上一个界面依赖于下一个界面的数据时使用present

2、当前一个界面要展示的数据，依赖于后一个界面时，此时使用模态的形式推出视图，模态：是一种新的视图推出方式

图片素材：  
   

通讯录实战所需素材：http://pan.baidu.com/s/1o6nFol8

———————————————————————————————

ContactListTableViewController.m

#import
"ContactListTableViewController.h"

#import
"AddContactViewController.h"

#import
"DetailContactController.h"

#import
"CustomCell.h"

#import
"Contacter.h"

-
(void)viewDidLoad
{
   
[super
viewDidLoad];

   
[self
configureNavigatinControllerBarContent];

}

//配置导航条的内容

- (void)configureNavigatinControllerBarContent{
   
//设置title

   
self.navigationItem.title
=
@"通讯录";
   
//设置左边添加联系人按钮

   
UIBarButtonItem
*leftItem =
[[UIBarButtonItem
alloc]initWithImage:[UIImage
imageNamed:@"add_contact"]style:(UIBarButtonItemStylePlain)
target:self
action:@selector(handleAdd:
)];
   
self.navigationItem.leftBarButtonItem
=
leftItem;
       
//配置导航条的背景颜色

   
self.navigationController.navigationBar.barTintColor
=
[UIColor
orangeColor];
   
//配置导航条内容的颜色

   
self.navigationController.navigationBar.tintColor
=
[UIColor
whiteColor];
   
//修改title的字体颜色

   
NSDictionary
*dic =
@{NSForegroundColorAttributeName
:
[UIColor
whiteColor]};

   
   
self.navigationController.navigationBar.titleTextAttributes
=
dic;
   
//右侧导航条为编辑按钮

    self.navigationItem.rightBarButtonItem
=
self.editButtonItem;

  

}
#pragma mark
添加联系人按钮的方法
-
(void)handleAdd:
(UIBarButtonItem
*)leftItem{

   
NSLog(@"添加联系人");
   
//当前一个界面要展示的数据，依赖于后一个界面时，此时使用模态的形式推出视图，模态：是一种新的视图推出方式
   
//先创建要推出的试图控制器对象

   
AddContactViewController
*addVC
=[[AddContactViewController
alloc]init];

   
   //给模态出来的视图控制添加导航控制器

   
UINavigationController
*navogationVC
= [[UINavigationController
alloc]initWithRootViewController:addVC];

   
   
//配置模态出现的样式

   
navogationVC.modalTransitionStyle
=
UIModalTransitionStyleFlipHorizontal;

   
   
//UIModalTransitionStyleCoverVertical
= 0,
   
//UIModalTransitionStyleFlipHorizontal,

   
//UIModalTransitionStyleCrossDissolve,

   //UIModalTransitionStylePartialCurl

 
 

   
//模态不依赖于导航控制器，所以不需要拿到导航控制器

   
[self
presentViewController:navogationVC
animated:YES
completion:^{

       //推出视图之后要做的一些操作，可以写在这里 

   
}];
   
   
[addVC release];

}

- (void)didReceiveMemoryWarning
{
   
[super
didReceiveMemoryWarning];

   
//
Dispose of any resources that can be recreated.
}

#pragma mark - Table view data
source

-
(NSInteger)numberOfSectionsInTableView:(UITableView
*)tableView
{

   
return
10;

}

-
(NSInteger)tableView:(UITableView
*)tableView
numberOfRowsInSection:(NSInteger)section
{

   
return
10;

}

-
(UITableViewCell
*)tableView:(UITableView
*)tableView
cellForRowAtIndexPath:(NSIndexPath
*)indexPath
{

static
NSString
*idntifer
= @"cell";

   CustomCell
*cell =
[tableView dequeueReusableCellWithIdentifier:idntifer];

   
if
(cell
== nil)
{
       
cell = [[CustomCell
alloc]initWithStyle:(UITableViewCellStyleValue1)
reuseIdentifier:idntifer];

    }
   
//准备一个字典，使用给Model对象赋值

   
NSDictionary
*dic =
@{@"name":@"小韩哥",@"gender'":@"女",@"age":@"18",@"says":@"我爱编程",@"phone":@"7788521",@"imageName":@"1.png"};
//给model类赋值Contecter

   
Contacter
*contacter =
[[Contacter
alloc]init];

   
contacter.name
=
dic[@"name"];

   
   
//使用KVC赋值

   
[contacter setValuesForKeysWithDictionary:dic];

   
   
cell.photoView.image
=
contacter.image;

   
cell.nameLabel.text
=
contacter.name;

   
cell.phoneLabel.text
=
contacter.phone;

 
  

//   
NSLog(@"%@-
%@-%@-%@-%@-%@",contacter.name,contacter.age,contacter.gender,contacter.phone,contacter.says,contacter.image);//打印看是否取到Model数据的value值

   
return
cell;
}
#pragma mark
点击cell触发事件
-
(void)tableView:(UITableView
*)tableView
didSelectRowAtIndexPath:(NSIndexPath
*)indexPath{

   DetailContactController
*detailVC =
[[DetailContactController
alloc]init];

   
[self.navigationController
pushViewController:detailVC
animated:YES];

   
[detailVC release];

}
//通过代理返回cell的行高

- (CGFloat)tableView:(UITableView
*)tableView
heightForRowAtIndexPath:(NSIndexPath
*)indexPath{

   return
90;

}

——————————————————————————————————

添加联系人：

AddContactViewController.m

#import
"AddContactViewController.h"

#import
"CustomView.h"
@interface
AddContactViewController
()<</span>UIActionSheetDelegate,UIImagePickerControllerDelegate,UINavigationControllerDelegate>

@property(nonatomic,retain)CustomView
*aview;

@end

@implementation
AddContactViewController

- (void)dealloc{

   
self.aview
=
nil;

   
[super
dealloc];

}
- (void)loadView{

   
self.aview
=
[[CustomView
alloc]initWithFrame:[UIScreen
mainScreen].bounds];

   
self.view
=
self.aview;

   
[self.aview
release];

}

-
(void)viewDidLoad
{
   
[super
viewDidLoad];

   
self.view.backgroundColor
=
[UIColor
cyanColor];

   
[self
configureNavigationBarContent];
   
//调用手势方法

   
[self
addTapGesture];

   
}
//给aImageView
视图添加轻拍手势
- (void)addTapGesture{

   
UITapGestureRecognizer
*tap =
[[UITapGestureRecognizer
alloc]initWithTarget:self
action:@selector(handleTap
: )];
   
   
[self.aview.aImageView
addGestureRecognizer:tap];

   
[tap release];

}
//实现轻拍手势的方法

- (void)handleTap
: (UITapGestureRecognizer
*)tap{
//添加ActionSheet控件
提示选项框
   
UIActionSheet
*actionSheet =
[[UIActionSheet
alloc]initWithTitle:nil
delegate:self
cancelButtonTitle:@"取消"
destructiveButtonTitle:@"拍照"
otherButtonTitles:@"从手机中选择",
nil];
   
//在当前界面显示actionSheet对象

   
[actionSheet showInView:self.view];

   
[actionSheet release];

}

- (void)actionSheet:(UIActionSheet
*)actionSheet
clickeonAtIndex:(NSInteger)buttonIndex{

   
switch
(buttonIndex)
{
       
case
0:
           
//拍照

           
NSLog(@"拍照");

           
[self
pickerPictureFromCamera];

           
break;

           
case
1:
           
//从相册中读取照片

           
NSLog(@"从相册中读取照片");

           
[self
pickerPictureFormPhotoAlbum];

           
break;

       
default:

           
break;

    }
}
//拍照

- (void)pickerPictureFromCamera{
   
//判断前摄像头是否可以使用
BOOL
isCameera =
[UIImagePickerController
isCameraDeviceAvailable:UIImagePickerControllerCameraDeviceFront];
//   
UIImagePickerControllerCameraDeviceFront  前摄像头
//   
UIImagePickerControllerCameraDeviceRear 
//后摄像头
   
if
(!isCameera)
{
       
NSLog(@"没有摄像头可以使用");

       
return;

    }
   
//初始化图片选择控制器对象

   
UIImagePickerController
*imagePicker =
[[UIImagePickerController
alloc]init];
   
//设置图片选择器选取图片的样式

   
imagePicker.sourceType
=
UIImagePickerControllerSourceTypePhotoLibrary;
   
//设置取出来的图片是否允许编辑

   
imagePicker.allowsEditing
=
YES;

   
//设置代理
 

   
imagePicker.delegate
=
self;
  必须同时遵循UIImagePickerControllerDelegate,UINavigationControllerDelegate
 两个协议

   
//把手机相机推出来

   
[self
presentViewController:imagePicker
animated:YES
completion:nil];

   
[imagePicker release];

 
 }

//从相册中取出相片

- (void)pickerPictureFormPhotoAlbum{

   
UIImagePickerController
*imagePicker =
[[UIImagePickerController
alloc]init];
   
//设置图片格式

   
imagePicker.sourceType
=
UIImagePickerControllerSourceTypePhotoLibrary;
   
//设置允许编辑

   
imagePicker.allowsEditing
=
YES;
   
//设置代理

   
imagePicker.delegate
=
self;

   
   
[self
presentViewController:imagePicker
animated:YES
completion:nil];

   
[imagePicker release];

}

-
(void)imagePickerController:(UIImagePickerController
*)picker
didFinishPickingMediaWithInfo:(NSDictionary
*)info{
   
//从字典中取出编辑的key值，对应的照片

   
self.aview.aImageView.image
=
[info objectForKey:UIImagePickerControllerEditedImage];
   
//自己推出来的自己收回去

   
[self
dismissViewControllerAnimated:YES
completion:nil];

}

//配置导航条

- (void)configureNavigationBarContent{

   
self.navigationItem.title
=
@"添加联系人";
   
//配置导航条背景颜色

   
self.navigationController.navigationBar.barTintColor
=
[UIColor
orangeColor];
   
//配置内容页的渲染颜色

   
self.navigationController.navigationBar.tintColor
=
[UIColor
whiteColor];
   
//配置字体颜色

   
NSDictionary
*dic =
@{NSForegroundColorAttributeName
:
[UIColor
whiteColor]};

   
self.navigationController.navigationBar.titleTextAttributes
=
dic;
   
   
//左侧取消按钮

   
UIBarButtonItem
*leftItem =
[[UIBarButtonItem
alloc]initWithImage:[UIImage
imageNamed:@"clsose"]
style:(UIBarButtonItemStylePlain)
target:self
action:@selector(hanlBack
: )];
   
   
self.navigationItem.leftBarButtonItem
=
leftItem;
   
//释放

   
[leftItem release];
   
//右侧保存按钮

   UIBarButtonItem
*rightItem =
[[UIBarButtonItem
alloc]initWithImage:[UIImage
imageNamed:@"doneR"]
style:(UIBarButtonItemStylePlain)
target:self
action:@selector(handleSave
: )];

  self.navigationItem.rightBarButtonItem
=
rightItem;  

}
#pragma mark
取消按钮的实现
-
(void)hanlBack
:  (UIBarButtonItem
*)item{
   
//返回上一级界面

   
[self
dismissViewControllerAnimated:YES
completion:nil];

   
}
#pragma mark
保存按钮的实现
-
(void)handleSave
: (UIBarButtonItem
*)item{
   
//保存数据操作

   
//保存数据后同样返回上一个界面

   
[self
dismissViewControllerAnimated:YES
completion:nil];

}

添加联系人效果：

——————————————————————————————

详情界面：与上面添加联系人界面大同小异

DetailContactController.m

#import
"DetailContactController.h"

#import
"CustomView.h"
@interface
DetailContactController
()<</span>UIActionSheetDelegate,UINavigationControllerDelegate,UIImagePickerControllerDelegate>
@property(nonatomic,retain)CustomView
*aView;

@end

@implementation
DetailContactController

- (void)dealloc{

   
self.aView
=
nil;

   
[super
dealloc];

}

-
(void)loadView{

   
self.aView
=
[[CustomView
alloc]initWithFrame:[UIScreen
mainScreen].bounds];

   
self.view
=
self.aView;

   
[self.aView
release];

}

//控制self.aView
的交互事件方法
- (void)closeUserInteractionByBool
: (BOOL)isTure{
   
//根据传进来的参数决定self.aView交互是否打开

   
self.aView.userInteractionEnabled
= isTure;
   

}

-
(void)viewDidLoad
{
   
[super
viewDidLoad];

   
self.view.backgroundColor
=
[UIColor
whiteColor];
//配置导航条的内容

   
[self
configureNavigationBarContent];
   
//进来详情页面先不能编辑

   
[self
closeUserInteractionByBool:NO];
   
//调用添加手势的方法

   
[self
addTapGesture]; 

}
 //添加aImageView添加轻拍手势

- (void)addTapGesture{

   UITapGestureRecognizer
*tap =
[[UITapGestureRecognizer
alloc]initWithTarget:self
action:@selector(handleTap
: )];

   
[self.aView.aImageView
addGestureRecognizer:tap];

    [tap
release];

}
//实现轻拍手势的方法

- (void)handleTap
:  (UITapGestureRecognizer
*)tap{
   
UIActionSheet
*actionSheet =
[[UIActionSheet
alloc]initWithTitle:nil
delegate:self
cancelButtonTitle:@"取消"
destructiveButtonTitle:@"拍照"
otherButtonTitles:@"从手机中选择",
nil];
   
//当前界面显示actionSheet对象

   
[actionSheet showInView:self.view];

   
[actionSheet release];

   
}
- (void)actionSheet:(UIActionSheet
*)actionSheet
clickeonAtIndex:(NSInteger)buttonIndex{

   
switch
(buttonIndex)
{
       
case
0:

           
[self 
pickerPictureFromCamera];

           
NSLog(@"没有摄像头可以使用");

           
break;

           
case
1:

           
[self
pickerPictureFromPhotoAlbum];

           
break;

       
default:

           
break;

    }
}
//配置导航条的内容

- (void)configureNavigationBarContent{

   
self.navigationItem.title
=
@"详情";
   
//左侧配置编辑按钮

   
UIBarButtonItem
*leftItem =
[[UIBarButtonItem
alloc]initWithImage:[UIImage
imageNamed:@"btn_backItem"]
style:(UIBarButtonItemStylePlain)
target:self
action:@selector(handleBack:)];

   
self.navigationItem.leftBarButtonItem
=
leftItem;
   
[leftItem release];
   
//配置右侧按钮

   self.navigationItem.rightBarButtonItem
=
self.editButtonItem;

}
//拍照

- (void)pickerPictureFromCamera{
   
//判断前摄像头是否可以使用

   
BOOL
isCamera =
[UIImagePickerController
isCameraDeviceAvailable:UIImagePickerControllerCameraDeviceFront];

   
if
(!isCamera)
{
       
return;

    }
   
//初始化图片是选择器对象

   
UIImagePickerController
*imagePicker =
[[UIImagePickerController
alloc]init];
   
//设置图片选择器选取图片的样式

   
imagePicker.sourceType
=
UIImagePickerControllerSourceTypePhotoLibrary;
   
//设置取出来的图片是否允许编辑

   
imagePicker.allowsEditing 
= YES;
   
//设置代理

   
imagePicker.delegate
=
self;
   
//把手机相机推出来

   
[self
presentViewController:imagePicker
animated:YES
completion:nil];

   
[imagePicker release];  

}
//从相册中取相片

- (void)pickerPictureFromPhotoAlbum{

   
UIImagePickerController
*imagePicker =
[[UIImagePickerController
alloc]init];
   
//设置图片格式

   
imagePicker.sourceType
=
UIImagePickerControllerSourceTypePhotoLibrary;
   
//设置是否允许编辑

   
imagePicker.allowsEditing
=
YES;
   
//设置代理

   
imagePicker.delegate
=
self;

   
[self
presentViewController:imagePicker
animated:YES
completion:nil];

}
- (void)imagePickerController:(UIImagePickerController
*)picker
didFinishPickingMediaWithInfo:(NSDictionary
*)info{
   
//从字典中取出编辑的key值，对应的照片

   
self.aView.aImageView.image
=
[info objectForKey:UIImagePickerControllerEditedImage];
   
//自己推出来自己收回去

   
[self
dismissViewControllerAnimated:YES
completion:nil];

}

#pragma mark
重写编辑按钮的方法

-
(void)setEditing:(BOOL)editing
animated:(BOOL)animated{

   
[super
setEditing:editing
animated:animated];

   
//调用交互的方法

   
//editing ==
YES  可以编辑 editing == NO
不可以编辑

   
[self
closeUserInteractionByBool:editing];

}

//实现back的方法

- (void)handleBack:
(UIBarButtonItem
*)back{

   
//保存数据的方法

  

   
//返回上一个界面

   
[self.navigationController
popViewControllerAnimated:YES];

}

详情界面编辑效果：

————————————————————————————————————

CustomCell 和CustomView
 自定义cell和自定义视图布局不做详细介绍！

2、懒加载方法：

CustomCell.h

@property(nonatomic,retain)UIImageView
*photoView;
@property(nonatomic,retain)UILabel
*nameLabel;

@property(nonatomic,retain)UILabel
*phoneLabel;

CustomCell.m

-
(id)initWithStyle:(UITableViewCellStyle)style
reuseIdentifier:(NSString
*)reuseIdentifier{

   
if
(self
=
[super
initWithStyle:style
reuseIdentifier:reuseIdentifier])
{
       
//布局操作写在这里

       
[self.contentView
addSubview:self.photoView];

       
[self.contentView
addSubview:self.nameLabel];

       
[self.contentView
addSubview:self.phoneLabel]; 
  

   
}

   
return
self;

}

//懒加载创建cell上的自定义控件

-
(UIImageView
*)photoView{

   
if
(_photoView
==
nil)
{
       
self.photoView
=
[[[UIImageView
alloc]initWithFrame:CGRectMake(10,
5,
80,
80)]autorelease];

       
self.photoView.layer.cornerRadius
=
40.0;

       
self.photoView.layer.masksToBounds
=
YES;

       self.photoView.backgroundColor
=
[UIColor
brownColor]; 

   
}

   
//添加安全机制

   
return
[[_photoView
retain]autorelease];
 
注意：系统提供的持有对象有时也会crash所以retain再release更安全！

}

-
(UILabel
*)nameLabel{

   
if
(_nameLabel
==
nil)
{
       
self.nameLabel
=
[[[UILabel
alloc]initWithFrame:CGRectMake(100,
18,
100,
25)]autorelease];

       
self.nameLabel.backgroundColor
=
[UIColor
brownColor];

       
self.nameLabel.layer.cornerRadius
=
7;

       
self.nameLabel.layer.masksToBounds
=
YES;

    }
   
return
[[_nameLabel
retain]autorelease];

}

- (UILabel
*)phoneLabel{

   
if
(_phoneLabel
==
nil)
{
       
self.phoneLabel
=
[[[UILabel
alloc]initWithFrame:CGRectMake(100,
48,
160,
25)]autorelease];

       
self.phoneLabel.backgroundColor
=
[UIColor
brownColor];

       
self.phoneLabel.layer.cornerRadius
=
7;

       
self.phoneLabel.layer.masksToBounds
=
YES;

    }
   
return
[[_phoneLabel
retain]autorelease];

}

——————————————————————————————————

欢迎学习本文，未经许可，禁止转载！

时间： 2024-09-08 21:00:30

实战项目：通讯录&amp;nbsp;UI—第十一天的相关文章

iOS按照视频在已有项目里面添加集成UI，出现ARC Semantic Issue问题。

问题描述 iOS按照视频在已有项目里面添加集成UI,出现ARC Semantic Issue问题. 解决方案 这个问题一般应该是c++和oc混编时出现,一般就是在应用oc文件的时候,如果是在Pch文件里引用的,需要加个#ifdef __OBJC__import xxxx // 把你的头文件都加到这个#if中#endif 这样处理.解决方案二:other link 设置 ,依赖库  项   截图下解决方案三: 解决方案四:预编译文件加了么   预编译文件的路径设置了么解决方案五:还是解决不了.这问

c语言-Silverlight项目笔记1：UI控件与布局、MVVM、数据绑定

问题描述 Silverlight项目笔记1:UI控件与布局.MVVM.数据绑定 Silverlight项目笔记1:UI控件与布局.MVVM.数据绑定.await/async.Linq查询.WCF RIA Services.序列化.委托与事件 最近从技术支持转到开发岗,做Silverlight部分的开发,用的Prism+MVVM,框架由同事搭好,目前做的主要是功能实现,用到了一些东西,侧重于如何使用,总结如下: 1.UI控件与布局 2.MVVM 3.数据绑定 4.await/async 5.Lin

C#网络编程技术FastSocket实战项目演练

一.FastSocket课程介绍         .NET框架虽然微软提供了socket通信的类库,但是还有很多事情要自己处理,比如TCP协议需要处理分包.组包.粘包.维护连接列表等,UDP协议需要处理丢包.乱序,而且对于多连接并发,还要自己处理多线程等等.本期分享课程阿笨给大家带来的是来源于github开源Socket通信中间件:FastSocket,目的就是把大家从繁琐的网络编程技术中彻底地解放和释放出来.         阿笨只想安安静静的学习下网络编程技术Socket后,将学习的成果直接

C#网络编程技术SuperSocket实战项目演练

一.SuperSocket课程介绍 1.1.本期<C#网络编程技术SuperSocket实战项目演练>课程阿笨给大家带来三个基于SuperSocket通讯组件的实战项目演示实例: ● 基于SuperSocket开发的客户端和服务端聊天应用程序(ABenNET.SuperSocket.AppChat). ● 基于SuperWebSocket开发的客户端和服务端聊天应用程序(ABenNET.SuperWebSocket.AppChat). ● 基于SuperWebSocket开发的网页端和服务端聊

08Vue.js快速入门-Vue综合实战项目

8.1. 前置知识学习 npm 学习 官方文档 推荐资料 npm入门 npm介绍 需要了解的知识点 package.json 文件相关配置选项 npm 本地安装.全局安装.本地开发安装等区别及相关命令 npm script脚步的基本编写能力 有时间专门写一个这样的专题,如果需要可以邮件我.malun666@126.com webpack基础学习 官方文档 Webpack了解的知识点: webpack的基本配置 了解webpack常用的loader: less-loader.sass-loader

【SSH网上商城项目实战14】商城首页UI的设计

版权声明:尊重博主原创文章,转载请注明出处哦~http://blog.csdn.net/eson_15/article/details/51373403 目录(?)[+]         前面我们利用EasyUI和SSH搭建好了后台的基本框架,做好了后台的基本功能,包括对商品类别的管理和商品的管理等,这一节我们开始搭建前台页面. 做首页的思路:假设现在商品的业务逻辑都有了,首先我们需要创建一个监听器,在项目启动时将首页的数据查询出来放到application里,即在监听器里调用后台商品业务逻辑的

甲骨文推ControlsFX开源项目，JavaFX的UI控件集

JavaFXhttp://www.aliyun.com/zixun/aggregation/7155.html">开发人员近期宣布了一个名为"ControlsFX"的开源项目,该项目旨在为JavaFX开发提供更多的UI控件和其他工具. 该项目主要针对JavaFX 8.0(捆绑在JDK 8中),考虑到JavaFX中已经包含了一些控件,ControlsFX只会包含新的控件和功能,并且还有一个完善的javadoc文档. ControlsFX包含的主要特性如下: 1.  按钮栏

Bootstrap作品展示站点实战项目2_javascript技巧

假设我们已经想好了要给自己的作品弄一个在线站点.一如既往,时间紧迫.我们需要快一点,但作品展示效果又必须专业.当然,站点还得是响应式的,能够在各种设备上正常浏览,因为这是我们向目标客户推销时的卖点.这个项目可以利用Bootstrap的很多内置特性,同时也将根据需要对Bootstrap进行一些定制. 1.设计目标 虽然对大屏幕中的展示效果已经胸有成竹,但我们还应该从小设备开始,强迫自己聚焦在关键的要素上面. 这个作品展示站点应该具有下列功能: □ 带Logo的可折叠的响应式导航条: □ 重点展示四

Bootstrap企业网站实战项目4_javascript技巧

上一章有对个人作品站点进行一些优化.本章,轮到我们充实这个作品站点了,补充一些项目,从而展示我们的能力.换句话说,我们要构建一个相对复杂的企业网站主页. 下面有几个成功企业的网站: □ Zappos (http://www.zappos.com/) □ Amazon (https://www.amazon.com/) 尽管这些网站网站各有特色,但共同的一点就是它们都很复杂. 如果按照区域划分,可以将这些网站的主页分成三部分. □ 页头区:这一部分包含Logo.带下拉菜单的主导航.二级和实用链接导